Your SlideShare is downloading. ×
  • Like
Android design patterns
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Android design patterns


Slides from the guru session about Android Design Patterns and tools held at Appsterdam / Bouncespace at 20/10/2012

Slides from the guru session about Android Design Patterns and tools held at Appsterdam / Bouncespace at 20/10/2012

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
  • I'm having problem to design circle page indicator.I'm a android beginner,Please help me to design that,how to add library for that,and it's functionality.I need solution.
    Are you sure you want to
    Your message goes here
  • Very good presentation. I will recommend it to my students. Thank you, Raul!
    Are you sure you want to
    Your message goes here
No Downloads


Total Views
On SlideShare
From Embeds
Number of Embeds



Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

    No notes for slide


  • 1. Android Design Patterns Raul Portales @sla_shalafi Platty Soft @plattysoft
  • 2. Why?Good Design = Happy Users
  • 3. Device Independent DesignSave yourself time and headaches
  • 4. Device Independent Design● Use dips● Prefer Relative Layouts● Qualify dimensions as resources – Best way to move to tablets
  • 5. Fragments Design for phones and tabletsReuse as much code as you can
  • 6. 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).
  • 7. Using Fragments● Fragments are only available 3.0+● Gingerbread is still on 50%+ of devices
  • 8. Compat LibraryBrings Fragments back to 1.6
  • 9. Fragments: Detail View
  • 10. Fragments: Detail View
  • 11. 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
  • 12. Fragments● onCreateView● onViewCreated● getActivity● getArguments
  • 13. 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
  • 14. FragmentManager● findFragmentById● findFragmentByTag● FragmentTransactionFragmentManager fm = getSupportFragmentManager();FragmentTransaction ft = fm.beginTransaction();ft.replace(, MyFragment.newInstance());ft.commitAllowingStateLoss();
  • 15. Fragments: View PagerThe most useful utility of Fragments
  • 16. Fragments: View Pager
  • 17. The tech side● MainActivity● FragmentPagerAdapter – Fragments
  • 18. Show me the Code < android:id="@+id/pager" android:layout_width="fill_parent" android:layout_height="0px" android:layout_weight="1"/> </LinearLayout>ViewPager pager = (ViewPager) findViewById(;pager.setAdapter(adapter);
  • 19. Action BarMain improvement in 3.0 and 4.0 Has been around since 2009
  • 20. 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.
  • 21. Action Bar1.App icon2.View control3.Action buttons4.Action overflow
  • 22. Action Buttons● Frequent● Important● Typical
  • 23. Show me the Codepublic boolean onCreateOptionsMenu(Menu menu) { MenuInflater inflater = getMenuInflater(); inflater.inflate(, 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>
  • 24. The Action Bar is NOT part of the Compat Library
  • 25. ActionBarSherlock● Deprecated from Inception – Same class names, different packages● Based on the Compat library● From Android 2.x up
  • 26. Using ABS● Add ABS as library● Use the theme for your App● getActionBar → getSupportActionBar● Activity → SherlockActivity● FragmentActivity → SherlockFragmentActivity● Fragment → SherlockFragment● And so on...
  • 27. ViewPageIndicatorYou have seen it in the screenshots Combined with a ViewPager
  • 28. ViewPageIndicator
  • 29. 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(;mIndicator.setViewPager(pager);
  • 30. Navigation Styles● Top navigation tabs – For a clear landing page● Dashboard – For a set of important options● Drawer – Combined with a landing page
  • 31. Navigation Styles Vs.
  • 32. Testing on devices
  • 33. Testing on devices
  • 34. Testing on devices
  • 35. Testing on devices
  • 36. 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
  • 37. To know more...● Android Design Site:● Google I/O videos, specially day 3● ActionBarSherlock● ViewPageIndicator
  • 38. Android Design Patterns Raul Portales @sla_shalafi Platty Soft @plattysoft