This article will show you how to make your application support various screen sizes through the following methods:
Make your layout fully adaptive to the screen
Load the appropriate UI Layout Based on the screen Configuration
Make sure that the correct layout is applied on the right device Screen
Images that can be automatically scaled according to the screen size are provided
Use "wrap_content" and "match_parent"
To ensure that your layout can adapt to different screen sizes, you should use "wrap_content" and "match_parent" in the Layout View to determine its width and height. If you use "wrap_content", the width and height of the corresponding view will be set to the minimum value that can contain the content in the view. If you use "match_parent" (called "fill_parent" before Android API 8), the view width and height will be extended to the full parent layout.
You can use "wrap_content" and "match_parent" to define the size of a view instead of hard-coding. Your view either uses only a space on the other side, or all available space will be filled. For example:
[Html] <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android"
Android: orientation = "vertical"
Android: layout_width = "match_parent"
Android: layout_height = "match_parent">
<LinearLayout android: layout_width = "match_parent"
Android: id = "@ + id/linearLayout1"
Android: gravity = "center"
Android: layout_height = "50dp">
<ImageView android: id = "@ + id/imageView1"
Android: layout_height = "wrap_content"
Android: layout_width = "wrap_content"
Android: src = "@ drawable/logo"
Android: paddingRight = "30dp"
Android: layout_gravity = "left"
Android: layout_weight = "0"/>
<View android: layout_height = "wrap_content"
Android: id = "@ + id/view1"
Android: layout_width = "wrap_content"
Android: layout_weight = "1"/>
<Button android: id = "@ + id/categorybutton"
Android: background = "@ drawable/button_bg"
Android: layout_height = "match_parent"
Android: layout_weight = "0"
Android: layout_width = "120dp"
Style = "@ style/CategoryButtonStyle"/>
</LinearLayout>
<Fragment android: id = "@ + id/headlines"
Android: layout_height = "fill_parent"
Android: name = "com. example. android. newsreader. HeadlinesFragment"
Android: layout_width = "match_parent"/>
</LinearLayout>
<LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android"
Android: orientation = "vertical"
Android: layout_width = "match_parent"
Android: layout_height = "match_parent">
<LinearLayout android: layout_width = "match_parent"
Android: id = "@ + id/linearLayout1"
Android: gravity = "center"
Android: layout_height = "50dp">
<ImageView android: id = "@ + id/imageView1"
Android: layout_height = "wrap_content"
Android: layout_width = "wrap_content"
Android: src = "@ drawable/logo"
Android: paddingRight = "30dp"
Android: layout_gravity = "left"
Android: layout_weight = "0"/>
<View android: layout_height = "wrap_content"
Android: id = "@ + id/view1"
Android: layout_width = "wrap_content"
Android: layout_weight = "1"/>
<Button android: id = "@ + id/categorybutton"
Android: background = "@ drawable/button_bg"
Android: layout_height = "match_parent"
Android: layout_weight = "0"
Android: layout_width = "120dp"
Style = "@ style/CategoryButtonStyle"/>
</LinearLayout>
<Fragment android: id = "@ + id/headlines"
Android: layout_height = "fill_parent"
Android: name = "com. example. android. newsreader. HeadlinesFragment"
Android: layout_width = "match_parent"/>
</LinearLayout> note how to use "wrap_content" and "match_parent" in the above example to define the width and height of the control, so that the entire layout can properly adapt to different screen sizes, even a landscape screen.
The result of this layout is displayed on the vertical screen and landscape screen respectively. Note that the width and height of the control are adaptive to the screen.
Use RelativeLayout
You can use multi-layer nested LinearLayout and the combination of "wrap_content" and "match_parent" to build a complex enough layout. However, LinearLayout does not allow you to accurately control the positional relationships between subviews. All subviews in LinearLayout can be simply arranged one by one. If you want to make the sub-view more arranged, rather than simply arranging a row or column, using RelativeLayout will be a better solution. RelativeLayout allows the layout of child controls to control the position of the control by using relative positioning. For example, you can set a child View to the left of the screen and align another child View to the right of the screen.
For example:
[Html]
<? Xml version = "1.0" encoding = "UTF-8"?>
<RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android"
Android: layout_width = "match_parent"
Android: layout_height = "match_parent">
<TextView
Android: id = "@ + id/label"
Android: layout_width = "match_parent"
Android: layout_height = "wrap_content"
Android: text = "Type here:"/>
<EditText
Android: id = "@ + id/entry"
Android: layout_width = "match_parent"
Android: layout_height = "wrap_content"
Android: layout_below = "@ id/label"/>
<Button
Android: id = "@ + id/OK"
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_below = "@ id/entry"
Android: layout_alignParentRight = "true"
Android: layout_marginLeft = "10dp"
Android: text = "OK"/>
<Button
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_toLeftOf = "@ id/OK"
Android: layout_alignTop = "@ id/OK"
Android: text = "Cancel"/>
</RelativeLayout>