android界面设计之布局

绝地灬酷狼 2024-02-17 14:48 126阅读 0赞

一、线性布局

  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="match_parent"
  5. android:orientation="vertical"
  6. android:paddingBottom="@dimen/activity_vertical_margin"
  7. android:paddingLeft="@dimen/activity_horizontal_margin"
  8. android:paddingRight="@dimen/activity_horizontal_margin"
  9. android:paddingTop="@dimen/activity_vertical_margin"
  10. tools:context=".Test01Activity" >
  11. <!-- 线性布局 -->
  12. <LinearLayout
  13. android:layout_width="match_parent"
  14. android:layout_height="wrap_content"
  15. android:orientation="horizontal" >
  16. <Button
  17. android:id="@+id/btn1"
  18. android:layout_width="wrap_content"
  19. android:layout_height="wrap_content"
  20. android:text="1" />
  21. <Button
  22. android:id="@+id/btn2"
  23. android:layout_width="wrap_content"
  24. android:layout_height="wrap_content"
  25. android:text="2" />
  26. <Button
  27. android:id="@+id/btn3"
  28. android:layout_width="wrap_content"
  29. android:layout_height="wrap_content"
  30. android:text="3" />
  31. <Button
  32. android:id="@+id/btn4"
  33. android:layout_width="wrap_content"
  34. android:layout_height="wrap_content"
  35. android:text="4" />
  36. </LinearLayout>
  37. <LinearLayout
  38. android:layout_width="match_parent"
  39. android:layout_height="wrap_content"
  40. android:orientation="horizontal" >
  41. <Button
  42. android:id="@+id/btn5"
  43. android:layout_width="wrap_content"
  44. android:layout_height="wrap_content"
  45. android:text="4" />
  46. <Button
  47. android:id="@+id/btn6"
  48. android:layout_width="wrap_content"
  49. android:layout_height="wrap_content"
  50. android:text="5" />
  51. <Button
  52. android:id="@+id/btn7"
  53. android:layout_width="wrap_content"
  54. android:layout_height="wrap_content"
  55. android:text="6"
  56. android:layout_weight="1"
  57. />
  58. </LinearLayout>
  59. </LinearLayout>

结果:

Center

二、相对布局

  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. android:paddingBottom="@dimen/activity_vertical_margin"
  6. android:paddingLeft="@dimen/activity_horizontal_margin"
  7. android:paddingRight="@dimen/activity_horizontal_margin"
  8. android:paddingTop="@dimen/activity_vertical_margin"
  9. tools:context=".MainActivity" >
  10. <!-- 相对布局 -->
  11. <Button
  12. android:id="@+id/bbtn1"
  13. android:layout_width="wrap_content"
  14. android:layout_height="wrap_content"
  15. android:text="中央"
  16. android:layout_centerHorizontal="true"
  17. android:layout_centerVertical="true"
  18. />
  19. <Button
  20. android:id="@+id/bbtn2"
  21. android:layout_width="wrap_content"
  22. android:layout_height="wrap_content"
  23. android:text="左上角"
  24. android:layout_above="@id/bbtn1"
  25. android:layout_toLeftOf="@id/bbtn1"
  26. />
  27. <Button
  28. android:id="@+id/bbtn3"
  29. android:layout_width="wrap_content"
  30. android:layout_height="wrap_content"
  31. android:text="左下角"
  32. android:layout_below="@id/bbtn1"
  33. android:layout_toLeftOf="@id/bbtn1"
  34. />
  35. <Button
  36. android:id="@+id/bbtn4"
  37. android:layout_width="wrap_content"
  38. android:layout_height="wrap_content"
  39. android:text="右下"
  40. android:layout_below="@id/bbtn1"
  41. android:layout_toRightOf="@id/bbtn1"
  42. />
  43. <Button
  44. android:id="@+id/bbtn5"
  45. android:layout_width="wrap_content"
  46. android:layout_height="wrap_content"
  47. android:layout_toRightOf="@id/bbtn1"
  48. android:layout_above="@id/bbtn1"
  49. android:text="右上"
  50. />
  51. </RelativeLayout>

结果:

Center 1

