Android 布局 ViewGroup

布局

res/layout

命名规则(全部小写)

activity_

fragment_

item_

基础组件

com.android.widget包下

父类View

view：屏幕上一块矩阵区域

能在xml中设置的都是view，除了特殊标签。

引用使用@符号

　　1、background:@drawable引用图片  @android:color引用颜色

　　2、android:clickable可以响应点击事件

　　3、android:id 每一个组件都可以设置一个在当前xml中唯一的id号，使用@+id/来创建一个R文件中的id号，用来在java代码或xml中引用

　　4、android:padding自己与自己的内部之间的距离

　　5、android:layout_margin 布局管理器自己与外部之间的距离

　　6、android:visibility是否显示组件，visible显示，inVisible不显示但是占位，gone不显示也不占位

TextView文本框

　　用来显示文本String

　　

所有的组件都包含有的属性

　　android：表明属于android标准属性

　　使用android标准命名空间

　　　　xmlns:android="http://schemas.android.com/apk/res/android

　　前面加layout的所有属性，都属于布局

　　所有组件都必须加上的（TableLayout除外）

　　　　layout_width  宽度

　　　　layout_height 高度

　　　　match_parent  常量   与父布局相同大小，如果在根布局上，表明全屏，fill_arent过期和match_parent一样

　　　　wrap_content  常量   根据内容来确定组件的大小

　　　

TextView独有的属性

　　text 显示文本信息

　　drawableTop在四边设置一张图片

　　android:gravity  对齐

　　singleLine 单行模式

　　textColor 设置文本显示的颜色

　　textSize 设置文本大小，单位：sp 跟随用户手机字体的首选项进行调整

　　textStyle 设置文本显示样式，粗体和斜体   多个常量可以使用|连接

Button 与TextView相同

跑马灯

1、必须内容大于宽度

2、必须单行

3、设置焦点

　　android:ellipsize="marquee"

　　android:focusable="true"

　　android:focusableInTouchMode="true"

　　android:singleLine="true"　　　

 View一般用于划线

　　<View

　　　　android:layout_width="match_parent"

　　　　android:layout_height="1px"

　　　　android:background="@android:color/black"　/>

LinearLayout线性布局

　　一行或者一列只有一个元素

　　超过一个组件或者给了id必须设置方向orientation属性

　　vertical垂直   一行只有一个组件

　　horizontal水平   一列只有一个组件

　　布局可以嵌套布局

　　layout_gravity线性布局特有属性：水平时只能设置上下，垂直时只能设置水平

　　layout_weight设置按权重来调整组件大小，设置为0dp

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:background="@android:color/holo_purple"
     android:layout_height="match_parent"
     android:orientation="vertical" >
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="0dp"
         android:layout_margin="2dp"
         android:orientation="horizontal"
         android:layout_weight="1">
         <Button
             android:layout_width="0dp"
             android:layout_weight="1"
             android:layout_height="match_parent"
             android:layout_margin="1dp"
             android:textStyle="bold"
             android:textSize="20sp"
             android:text="MC"/>

     </LinearLayout>
 </LinearLayout>

TableLayout 表格布局

TableLayout 继承于LinearLayout，支持所有LinearLayout属性
添加多个TableRow，每个TableRow占一行，如果不添加TableRow直接添加组件，那么每个组件单独占一行，TableRow也是容器，每添加一个组件，就可以添加一列
 唯一一个不需要宽高的组件
 initTableLayout()初始化时，setOrientation(VERTICAL);默认设置了方向为垂直方向，所以这里设置方向无意义

 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
        android:stretchColumns="1"
        android:shrinkColumns="0"
     android:layout_height="match_parent" >

     <Button android:text="你好"/>
     <Button android:text="你好"/>

     <TableRow>
         <TextView android:text="用户名:"/>
         <EditText
             android:hint="6-16个字符"
             android:layout_weight="1"/>
     </TableRow>
     <TableRow>
         <TextView android:text="密码:"/>
         <EditText
             android:hint="6-14个字母"
             android:layout_weight="1"/>
     </TableRow>

       <TableRow
           >
           <!-- 填满整行，还用weight分配宽度 -->
           <Button android:text="1"/>
           <Button android:text="2"/>
           <Button android:text="3" />
           <Button android:text="4" />
        </TableRow> 

       <TableRow>
         <!-- android:layout_span="4" 跨越4列 -->
         <!-- <Button android:text="5"
             android:layout_span="4" /> -->
         <Button android:text="6" />
         <Button android:text="7" />
         <Button android:text="8" />

       </TableRow>

       <TableRow>
        <!--  android:layout_column="1"指定显示在第1列上，后面的组件会跟着走 -->
           <!-- <Button android:text="11"
               android:layout_column="1"/> -->
           <Button android:text="22" />
           <Button android:text="33" />
           <Button android:text="44" />
        </TableRow>

 </TableLayout>

