Android Fragment-Awesome

AndroidFragment-Awesome Matthew Gaunt

Who is this guy?• Master in Computer Science in Bristol• Senior Android Dev @ Mubaloo• Cross Platform Dev @ Future Platforms

What Fragmentation?

What’s coming up• Design - I can haz pretty • Dips • Buckets? • What buckets? • The story of buckets• Tips + Examples

DipsDensity Independent PixelsAbstract the screen size (think roundedcorner rectangle)Never assume dip > pixels

Buckets?ldpi mdpi hdpi xhdpi

What Buckets?Screen density (ldpi, mdpi, hdpi, xhdpi)Orientation (port, land)Android Version (v4, v11)Screen size (small, normal, large, xlarge)

Eeks lots of Images

How to use Buckets• Images - [ldpi, mdpi, hdpi, xhdpi] [small, normal, large, xlarge]• Layout -[land, port]• Themes / Styles - [v4, v11]• Dimensions - [small, normal, large, xlarge]

The History...

The History...<port> land 1.5

The History... ldpi<port> mdpi land hdpi 1.5 1.6

The History... small ldpi normal<port> mdpi large land hdpi xlarge 1.5 1.6 3.0 (ish)

The History... small ldpi normal ldpi mdpi<port> mdpi large hdpi land hdpi xlarge xhdpi 1.5 1.6 3.0 (ish) 4.0

Recap• Lots of buckets• Lots of resources to apply the buckets to• How it relates to other platforms like iOS

Random.

Phones / Tablets? ldpi mdpi hdpi xhdpi totalSmall 1.7% 2.4% 4.1%Normal 0.7% 18.5% 66.3% 2.5% 88.0%Large 0.2% 2.8% 3.0%XLarge 4.9% 4.9% ldpi mdpi mdpi hdpi ? hdpi ? xhdpi ? xhdpi ? Phones Tablets normal / small large / xlarge

Hitting Both?drawable For all bucketsdrawable-ldpidrawable-mdpi Basedrawable-hdpidrawable-xhdpidrawable-large-? Additionaldrawable-xlarge-?

Tips to Reduce Work 1 Use values everywhere (dimens, ints, etc.)

Tips to Reduce Workvalues dimens.xml <resources> <dimen name="default_text_size">20sp</dimen> <dimen name="default_large_text_size">30sp</dimen> <dimen name="splash_vertical_spacing">20dp</dimen> <dimen name="gauntface_tag_bottom_spacing">20dp</dimen> <dimen name="gauntface_tag_padding">5dp</dimen> <dimen name="gauntface_tag_radius">10dp</dimen> <dimen name="splash_gauntface_progress_bar">30dp</dimen> <dimen name="generic_dialog_padding">15dp</dimen> <dimen name="generic_dialog_bg_radius">4dp</dimen> <dimen name="generic_dialog_title_spacer_height">4dp</dimen> <dimen name="generic_dialog_title_spacer_vertical_spacing">10dp</dimen> <dimen name="sync_info_padding">10dp</dimen> <dimen name="sync_info_title_text_size">35sp</dimen> <dimen name="sync_info_msg_text_size">20sp</dimen> <dimen name="sync_info_bg_radius">10dp</dimen> <dimen name="sync_info_prof_pic_radius">8dp</dimen> <dimen name="sync_info_prof_pic_size">128dp</dimen> </resources>values-land dimens.xml <resources> <dimen name="default_text_size">15sp</dimen> <dimen name="default_large_text_size">25sp</dimen> <dimen name="splash_vertical_spacing">10dp</dimen> </resources>

Tips to Reduce Work values values-land

Tips to Reduce Work 2 Learn the ways of the nine patch

Tips to Reduce Work

Tips to Reduce Work 3Use <Shape> drawables

Tips to Reduce Work<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:angle="0" android:endColor="@color/dark_blue" android:gradientRadius="660" android:startColor="@color/splash_light_blue" android:type="radial" /></shape>

Tips to Reduce Work

Tips to Reduce Work 4 Use Themes & Styles www.gauntface.co.uk/blog/2011/01/18/android-ui-reference

Tips to Reduce Workvalues themes.xml <resources> <style name="Theme.FacebookSync" parent="@style/Theme.FacebookSync.Support"> ... </style> <style name="Theme.FacebookSync.NoTitleBar"> ... </style> <style name="Theme.FacebookSync.Dialog" parent="@style/Theme.Dialog.Support"> ... </style> </resources>values-v11 themes-v11.xml <resources> <style name="Theme.FacebookSync.Support" parent="@android:style/Theme.Holo"></style> <style name="Theme.Dialog.Support" parent="@android:style/Theme.Holo.Dialog"></style> </resources>values-v4 themes-v4.xml <resources> <style name="Theme.FacebookSync.Support" parent="@android:style/Theme.NoTitleBar"></style> <style name="Theme.Dialog.Support" parent="@android:style/Theme.Dialog"></style> </resources>

Tips to Reduce Work

Tips to Reduce Work 5Give up control - be ﬂuid

Tips to Reduce Work Note: Not the best example ;)

Tips to Reduce Work

You’re Results May Vary

Thanks :) @gauntfacematt@gauntface.co.uk

http://www.gauntface.co.uk	377
http://blog.gauntface.co.uk	198
http://gauntface-blog.localhost	13
http://ranksit.com	1

Android Fragment-Awesome

by GauntFace

Accessibility

Categories

Upload Details

Usage Rights

4 Embeds 589

Statistics

Android Fragment-Awesome Presentation Transcript