Your SlideShare is downloading. ×
Android Meetup Lightning Talk
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Android Meetup Lightning Talk

590

Published on

Published in: Technology, News & Politics
1 Comment
1 Like
Statistics
Notes
  • Really nice Presentation. I gained a lot from this. thanks
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
590
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
1
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Transcript

    • 1. Optimizing layouts fordifferent screen sizes Irene Duke Founder & CEO Angle Labs 03/27/2012
    • 2. Phone Layout
    • 3. Countdown TextView<TextView android:id="@+id/countdown_text" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="10" android:ellipsize="end" android:gravity="center" android:singleLine="true" android:textColor="@color/white" android:textSize="64sp" />
    • 4. Cancel Button<Button android:id="@+id/cancel_timer_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:paddingLeft="25dp" android:paddingRight="25dp" android:text="@string/cancel" />
    • 5. Tablet Layout
    • 6. Tablet Layout
    • 7. Multiple xml layoutsUse multiple xml layouts for different screensizes• layout• layout-small• layout-large• layout-xlarge
    • 8. Multiple xml layoutsOnly do this when defining completelydifferent layouts• Rearranging views on screen• Adding views to screen
    • 9. dimens.xml and styles.xmldimens.xml• dp - density-independent pixels• sp - scale-independent pixelsstyles.xml• properties such as padding, font size, font style, background color, and much more
    • 10. dimens.xmlvalues <dimen name="button_side_padding">25dp</dimen> <dimen name="countdown_text_size">64sp</dimen>values-large <dimen name="button_side_padding">50dp</dimen> <dimen name="countdown_text_size">164sp</dimen>values-small...values-xlarge...
    • 11. Countdown TextView<TextView android:id="@+id/countdown_text" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="10" android:ellipsize="end" android:gravity="center" android:singleLine="true" android:textColor="@color/white" android:textSize="@dimen/ countdown_text_size" />
    • 12. Cancel Button<Button android:id="@+id/cancel_timer_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:paddingLeft="@dimen/ button_side_padding" android:paddingRight="@dimen/ button_side_padding" android:text="@string/cancel" />
    • 13. Before
    • 14. After
    • 15. styles.xmlvalues<style name="ButtonStyle"> <item name="android:paddingLeft">@dimen/ button_side_padding</item> <item name="android:paddingRight">@dimen/ button_side_padding</item></style>
    • 16. styles.xml values-large<style name="ButtonStyle"> <item name="android:paddingLeft">@dimen/ button_side_padding</item> <item name="android:paddingRight">@dimen/ button_side_padding</item> <item name="android:textSize">32sp</item> <item name="android:textStyle">bold</item></style>
    • 17. Cancel Button<Button android:id="@+id/cancel_timer_button" android:layout_width="wrap_content" android:layout_height="wrap_content" style="@style/ButtonStyle" android:text="@string/cancel" />
    • 18. Before
    • 19. After
    • 20. Conclusion• Benefits of using dimens.xml and styles.xml instead of multiple layout resources • Smaller .apk sizes • Easier to maintain• Use multiple layout files only when creating completely different layouts

    ×