Short Intro to Android Fragments

2,569 views
2,408 views

Published on

Published in: Technology, News & Politics
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,569
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Short Intro to Android Fragments

  1. 1. Building  a  Dynamic  UI  with   Fragments   Jussi  Pohjolainen  
  2. 2. About  Fragments   •  Fragments  are  “subac'vity”;  modular  sec>on   inside  the  ac>vity.   •  You  can  add  and  remove  fragments  at   run>me   •  Fragment  has  it’s  own  UI  (.xml  file)   •  Feature  that  came  in  API  Level  11  -­‐>  need  to   have  support  library  if  targe>ng  older  devices  
  3. 3. Design  Philosophy  
  4. 4. Crea>ng  a  Fragment   •  Subclass  of  Fragment   •  Implement  lifecycle  methods  that  are  similar  to   Ac>vity’s.   –  onCreate, onStart, onPause, onStop.. •  Implement  at  least   –  onCreate •  Ini>alize  essen>al  components   –  onCreateView •  Return  View  –  object  that  is  the  root  of  your  fragment’s  layout   –  onPause •  User  is  leaving  the  fragment  
  5. 5. Example  Fragment:  MainActivity.java public class MainActivity extends Activity { @Override public void onCreate(Bundle b) { super.onCreate(b); setContentView(R.layout.main); } }
  6. 6. Example  Fragment:  main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" > <fragment android:id="@+id/fragment1" android:name="com.example.fragmentexample.LeftFragment" android:layout_width="0dp" android:layout_weight="0.5" android:layout_height="match_parent" /> <fragment android:id="@+id/fragment2" android:name="com.example.fragmentexample.RightFragment" android:layout_width="0dp" android:layout_weight="0.5" android:layout_height="match_parent" /> </LinearLayout>
  7. 7. Example  Fragment:  LeftFragment.java public class LeftFragment extends Fragment { public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { Button tv = new Button(getActivity()); tv.setText("left!"); return tv; } }
  8. 8. Example  Fragment:  RightFragment.java public class RightFragment extends Fragment { public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { Button tv = new Button(getActivity()); tv.setText("right!"); return tv; } }
  9. 9. Fragment  may  hold  XML  too!   public class RightFragment extends Fragment { public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // Let’s remove these // Button tv = new Button(getActivity()); // tv.setText("right!"); // return tv; // Creates Java object from the given XML file. View view = inflater.inflate(R.layout.right_fragment, // The xml file container, false); return view; } }
  10. 10. FragmentManager •  FragmentManager  class  provides  methods   that  allow  you  to  add,  remove  and  replace   fragments  to  on  ac>vity  at  run>me.   •  Don’t  add  fragments  to  .xml,  but  perform   transac>on  in  Java   •  See:     –  https://developer.android.com/training/basics/ fragments/fragment-ui.html
  11. 11. FragmentManager:     GeYng  reference  to  fragments   // Activity has getFragmentManager() – method! FragmentManager fragmentManager = getFragmentManager(); ChooseTitleFragment ctf = (ChooseTitleFragment) fragmentManager.findFragmentById(R.id.choose);
  12. 12. Communica>on  Between  Fragments   •  Build  each  Fragment  UI  as  separate!   •  Do  Fragment  -­‐>  Fragment  communica>on   through  Ac>vity   •  Fragment  A  -­‐>  Ac8vity   – Use  your  own  interface,  ac>vity  can  be  whatever   •  Ac8vity  -­‐>  Fragment  B   – Use  FragmentManager  to  get  a  reference  to   Fragment  B  and  call  it’s  public  methods  
  13. 13. public class ButtonFragment extends Fragment { // Helper interface for communicating with Activity public interface OnButtonClickedListener { public void buttonClicked(); } // Host Activity is here private OnButtonClickedListener callback; // When creating this fragment, host activity must be given and it must // implement OnButtonClickedListener interface. Method is called when fragment has // been associated with activity. The Activity is passed here! @Override public void onAttach(Activity activity) { super.onAttach(activity); callback = (OnButtonClickedListener) activity; } public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // Creates Java object from the given XML file. View view = inflater.inflate(R.layout.button_fragment, // The xml file container, false); Button sent = (Button) view.findViewById(R.id.button1); // When button is clicked, call activity's buttonClicked method sent.setOnClickListener(new OnClickListener() { @Override public void onClick(View arg0) { callback.buttonClicked(); } }); return view; } }
  14. 14. Ac>vity   public class MainActivity extends Activity implements ButtonFragment.OnButtonClickedListener { @Override public void onCreate(Bundle b) { super.onCreate(b); // Holds ButtonFragment setContentView(R.layout.main); } // This is called when button is pressed in the fragment! @Override public void buttonClicked() { } }
  15. 15. Basic  Idea:  How?  
  16. 16. Use  layout/  directories   •  layout/main.xml   – One  dim  layout  (holds  Fragment  A)   •  layout-­‐land/main.xml   – Two  dim  layout  (holds  Fragment  A  +  B)   •  layout-­‐large/main.xml   – Two  dim  layout  (holds  Fragment  A  +  B)  
  17. 17. public class MainActivity extends Activity implements ButtonFragment.OnButtonClickedListener { @Override public void onCreate(Bundle b) { super.onCreate(b); // Holds either two-dim or on-dim layout! hold either // 1) left-pane or // 2) left-pane and right-pane setContentView(R.layout.main); } // This is called when button is pressed in the fragment! @Override public void buttonClicked() { // Let's get a reference to the right fragment RightPaneFragment rightPaneFragment = (RightPaneFragment) getFragmentManager() .findFragmentById(R.id.right_fragment); // If it's not accessible, we are in one-dim layout if (rigthPaneFragment == null) { startNewActivity(); } else { updateRightPane(); } } private void startNewActivity() { Intent showContent = new Intent(this, RightActivityPane.class); // This activity holds RightPaneFragment startActivity(showContent); } private void updateRightPane(RightPaneFragment rightPaneFragment) { rightPaneFragment.doSomething(); } }

×