效果图如下：

 FrameLayout 帧布局 也叫层布局

 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:orientation="vertical" >

     <!-- 一般作为容器（碎片的容器） -->
     <!-- 特效 -->
     <!--FrameLayout中的子元素总是以屏幕的左上角层叠在一起  -->
     <Button
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="aaa"/>

     <TextView android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="bbbbb"/>
 </FrameLayout>

效果图如下

AbsoluteLayout 绝对布局  已过期

RelativeLayout相对布局

 <!-- 默认以左上角为原点 -->
 <!-- 4组方法 -->
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent" >

 <!-- 1、居中方式  相对于父窗体   三种居中方式-->
 <!--   android:layout_centerInParent="true"  布局的正中心 -->
 <!-- android:layout_centerVertical="true"  布局的垂直居中 -->
 <!-- android:layout_centerHorizontal="true" 布局的水平居中 -->

     <Button
         android:id="@+id/center"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_centerInParent="true"
         android:text="正中心"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_centerVertical="true"
         android:text="垂直居中" />

      <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_centerHorizontal="true"
         android:text="水平居中" />

 <!--2、与父窗体的对齐方式   在父窗体的左右上下  -->
 <!-- android:layout_alignParentLeft="true"  -->
 <!-- android:layout_alignParentRight="true" -->
 <!-- android:layout_alignParentTop="true" -->
 <!-- android:layout_alignParentBottom="true" -->

    <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentLeft="true"
         android:layout_alignParentTop="true"
         android:text="左上角"/>

    <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentRight="true"
         android:layout_alignParentTop="true"
         android:text="右上角"/>

    <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentLeft="true"
         android:layout_alignParentBottom="true"
         android:text="左下角"/>

    <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentBottom="true"
         android:layout_alignParentRight="true"
         android:text="右下角"/>

 <!-- 3、相对其他组件的位置 -->
 <!-- android:layout_above="@id/center"  在id的上面 -->
 <!-- android:layout_below="@id/center" 在id的下面 -->
 <!-- android:layout_toLeftOf="@id/center" 在id的左边-->
 <!-- android:layout_toRightOf="@id/center" 在id的右边 -->
    <Button
        android:id="@+id/top"
        android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_above="@id/center"
         android:layout_centerHorizontal="true"
         android:text="上"/>

    <Button
        android:id="@+id/down"
        android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_below="@id/center"
         android:layout_centerHorizontal="true"
         android:text="下"/>

    <Button
        android:id="@+id/left"
        android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_toLeftOf="@id/center"
         android:layout_centerVertical="true"
         android:text="左"/>

     <Button
         android:id="@+id/right"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_toRightOf="@id/center"
         android:layout_centerVertical="true"
         android:text="右"/>

 <!-- 4、相对于其他组件的对齐方式 -->
 <!--android:layout_alignLeft="@id/left" 与id组件左对齐  -->
 <!--android:layout_alignRight="@id/right" 与id组件右对齐  -->
 <!--android:layout_alignTop="@id/top" 与id组件上对齐  -->
 <!--android:layout_alignBottom="@id/down" 与id组件下对齐  -->
     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_above="@id/left"
         android:layout_alignLeft="@id/left"
         android:layout_alignTop="@id/top"
         android:text="A"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_above="@id/right"
         android:layout_alignRight="@id/right"
         android:layout_alignTop="@id/top"
         android:text="B"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_below="@id/left"
         android:layout_alignLeft="@id/left"
         android:layout_alignBottom="@id/down"
         android:text="C"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_below="@id/right"
         android:layout_alignRight="@id/right"
         android:layout_alignBottom="@id/down"
         android:text="D"/>

 </RelativeLayout>

效果图如下：

GridLayout网格布局    4.0新增特性

 <GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:columnCount="5" >
     <!-- 设置列数 -->

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="1"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="2"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="3"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="4"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="5"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="6"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="7"/>

     <Button android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="8"/>
 </GridLayout>

效果图如下：