Your SlideShare is downloading. ×
0
Android Design Patterns           Raul Portales           @sla_shalafi           Platty Soft           @plattysoft
Why?Good Design = Happy Users
Device Independent DesignSave yourself time and headaches
Device Independent Design●   Use dips●   Prefer Relative Layouts●   Qualify dimensions as resources       –   Best way to ...
Fragments Design for phones and tabletsReuse as much code as you can
Fragments●   A Fragment represents a behavior or a portion    of user interface in an Activity.●   You can think of a frag...
Using Fragments●   Fragments are only available 3.0+●   Gingerbread is still on 50%+ of devices
Compat LibraryBrings Fragments back to 1.6
Fragments: Detail View
Fragments: Detail View
The tech side●   MasterFragment●   DetailFragment●   Qualify layouts        –   xlarge-land → 2 fragments        –   norma...
Fragments●   onCreateView●   onViewCreated●   getActivity●   getArguments
Common Pitfalls●   Be aware of the Constructor!!●   The Activity may not be always there       –   It may have been destro...
FragmentManager●   findFragmentById●   findFragmentByTag●   FragmentTransactionFragmentManager fm = getSupportFragmentMana...
Fragments: View PagerThe most useful utility of Fragments
Fragments: View Pager
The tech side●   MainActivity●   FragmentPagerAdapter       –   Fragments
Show me the Code <android.support.v4.view.ViewPager        android:id="@+id/pager"        android:layout_width="fill_paren...
Action BarMain improvement in 3.0 and 4.0 Has been around since 2009
Action Bar●   Provide a dedicated space for identifying the    application brand and user location.●   Provide consistent ...
Action Bar1.App icon2.View control3.Action buttons4.Action overflow
Action Buttons●   Frequent●   Important●   Typical
Show me the Codepublic boolean onCreateOptionsMenu(Menu menu) {    MenuInflater inflater = getMenuInflater();    inflater....
The Action Bar is NOT part of the Compat Library
ActionBarSherlock●   Deprecated from Inception       –   Same class names, different packages●   Based on the Compat libra...
Using ABS●   Add ABS as library●   Use the theme for your App●   getActionBar → getSupportActionBar●   Activity → Sherlock...
ViewPageIndicatorYou have seen it in the screenshots   Combined with a ViewPager
ViewPageIndicator
Show me the Code<com.viewpagerindicator.TitlePageIndicator     android:id="@+id/indicator"     android:padding="10dip"    ...
Navigation Styles●   Top navigation tabs       –   For a clear landing page●   Dashboard       –   For a set of important ...
Navigation Styles       Vs.
Testing on devices
Testing on devices
Testing on devices
Testing on devices
Doing more with less●   Gingerbread, hdpi, normal → Nexus One●   Jelly Bean, xhdpi → Galaxy Nexus●   Froyo, mdpi → HTC Mag...
To know more...●   Android Design Site:    http://developer.android.com/design●   Google I/O videos, specially day 3    ht...
Android Design Patterns           Raul Portales           @sla_shalafi           Platty Soft           @plattysoft
Android design patterns
Android design patterns
Android design patterns
Upcoming SlideShare
Loading in...5
×

Android design patterns

4,588

Published on

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

2 Comments
3 Likes
Statistics
Notes
  • 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.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Very good presentation. I will recommend it to my students. Thank you, Raul!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
4,588
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
102
Comments
2
Likes
3
Embeds 0
No embeds

No notes for slide

Transcript of "Android design patterns"

  1. 1. Android Design Patterns Raul Portales @sla_shalafi Platty Soft @plattysoft
  2. 2. Why?Good Design = Happy Users
  3. 3. Device Independent DesignSave yourself time and headaches
  4. 4. Device Independent Design● Use dips● Prefer Relative Layouts● Qualify dimensions as resources – Best way to move to tablets
  5. 5. Fragments Design for phones and tabletsReuse as much code as you can
  6. 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. 7. Using Fragments● Fragments are only available 3.0+● Gingerbread is still on 50%+ of devices
  8. 8. Compat LibraryBrings Fragments back to 1.6
  9. 9. Fragments: Detail View
  10. 10. Fragments: Detail View
  11. 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. 12. Fragments● onCreateView● onViewCreated● getActivity● getArguments
  13. 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. 14. FragmentManager● findFragmentById● findFragmentByTag● FragmentTransactionFragmentManager fm = getSupportFragmentManager();FragmentTransaction ft = fm.beginTransaction();ft.replace(R.id.mainFragment, MyFragment.newInstance());ft.commitAllowingStateLoss();
  15. 15. Fragments: View PagerThe most useful utility of Fragments
  16. 16. Fragments: View Pager
  17. 17. The tech side● MainActivity● FragmentPagerAdapter – Fragments
  18. 18. 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);
  19. 19. Action BarMain improvement in 3.0 and 4.0 Has been around since 2009
  20. 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. 21. Action Bar1.App icon2.View control3.Action buttons4.Action overflow
  22. 22. Action Buttons● Frequent● Important● Typical
  23. 23. Show me the Codepublic 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>
  24. 24. The Action Bar is NOT part of the Compat Library
  25. 25. ActionBarSherlock● Deprecated from Inception – Same class names, different packages● Based on the Compat library● From Android 2.x up
  26. 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. 27. ViewPageIndicatorYou have seen it in the screenshots Combined with a ViewPager
  28. 28. ViewPageIndicator
  29. 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(R.id.indicator);mIndicator.setViewPager(pager);
  30. 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. 31. Navigation Styles Vs.
  32. 32. Testing on devices
  33. 33. Testing on devices
  34. 34. Testing on devices
  35. 35. Testing on devices
  36. 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. 37. 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/
  38. 38. Android Design Patterns Raul Portales @sla_shalafi Platty Soft @plattysoft
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×