Download - Ts android supporting multiple screen
Boutique product development company It is amazing what you can accomplish when you have a client-centric team to deliver outstanding products.
Supporting Multiple Screens on Android
Arsalan Anwar | Android Mentor
Supporting Multiple Screens on Android Topics covered in the presentation
• Target Audience
• Android Devices
• Dimensions
• Density Independence
• Screen size
• Solutions
• Providing alternative resources
• Range of screens supported
Arsalan Anwar | Android Mentor
• Create Bitmaps, Gradient via XML
• Nine Patch Images
• Free Android Tool SDK/Tools/Draw9 Patch
• Styles, Dimensions, and Layouts
• Android assets studio can save your time
• Pencil with Android stencils
• Technical details and references
Supporting multiple screens on Android
Target Audience
Arsalan Anwar | Android Mentor
• Mobile developers
• Designer for graphics assets for Android devices
• Designer for graphics assets for Android apps
• Beginning developers for Android apps
Supporting multiple screens on Android
Android devices
Arsalan Anwar | Android Mentor
• Android OS is available in 3997 distinct Android
phonesEach Device has different then other by
colors , style. OS , Screen Size , Screen
ResolutionAndroid has set Screen Sizes standards
Supporting multiple screens on Android
Android devices
Arsalan Anwar | Android Mentor
• Screen sizeScreen
densityOrientationResolutionDensity-independent
pixel (dp):
Supporting multiple screens on Android
Dimensions
Arsalan Anwar | Android Mentor
❑ px Screen pixels
❑ in Physical inches
❑ pt Physical points
❑ mm Physical millimeters
❑ dp Density-independent pixels relative to a 160-dpi screen
❑ sp Scale-independent pixels
Supporting multiple screens on Android
Density independence
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Density independence
Arsalan Anwar | Android Mentor
Resolution is well-managed by Android, but density
might blur graphics assets
ldpi = 120 36 x 36 px
mdpi = 160 48 x 48 px
hdpi = 240 72 x 72 px
xhdpi = 320 96 x 96 px
Supporting multiple screens on Android
Density independence
Arsalan Anwar | Android Mentor
Screen snapshot on a hdpi device
Resolution is well-managed by Android, but density
might blur graphics assets
Supporting multiple screens on Android
Density-independent pixel (dp) - new virtual unit for conceptual design
Arsalan Anwar | Android Mentor
dp
xlarge screens > 960 dp x 720 dp
large screens > 640 dp x 480 dp
normal screens > 470 dp x 320 dp
small screens > 426 dp x 320 dp
Supporting multiple screens on Android
Screen Sizes
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Solutions
Arsalan Anwar | Android Mentor
• User Alternative Layouts and ImagesCreate
Bitmap/Gradient via XMLUser 9-patch ImagesUser
Styles/Dimension for Layouts
Supporting multiple screens on Android
Providing Alternative Resources
Arsalan Anwar | Android Mentor
Almost every application should provide alternative
resources to support specific device configurations.
For instance, you should include alternative drawable
resources for different screen densities and alternative
string resources for different languages. At runtime,
Android detects the current device configuration and
loads the appropriate resources for your application.
Supporting multiple screens on Android
Providing Alternative Resources
Arsalan Anwar | Android Mentor
Directory Resource Type
animator/ XML files that define property animations.
anim/ XML files that define tween animations.
color/ XML files that define a state list of colors. See Color State List Resource
drawable/ Bitmap files (.png, .9.png, .jpg, .gif) or XML files that are compiled into the following drawable
resource subtypes: Bitmap files, Nine-Patches (re-sizable bitmaps), State lists, Shapes,
Animation , drawables ,Other drawables
layout/ XML files that define a user interface layout. See Layout Resource.
menu/ XML files that define application menus, such as an Options Menu, Context Menu etc
raw/ Arbitrary files to save in their raw form.
values/ XML files that contain simple values, such as strings, integers, and colors.
arrays.xml for resource arrays (typed arrays).
colors.xml for color values
dimens.xml for dimension values.
strings.xml for string values.
styles.xml for styles.
See String Resources, Style Resource, and More Resource Types.
xml/ Arbitrary XML files that can be read at runtime by calling Resources.getXML().
Supporting multiple screens on Android
Providing Alternative Resources
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Providing Alternative Resources
Arsalan Anwar | Android Mentor
Configuration Qualifier Values
Language and region Examples: en, fr ,en-rUS, fr-rFR,fr-rCA, etc.
smallestWidth sw<N>dp Examples: sw320dp, sw600dp, sw720dp,etc.
Available width w<N>dp Examples: w720dp,w1024dp,etc.
Available height h<N>dp Examples: h720dp,h1024dp,etc.
Screen size Small,normal,large, xlarge
Screen aspect Long, notlong
Screen orientation Port,land
Dock mode Car, desk
Night mode Night, notnight
Screen pixel density (dpi) Ldpi,mdpi,hdpi,xhdpi,nodpi,tvdpi
Touchscreen type Notouch,stylus,finger
Keyboard availability Keysexposed,keyshidden,keyssoft
Supporting multiple screens on Android
Range of Screen Supported cont.
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Range of Screen Supported cont
Arsalan Anwar | Android Mentor
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="@drawable/single_tile"
android:tileMode="repeat" />
Supporting multiple screens on Android
NicePatch Images
Arsalan Anwar | Android Mentor
A NinePatchDrawable graphic is a stretchable bitmap image, which
Android will automatically resize to accommodate the contents of the
View in which you have placed it as the background. An example use of
a NinePatch is the backgrounds used by standard Android buttons —
buttons must stretch to accommodate strings of various lengths. A
NinePatch drawable is a standard PNG image that includes an extra 1-
pixel-wide border. It must be saved with the extension .9.png, and saved
into the res/drawable/ directory of your project.
Supporting multiple screens on Android
Free Android Tool: SDK/tools/draw9patch
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Free Android Tool: SDK/tools/draw9patch
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Styles , Dimension for Layouts
Arsalan Anwar | Android Mentor
• A style is a collection of properties that specify the
look and format for a View or window. A style can
specify properties such as height, padding, font
color, font size, background color, and much more.
A style is defined in an XML resource that is
separate from the XML that specifies the
layout.Styles in Android share a similar philosophy
to cascading stylesheets in web design—they allow
you to separate the design from the content.
Supporting multiple screens on Android
Styles , Dimension for Layouts
Arsalan Anwar | Android Mentor
• <TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#00FF00"
android:typeface="monospace"
android:text="@string/hello" /><TextView
style="@style/CodeFont"
android:text="@string/hello" /><?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CodeFont"
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textColor">#00FF00</item>
<item name="android:typeface">monospace</item>
</style>
</resources>
Supporting multiple screens on Android
Styles , Dimension for Layouts
Arsalan Anwar | Android Mentor
• <TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#00FF00" android:textSize="14sp"
android:typeface="monospace"
android:text="@string/hello" /><TextView
style="@style/CodeFont"
android:text="@string/hello" /><?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CodeFont"
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textColor">@dimen/text_font_size</item>
<item name="android:typeface">monospace</item>
</style>
</resources><?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name=" text_font_size">14sp</dimen>
</resources>
Supporting multiple screens on Android
New Android Design site - reference
Arsalan Anwar | Android Mentor
http://developer.android.com/design/index.html
http://developer.android.com/guide/practices/ui_guidelines/icon_design.html#templatespack
Also can download official Android icon templates pack here
Supporting multiple screens on Android
Android Asset Studio can save your time
Arsalan Anwar | Android Mentor
http://j.mp/androidassetstudio
Supporting multiple screens on Android
Pencil with Android Stencils - UI prototyping Tool
Arsalan Anwar | Android Mentor
http://pencil.evolus.vn
http://code.google.com/p/android-ui-utils/
Supporting multiple screens on Android
Range of Screen Supported cont
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Range of Screen Supported cont
Arsalan Anwar | Android Mentor
Supporting multiple screens on Android
Technical details and references
Arsalan Anwar | Android Mentor
http://developer.android.com/guide/practices/screens_support.html