三、网格布局

  1. <GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. android:layout_width="wrap_content"
  3. android:layout_height="wrap_content"
  4. android:orientation="horizontal"
  5. android:rowCount="5"
  6. android:columnCount="4" >
  7. <!-- 网络布局 -->
  8.   <Button
  9. android:id="@+id/bbtn1"
  10. android:layout_width="wrap_content"
  11. android:layout_height="wrap_content"
  12. android:text="中央"
  13. android:layout_centerHorizontal="true"
  14. android:layout_centerVertical="true"
  15. />
  16.   <Button
  17. android:id="@+id/bbtn1"
  18. android:layout_width="wrap_content"
  19. android:layout_height="wrap_content"
  20. android:text="中央"
  21. android:layout_centerHorizontal="true"
  22. android:layout_centerVertical="true"
  23. />
  24.   <Button
  25. android:id="@+id/bbtn1"
  26. android:layout_width="wrap_content"
  27. android:layout_height="wrap_content"
  28. android:text="中央"
  29. android:layout_centerHorizontal="true"
  30. android:layout_centerVertical="true"
  31. />
  32.   <Button
  33. android:id="@+id/bbtn1"
  34. android:layout_width="wrap_content"
  35. android:layout_height="wrap_content"
  36. android:text="中央"
  37. android:layout_centerHorizontal="true"
  38. android:layout_centerVertical="true"
  39. />
  40.   <Button
  41. android:id="@+id/bbtn1"
  42. android:layout_width="wrap_content"
  43. android:layout_height="wrap_content"
  44. android:text="中央"
  45. android:layout_centerHorizontal="true"
  46. android:layout_centerVertical="true"
  47. />
  48.   <Button
  49. android:id="@+id/bbtn1"
  50. android:layout_width="wrap_content"
  51. android:layout_height="wrap_content"
  52. android:text="中央"
  53. android:layout_centerHorizontal="true"
  54. android:layout_centerVertical="true"
  55. />
  56.   <Button
  57. android:id="@+id/bbtn1"
  58. android:layout_width="wrap_content"
  59. android:layout_height="wrap_content"
  60. android:text="中央"
  61. android:layout_centerHorizontal="true"
  62. android:layout_centerVertical="true"
  63. />
  64.   <Button
  65. android:id="@+id/bbtn1"
  66. android:layout_width="wrap_content"
  67. android:layout_height="wrap_content"
  68. android:text="中央"
  69. android:layout_centerHorizontal="true"
  70. android:layout_centerVertical="true"
  71. />
  72.   <Button
  73. android:id="@+id/bbtn1"
  74. android:layout_width="wrap_content"
  75. android:layout_height="wrap_content"
  76. android:text="中央"
  77. android:layout_centerHorizontal="true"
  78. android:layout_centerVertical="true"
  79. />
  80.   <Button
  81. android:id="@+id/bbtn1"
  82. android:layout_width="wrap_content"
  83. android:layout_height="wrap_content"
  84. android:text="中央"
  85. android:layout_centerHorizontal="true"
  86. android:layout_centerVertical="true"
  87. />
  88.   <Button
  89. android:id="@+id/bbtn1"
  90. android:layout_width="wrap_content"
  91. android:layout_height="wrap_content"
  92. android:text="中央"
  93. android:layout_centerHorizontal="true"
  94. android:layout_centerVertical="true"
  95. />
  96.   <Button
  97. android:id="@+id/bbtn1"
  98. android:layout_width="wrap_content"
  99. android:layout_height="wrap_content"
  100. android:text="中央"
  101. android:layout_centerHorizontal="true"
  102. android:layout_centerVertical="true"
  103. />
  104.   <Button
  105. android:id="@+id/bbtn1"
  106. android:layout_width="wrap_content"
  107. android:layout_height="wrap_content"
  108. android:text="中央"
  109. android:layout_centerHorizontal="true"
  110. android:layout_centerVertical="true"
  111. />
  112.   <Button
  113. android:id="@+id/bbtn1"
  114. android:layout_width="wrap_content"
  115. android:layout_height="wrap_content"
  116. android:text="中央"
  117. android:layout_centerHorizontal="true"
  118. android:layout_centerVertical="true"
  119. />
  120.   <Button
  121. android:id="@+id/bbtn1"
  122. android:layout_width="wrap_content"
  123. android:layout_height="wrap_content"
  124. android:text="中央"
  125. />
  126.   <Button
  127. android:id="@+id/bbtn1"
  128. android:layout_width="wrap_content"
  129. android:layout_height="wrap_content"
  130. android:layout_rowSpan="2"
  131. android:layout_gravity="fill"
  132. android:text="="
  133. />
  134.   <Button
  135. android:id="@+id/bbtn1"
  136. android:layout_width="wrap_content"
  137. android:layout_height="wrap_content"
  138. android:text="+"
  139. android:layout_columnSpan="2"
  140. android:layout_gravity="fill"
  141. />
  142.   <Button
  143. android:id="@+id/bbtn1"
  144. android:layout_width="wrap_content"
  145. android:layout_height="wrap_content"
  146. android:text="中央"
  147. />
  148. </GridLayout>

结果:

Center 2

四、表格布局

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="fill_parent"
  4. android:layout_height="fill_parent"
  5. android:orientation="vertical"
  6. android:padding="3dip" >
  7. <!-- 第1个TableLayout,用于描述表中的列属性。第0列可伸展,第1列可收缩,第2列被隐藏 -->
  8. <TableLayout
  9. android:layout_width="fill_parent"
  10. android:layout_height="wrap_content"
  11. android:stretchColumns="1"
  12. >
  13. <TableRow >
  14. <TextView android:text="nihao"/>
  15. </TableRow>
  16. <TableRow >
  17. <TextView android:text="你好ihdsakj "/>
  18. <Button android:text="你好ihdsakj "/>
  19. </TableRow>
  20. <TableRow >
  21. <Button android:text="你好ihdsakj "/>
  22. </TableRow>
  23. </TableLayout>
  24. </LinearLayout>

结果

:Center 3

发表评论

表情:
评论列表 (有 0 条评论,126人围观)

还没有评论,来说两句吧...

相关阅读

    相关 androidmerge布局

    <merge />标签闪亮登场了。当LayoutInflater遇到这个标签时,它会跳过它,并将<merge />内的元素添加到<merge />的父元素里。迷惑了吗?让我们用