DevFest 2012 - Esquartejando sua Activity com Fragments

7,982 views
7,737 views

Published on

Apresentação que realizei no evento DevFest de 2012 sobre Fragments.

Published in: Technology
1 Comment
9 Likes
Statistics
Notes
No Downloads
Views
Total views
7,982
On SlideShare
0
From Embeds
0
Number of Embeds
2,908
Actions
Shares
0
Downloads
115
Comments
1
Likes
9
Embeds 0
No embeds

No notes for slide

DevFest 2012 - Esquartejando sua Activity com Fragments

  1. 1. Esquartejando sua Activity com Fragments@SuelenGCwww.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 eunão manjo defragments :-( 10
  11. 11. O Fragment é muito mais do que apenas umpedaço de tela.Deve ser pensado como um COMPONENTE daActivity 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çõesCódigo eDescriçãodos í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.javapublic 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 issobonito???? 19
  20. 20. Código da Activity com fragments MainFragments.javapublic 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.javapublic 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.javapublic 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.javapublic 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 essaspartes 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”); FragmentFragment 27
  28. 28. Acessando um Fragment MainFragments.javapublic 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.javapublic 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.javapublic 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.javapublic 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 pelatag 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?@SuelenGCwww.suelengc.com.br 39https://github.com/SuelenGC
  40. 40. ReferênciasLivro Google Android para Tablets por Ricardo R. LechetaNovatec Editora. ISBN 9788575222928. 2012Site oficial Developer Android – Fragments por Googlehttp://developer.android.com/guide/components/fragments.htmlSite oficial Developer Android - Suportting Multiple Screens por Googlehttp://developer.android.com/guide/practices/screens_support.htmlSite oficial Developer Android - Supporting Tablets and Handsets por Googlehttp://developer.android.com/guide/practices/tablets-and-handsets.htmlSite oficial Developer Android - Activity`s Reference Library por Googlehttp://developer.android.com/reference/android/app/Activity.htmlBlog Caelum – Layouts Mais Flexíveis com Android Fragments por Erich Egerthttp://blog.caelum.com.br/layouts-mais-simples-com-android-fragmentsC|Net - Nvidia CEO: Android tablets could outsell iPad in 3 years por Lance Whitneyhttp://reviews.cnet.com/8301-19736_7-20063893-251.htmlBlog Toastdroid - Trabalhando com Fragmentshttp://toastdroid.wordpress.com/2012/08/03/trabalhando-com-fragments(Na inclusão desta referência foi constatado que o blog foi deletado) 40

×