The document discusses essential Android design patterns, emphasizing the importance of device-independent design and the use of fragments to create reusable UI components. It highlights best practices for implementing fragments, managing activity lifecycles, and using the Action Bar for navigation and user interaction. Additional resources and tools, such as ActionBarSherlock and ViewPagerIndicator, are also mentioned to aid in enhancing Android application design.

1. Android Design Patterns
Raul Portales
@sla_shalafi
Platty Soft
@plattysoft

2. Why?
Good Design = Happy Users

3. Device Independent Design
Save yourself time and headaches

5. Device Independent Design
● Use dips
● Prefer Relative Layouts
● Qualify dimensions as resources
– Best way to move to tablets

6. Fragments
Design for phones and tablets
Reuse as much code as you can

7. Fragments
● A Fragment represents a behavior or a portion
of user interface in an Activity.
● You can think of a fragment as a modular
section of an activity, which has its own
lifecycle, receives its own input events, and
which you can add or remove while the activity
is running (sort of like a "sub activity" that you
can reuse in different activities).

8. Using Fragments
● Fragments are only available 3.0+
● Gingerbread is still on 50%+ of devices

9. Compat Library
Brings Fragments back to 1.6

10. Fragments: Detail View

11. Fragments: Detail View

12. The tech side
● MasterFragment
● DetailFragment
● Qualify layouts
– xlarge-land → 2 fragments
– normal → 1 fragment
● MainActivity
– If has a detail fragment, use it
– Or write 2 different activities

13. Fragments
● onCreateView
● onViewCreated
● getActivity
● getArguments

14. Common Pitfalls
● Be aware of the Constructor!!
● The Activity may not be always there
– It may have been destroyed
– Or the fragment detached
● There is no communication among fragments
– Do it through the Activity
– Better: Use an interface

15. FragmentManager
● findFragmentById
● findFragmentByTag
● FragmentTransaction
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction ft = fm.beginTransaction();
ft.replace(R.id.mainFragment, MyFragment.newInstance());
ft.commitAllowingStateLoss();

16. Fragments: View Pager
The most useful utility of Fragments

17. Fragments: View Pager

18. The tech side
● MainActivity
● FragmentPagerAdapter
– Fragments

19. Show me the Code
<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="fill_parent"
android:layout_height="0px"
android:layout_weight="1"/>
</LinearLayout>
ViewPager pager = (ViewPager) findViewById(R.id.pager);
pager.setAdapter(adapter);

20. Action Bar
Main improvement in 3.0 and 4.0
Has been around since 2009

21. Action Bar
● Provide a dedicated space for identifying the
application brand and user location.
● Provide consistent navigation and view
refinement across different applications.
● Make key actions for the activity (such as
"search", "create", "share", etc.) prominent and
accessible to the user in a predictable way.

22. Action Bar
1.App icon
2.View control
3.Action buttons
4.Action overflow

23. Action Buttons
● Frequent
● Important
● Typical

24. Show me the Code
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main_activity, menu);
return true;
}
<menu xmlns:android="...”>
<item android:id="@+id/menu_save"
android:icon="@drawable/ic_menu_save"
android:title="@string/menu_save"
android:showAsAction="ifRoom|withText" />
</menu>

25. The Action Bar is NOT part of the Compat Library

27. ActionBarSherlock
● Deprecated from Inception
– Same class names, different packages
● Based on the Compat library
● From Android 2.x up

28. Using ABS
● Add ABS as library
● Use the theme for your App
● getActionBar → getSupportActionBar
● Activity → SherlockActivity
● FragmentActivity → SherlockFragmentActivity
● Fragment → SherlockFragment
● And so on...

29. ViewPageIndicator
You have seen it in the screenshots
Combined with a ViewPager

30. ViewPageIndicator

31. Show me the Code
<com.viewpagerindicator.TitlePageIndicator
android:id="@+id/indicator"
android:padding="10dip"
android:layout_height="wrap_content"
android:layout_width="fill_parent" />
mIndicator = (TitlePageIndicator)findViewById(R.id.indicator);
mIndicator.setViewPager(pager);

32. Navigation Styles
● Top navigation tabs
– For a clear landing page
● Dashboard
– For a set of important options
● Drawer
– Combined with a landing page

33. Navigation Styles
Vs.

34. Testing on devices

35. Testing on devices

36. Testing on devices

37. Testing on devices

38. Doing more with less
● Gingerbread, hdpi, normal → Nexus One
● Jelly Bean, xhdpi → Galaxy Nexus
● Froyo, mdpi → HTC Magic
● ICS, xlarge → Asus Transformer
● large → Nexus 7 / Galaxy Tab 7
● Honeycomb → Galaxy Tab

39. To know more...
● Android Design Site:
http://developer.android.com/design
● Google I/O videos, specially day 3
https://developers.google.com/events/io/sessions#android
● ActionBarSherlock
http://actionbarsherlock.com/
● ViewPageIndicator
http://viewpagerindicator.com/

41. Android Design Patterns
Raul Portales
@sla_shalafi
Platty Soft
@plattysoft