Android Layout learning-Layout (Layout) Details 2 (common Layout and Layout parameters)

Source: Internet
Author: User

Android Layout learning-Layout (Layout) Details 2 (common Layout and Layout parameters)
Layout Parameters (layout Parameters): in XML files, we often see Layout attributes, which are usually used to define the layout Parameters of a View, to adapt it to ViewGroup. Each ViewGroup class implements a nested class inherited from ViewGroup. LayoutParams. Subclass contains attribute types that define the size and position of each sub-View. To adapt it to ViewGroup. Next, let's take a look at an image in the official document and an XML file: 1 <! -- The root layout of activity is LinearLayout, that is, linear layout --> 2 <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" 3 xmlns: tools = "http://schemas.android.com/tools" 4 android: layout_width = "match_parent" 5 android: layout_height = "wrap_content" 6 android: background = "#0f0" 7 android: orientation = "vertical"> 8 <! -- LinearLayout has a child View named RelativeLayout --> 9 <RelativeLayout 10 android: layout_width = "wrap_content" 11 android: layout_height = "wrap_content" 12 android: background = "# f00" 13> 14 <TextView15 android: id = "@ + id/textView1InRL" 16 android: background = "# fff" 17 android: layout_width = "wrap_content" 18 android: layout_height = "wrap_content" 19 android: text = "TextView"/> 20 21 <TextView22 android: id = "@ + id/textView2InRL" 23 Android: background = "# fff" 24 android: layout_width = "wrap_content" 25 android: layout_height = "wrap_content" 26 android: text = "TextView2" 27 android: layout_toRightOf = "@ id/textView1InRL" 28/> 29 <TextView30 android: background = "# fff" 31 android: layout_width = "wrap_content" 32 android: layout_height = "wrap_content" 33 android: text = "TextView3" 34 android: layout_below = "@ id/textView2InRL" 35/> 36 </RelativeLayout> 37 <Ton 38 android: text = "Button1InLinearLayout" 39 android: layout_width = "wrap_content" 40 android: layout_height = "wrap_content" 41/> 42 <Button 43 android: text = "Button2InLinearLayout" 44 android: layout_width = "wrap_content" 45 android: layout_height = "wrap_content" 46/> 47 </LinearLayout> we can see from the above. The child element in the layout must be defined to make it suitable for its parent layout parameters, although it may define different layout parameters for its child elements. For example, in RelativeLayout, it is affected by the parent Layout: LinearLayout, and its Layout parameter affects its child element: Three textviews. Common Layouts. (If the window length exceeds the screen length, you can generate a scroll bar.) If the window length exceeds the screen length, generate a scroll bar (srollbar): Wrap the linear layout with ScrollView: 1 <LinearLayout 2 android: layout_width = "fill_parent" 3 android: layout_height = "fill_parent" 4 xmlns: android = "http://schemas.android.com/apk/res/android"> 5 <ScrollView 6 android: layout_width = "fill_parent" 7 android: layout_height = "wrap_content"> 8 <LinearLayout 9 android: layout_width = "wrap_content" 10 android: layout_height = "Wrap_content" 11 android: orientation = "vertical"> 12 <! -- Put the content in the linear layout here --> 13 </LinearLayout> 14 </ScrollView> 15 </LinearLayout> An example is provided to illustrate the linear layout: 1 <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" 2 xmlns: tools = "http://schemas.android.com/tools" 3 android: layout_width = "match_parent" 4 android: layout_height = "wrap_content" 5 android: paddingLeft = "20dp" 6 android: paddingRight = "20dp" 7 android: orientation = "vertical"> 8 <ScrollView 9 Android: layout_width = "fill_parent" 10 android: layout_height = "wrap_content" 11> 12 <LinearLayout 13 android: layout_width = "wrap_content" 14 android: layout_height = "wrap_content" 15 android: orientation = "vertical" 16> 17 <EditText18 android: layout_width = "match_parent" 19 android: layout_height = "wrap_content" 20 android: hint = "account: "/> 21 <EditText22 android: layout_width =" match_parent "23 android: layout_height =" wra P_content "24 android: hint =" Password: "/> 25 <LinearLayout 26 android: layout_width =" wrap_content "27 android: layout_height =" wrap_content "28 android: orientation = "horizontal" 29> 30 <Button 31 android: layout_width = "wrap_content" 32 android: layout_height = "wrap_content" 33 android: layout_marginLeft = "30dp" 34 android: text = "login" 35/> 36 <Button 37 android: layout_width = "wrap_content" 38 android: layout_height = "wrap_co Ntent "39 android: layout_marginLeft =" 100dp "40 android: text =" register "41/> 42 </LinearLayout> 43 <ImageView 44 android: layout_width =" match_parent "45 android: layout_height = "500dp" 46 android: src = "@ drawable/ic_launcher" 47/> 48 <TextView 49 android: layout_width = "match_parent" 50 android: layout_height = "wrap_content" 51 android: text = "LinearLayout size exceeds the screen size test" 52/> 53 </LinearLayout> 54 </ScrollView> 55 </LinearLayout> 2. Relative Layout is the same as Relative Layout. We can specify the positions of child elements in the layout by associating them (for example, Button A is under TextView B) or parent layout. By default, all child views are placed in the top left corner of the layout ). Parameters for setting the relationship between a child View and parent are shown in: also through an example to learn the related layout: 1 <RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android" 2 xmlns: tools = "http://schemas.android.com/tools" 3 android: layout_width = "match_parent" 4 android: layout_height = "match_parent" 5 tools: context = ". mainActivity "> 6 7 <! -- Android: layout_centerHorizontal sets TextView in the horizontal center --> 8 <TextView 9 android: id = "@ + id/login" 10 android: layout_width = "wrap_content" 11 android: layout_height = "wrap_content" 12 android: layout_centerHorizontal = "true" 13 android: textSize = "20sp" 14 android: text = "Logon interface"/> 15 <! -- Android: layout_marginTop = "24dp" sets the free space on the top of EditText to 24dp --> 16 <EditText 17 android: id = "@ + id/editText1" 18 android: layout_width = "wrap_content" 19 android: layout_height = "wrap_content" 20 android: layout_below = "@ id/login" 21 android: layout_centerHorizontal = "true" 22 android: layout_marginTop = "24dp" 23 android: hint = "username" 24 android: EMS = "10"> 25 26 <requestFocus/> 27 </EditText> 28 <! -- Android: layout_below = "@ + id/editText1" editText2 under editText1 --> 29 <EditText30 android: id = "@ + id/editText2" 31 android: layout_width = "wrap_content" 32 android: layout_height = "wrap_content" 33 android: layout_below = "@ + id/editText1" 34 android: layout_centerHorizontal = "true" 35 android: layout_marginTop = "27dp" 36 android: EMS = "10" 37 android: hint = "password" 38 android: inputType = "textPassword"/> 39 <! -- Android: layout_alignRight = "@ id/editText2": sets the right edge alignright of cancelButton to 40 editText2 --> 41 <Button 42 android: id = "@ + id/cancelButton" 43 android: layout_width = "wrap_content" 44 android: layout_height = "wrap_content" 45 android: layout_below = "@ id/editText2" 46 android: layout_alignRight = "@ id/editText2" 47 android: text = "cancel" 48/> 49 <! -- Android: layout_toLeftOf = "@ id/cancelButton": Click the OK Button on the left of the cancel Button --> 50 <Button 51 android: id = "@ + id/confirmButton" 52 android: layout_width = "wrap_content" 53 android: layout_height = "wrap_content" 54 android: layout_below = "@ id/editText2" 55 android: layout_toLeftOf = "@ id/cancelButton" 56 android: text = "OK" 57/> 58 59 </RelativeLayout>

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.