Successfully reported this slideshow.
Your SlideShare is downloading. ×

DevFest 2012 - Esquartejando sua Activity com Fragments

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Upcoming SlideShare
Fragmentos
Fragmentos
Loading in …3
×

Check these out next

1 of 40 Ad
Advertisement

More Related Content

Slideshows for you (20)

Similar to DevFest 2012 - Esquartejando sua Activity com Fragments (20)

Advertisement

More from Suelen Carvalho (20)

Recently uploaded (20)

Advertisement

DevFest 2012 - Esquartejando sua Activity com Fragments

  1. 1. Esquartejando sua Activity com Fragments @SuelenGC www.suelengc.com.br
  2. 2. Quem sou eu... Arquiteta de Software @SuelenGC www.suelengc.com.br suelengcarvalho@gmail.com 2
  3. 3. 3
  4. 4. Smartphone Seleciona um item do menu e inicia a Activity B Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item 7 Item 8 Item 9 Activity A contendo o menu Activity B contendo o conteúdo 4
  5. 5. O mesmo código executando em um Tablet... Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item 7 Item 8 Item 9 Activity A contendo o menu 5
  6. 6. Após seleciona um item inicia a Activity B Activity B contendo o conteúdo 6
  7. 7. Tablets are not just big phones 7
  8. 8. O que esperamos é um layout pensado para Tablets Seleciona um item e atualiza Fragment B Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item 7 Item 8 Item 9 Activity A contendo Fragment A e Fragment B 8
  9. 9. Quanto maior o espaço, + coisas vão colocar! 9
  10. 10. Putz, mas eu não manjo de fragments :-( 10
  11. 11. O Fragment é muito mais do que apenas um pedaço de tela. Deve ser pensado como um COMPONENTE da Activity MODULAR e REUTILIZÁVEL. 11
  12. 12. App da BMF Bovespa para Smartphone 12
  13. 13. App da BMF Bovespa para Tablet 13
  14. 14. App da BMF Bovespa para Tablet Gráfico do Código e pontos dos índices e índice escolhido Código e valor das ações Código e Descrição dos índices Detalhes do índice escolhido Exibição do vídeo Notícias Lista de vídeos escolhido 14
  15. 15. Algumas características técnicas... SDK versão 3.0+ (Honeycomb) Uma classe que herda de android.app.Fragment Deve sempre estar contido em uma Activity Possui seu próprio lifecycle e este é diretamente afetado pelo lifecycle da Activity Host 15
  16. 16. Activity Lifecycle vs. Fragment Lifecycle 16
  17. 17. Vamos pensar em uma tela mais simples... DevFest - Fragments Texto 2 Texto 1 Texto 3 17
  18. 18. Código da Activity sem fragments MainActivity.java public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main_layout); } //Um monte de código que controla o comportamento da tela aqui } main_layout.xml <LinearLayout ... > <!-- Bloco 1 --> <LinearLayout ... > <TextView... android:text="Texto 1" /> </LinearLayout> <LinearLayout... > <!-- Bloco 2 --> <LinearLayout ... > <TextView... android:text="Texto 2" /> </LinearLayout> <!-- Bloco 2 --> <LinearLayout ... > <TextView... android:text="Texto 3" /> </LinearLayout> </LinearLayout> </LinearLayout> 18
  19. 19. Você acha isso bonito???? 19
  20. 20. Código da Activity com fragments MainFragments.java public class MainFragments extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main_fragments); } } main_fragments.xml <LinearLayout ... > <!-- Bloco 1 --> <LinearLayout ... > <fragment... class="br.com.seu_pacote.Fragment1" android:id=“@+id/frag1" /> </LinearLayout> <LinearLayout... > <!-- Bloco 2 --> <LinearLayout ... > <fragment... class="br.com.seu_pacote.Fragment2" android:id=“@+id/frag2" /> </LinearLayout> <!-- Bloco 2 --> <LinearLayout ... > <fragment... class="br.com.seu_pacote.Fragment3" android:id=“@+id/frag3" /> </LinearLayout> </LinearLayout> </LinearLayout> 20
  21. 21. Código do Fragment 1 Fragment1.java public class Fragment1 extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment1, null); TextView text = (TextView) view.findViewById(R.id.text1); text.setText("Fragment 1"); return view; } } fragment1.xml <LinearLayout ... > <TextView... android:id=“@+id/text1" android:text="Fragment 1" /> </LinearLayout> 21
  22. 22. Código do Fragment 2 Fragment2.java public class Fragment2 extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment2, null); TextView text = (TextView) view.findViewById(R.id.text2); text.setText("Fragment 2"); return view; } } fragment2.xml <LinearLayout ... > <TextView... android:id="@+id/text2" android:text="Fragment 2" /> </LinearLayout> 22
  23. 23. Código do Fragment 3 Fragment3.java public class Fragment3 extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment3, null); TextView text = (TextView) view.findViewById(R.id.text3); text.setText("Fragment 3"); return view; } } fragment3.xml <LinearLayout ... > <TextView... android:id=“@+id/text3" android:text="Fragment 3" /> </LinearLayout> 23
  24. 24. Agora sim :) 24
  25. 25. Ao executar novamente nosso código DevFest - Fragments Fragment 2 Fragment 1 Fragment 3 25
  26. 26. Ok, mas como fazer essas partes interagirem entre si? 26
  27. 27. Acessando um Fragment Da mesma forma que podemos encontrar uma view com o método findViewById(), podemos buscar um fragment utilizando os métodos findFragmentById() ou findFragmentByTag() através do método getFragmentManager() Activity getFragmentManager().findFragmentById(“fragId”); Fragment Fragment 27
  28. 28. Acessando um Fragment MainFragments.java public class MainFragments extends Activity { ... @Override public boolean onCreateOptionsMenu(Menu menu) { MenuItem m1 = menu.add(0, 0, 0, "Alterar texto do Fragment 2"); m1.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS); return super.onCreateOptionsMenu(menu); } @Override public boolean onMenuItemSelected(int featureId, MenuItem item) { FragmentManager fm = getFragmentManager(); switch (item.getItemId()) { case 0: Fragment2 frag2 = (Fragment2) fm.findFragmentById(R.id.frag2); frag2.setTexto("Texto atualizado, graças a um click"); } return true; } } Fragment2.java public class Fragment2 extends Fragment { ... public void setTexto(String mensagem) { TextView text = (TextView) getView().findViewById(R.id.text2); text.setText(mensagem); } } 28
  29. 29. Ao executar novamente nosso código DevFest - Fragments Alterar texto do fragment 2 Texto atualizado, graças a um click Fragment 2 Fragment 1 Fragment 3 29
  30. 30. Acessando a Activity Host O método getActivity() retorna a Activity Host corrente do Fragment. getActivity().setTitle(“Novo título para a Activity”); Fragment Activity 30
  31. 31. Acessando a Activity Host Fragment2.java public class Fragment2 extends Fragment { ... public void setTexto(String mensagem) { TextView text = (TextView) getView().findViewById(R.id.text2); text.setText(mensagem); //Alterando o texto da Activity Host getActivity().setTitle("Mudando o texto a partir do Fragment"); } } 31
  32. 32. Ao executar novamente nosso código Mudando o texto a partir do Fragment Alterar texto do fragment 2 Texto atualizado, graças a um click Fragment 2 Fragment 1 Fragment 3 32
  33. 33. Transações com Fragments O método beginTransaction() possibilita adicionar, remover ou substituir um Fragment em runtime 33
  34. 34. Substituindo um Fragment MainFragments.java public class MainFragments extends Activity { ... @Override public boolean onCreateOptionsMenu(Menu menu) { ... MenuItem m2 = menu.add(0, 0, 0, "Substitui frag 1 p/ frag 3"); m2.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS); return super.onCreateOptionsMenu(menu); } @Override public boolean onMenuItemSelected(int featureId, MenuItem item) { FragmentManager fm = getFragmentManager(); switch (item.getItemId()) { ... case 1: FragmentTransaction transaction = getFragmentManager().beginTransaction(); transaction.replace(R.id.frame1, new Fragment3()); transaction.commit(); } return true; } } 34
  35. 35. Substituindo um Fragment main_fragments.xml <LinearLayout ... > <!-- Bloco 1 --> <FrameLayout ... android:id=“@+id/frame1" /> <LinearLayout... > <!-- Bloco 2 --> <LinearLayout ... > <fragment... class="br.com.seu_pacote.Fragment2" android:id=“@+id/frag2" /> </LinearLayout> <!-- Bloco 2 --> <LinearLayout ... > <fragment... class="br.com.seu_pacote.Fragment3" android:id=“@+id/frag3" /> </LinearLayout> </LinearLayout> </LinearLayout> Trocar a tag fragment pela tag FrameLayout 35
  36. 36. Ao executar novamente nosso código DevFest - Fragments Alterar texto do fragment 2 Substitui frag 1 p/ frag 3 Fragment 2 3 Fragment 1 Fragment 3 36
  37. 37. 37
  38. 38. Sim :). Existe o Android Compatibility Package, um jar que pode ser baixado pelo SDK Manager.38
  39. 39. Obrigada :)! Perguntas? @SuelenGC www.suelengc.com.br 39 https://github.com/SuelenGC
  40. 40. Referências Livro Google Android para Tablets por Ricardo R. Lecheta Novatec Editora. ISBN 9788575222928. 2012 Site oficial Developer Android – Fragments por Google http://developer.android.com/guide/components/fragments.html Site oficial Developer Android - Suportting Multiple Screens por Google http://developer.android.com/guide/practices/screens_support.html Site oficial Developer Android - Supporting Tablets and Handsets por Google http://developer.android.com/guide/practices/tablets-and-handsets.html Site oficial Developer Android - Activity`s Reference Library por Google http://developer.android.com/reference/android/app/Activity.html Blog Caelum – Layouts Mais Flexíveis com Android Fragments por Erich Egert http://blog.caelum.com.br/layouts-mais-simples-com-android-fragments C|Net - Nvidia CEO: Android tablets could outsell iPad in 3 years por Lance Whitney http://reviews.cnet.com/8301-19736_7-20063893-251.html Blog Toastdroid - Trabalhando com Fragments http://toastdroid.wordpress.com/2012/08/03/trabalhando-com-fragments (Na inclusão desta referência foi constatado que o blog foi deletado) 40

×