Android first---常见布局

时间:2023-03-08 17:54:53

###绝对布局AbsoluteLayout
    * android:layout_x="120dp"   在水平方向上偏移120像素
    * android:layout_y="54dp"    在垂直方向偏移54
###相对布局RelativeLayout
    * 组件默认左对齐、顶部对齐
    * 设置组件在指定组件的右边
         android:layout_toRightOf="@id/tv1"
    * 设置在指定组件的下边
        android:layout_below="@id/tv1"
    * 设置右对齐父元素
        android:layout_alignParentRight="true"
    * 设置与指定组件右对齐
         android:layout_alignRight="@id/tv1"
###线性布局LinearLayout
    * android:orientation="horizontal"  在水平方向上线性布局
    * android:orientation="vertical"    在垂直方向上线性布局
    * 设置右对齐
        android:layout_gravity="right"
    * 当竖直布局时,只能左右对齐和水平居中,顶部底部对齐竖直居中无效
    * 当水平布局时,只能顶部底部对齐和竖直居中
    * 使用match_parent时注意不要把其他组件顶出去
    * 线性布局非常重要的一个属性:权重
        android:layout_weight="1"
    * 权重设置的是按比例分配剩余的空间
###帧布局FrameLayout
    * 默认组件都是左对齐和顶部对齐,每个组件相当于一个div
    * 可以更改对齐方式     android:layout_gravity="bottom"
    * 不能相对于其他组件布局
###表格布局TableLayout
    * 每个<TableRow/>节点是一行,它的每一个节点是一列
    * 表格布局中的节点可设置宽高无效
        * 根节点<TableLayout/>的子节点宽为匹配父元素,高为包裹内容
        * <TableRow/>节点的子节点宽为包裹内容,高为包裹内容
        * 根节点<TableLayout/>的节点宽为匹配父元素,高位包裹内容
        * 以上默认属性无法修改
    *根节点中可以设置一下属性,表示让第一列拉伸填满宽度的剩余空间
        * android:stretchColumns="1"

案例一(帧布局):

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

<TextView
        android:layout_width="240dp"
        android:layout_height="240dp"
        android:background="#FF0000"
        android:layout_gravity="center"
        />
    <TextView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:background="#00FF00"
        android:layout_gravity="center"
        />
    <TextView
        android:layout_width="160dp"
        android:layout_height="160dp"
        android:background="#0000FF"
        android:layout_gravity="center"
        />
    <TextView
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:background="#FFFF00"
        android:layout_gravity="center"
        />
    <TextView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:background="#FF00FF"
        android:layout_gravity="center"
        />
     <TextView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:background="#FFFFFF"
        android:layout_gravity="center"
        />
</FrameLayout>

布局结果: 

  Android first---常见布局

案例二(线性布局);

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    
    <LinearLayout
        android:layout_weight="1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        >
        <TextView
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="#ff0000"
            />
        <TextView
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="#ffffff"
            />
        <TextView
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="#000000"
            />
        <TextView
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:background="@android:color/darker_gray"
            />
    </LinearLayout>

<LinearLayout
        android:layout_weight="1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="vertical"
        >
        <TextView
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:background="#00ff00"
            />
        <TextView
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:background="@android:color/darker_gray"
            />
        <TextView
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:background="#000000"
            />
        <TextView
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:background="#ffcc0000"
            />
    </LinearLayout>
</LinearLayout>

事例结果:

  Android first---常见布局

案例三 相对布局:

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

<Button
        android:id="@+id/center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="中间"
        android:layout_centerInParent="true"
        />
    
    <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="上边"
        android:layout_above="@id/center"
        android:layout_alignRight="@id/center"
        android:layout_alignLeft="@id/center"
        />
    <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="下边"
        android:layout_below="@id/center"
        android:layout_alignRight="@id/center"
        android:layout_alignLeft="@id/center"
        />
    
    <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="左边"
        android:layout_toLeftOf="@id/center"
        android:layout_alignTop="@id/center"
        android:layout_alignBottom="@id/center"
        android:layout_alignParentLeft="true"
        />
    <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="右边"
        android:layout_toRightOf="@id/center"
        android:layout_alignTop="@id/center"
        android:layout_alignBottom="@id/center"
        android:layout_alignParentRight="true"
        />
    
    <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="左上"
        android:layout_toLeftOf="@id/center"
        android:layout_above="@id/center"
        android:layout_alignParentLeft="true"
        />
    <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="左下"
        android:layout_toLeftOf="@id/center"
        android:layout_below="@id/center"
        android:layout_alignParentLeft="true"
        />
    
     <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="右上"
        android:layout_toRightOf="@id/center"
        android:layout_above="@id/center"
        android:layout_alignParentRight="true"
        />
    <Button
        android:id="@+id/above"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="右下"
        android:layout_toRightOf="@id/center"
        android:layout_below="@id/center"
        android:layout_alignParentRight="true"
        />
</RelativeLayout>

事例结果:

  Android first---常见布局

案例四(表格布局):

 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="1"
    >
    <TableRow
        >
        <TextView
            android:layout_column="1"
            android:text="open"
            />
        <TextView
            android:gravity="right"
            android:text="Ctrl-O"
            />
    </TableRow>
    <TableRow >
        <TextView
            android:layout_column="1"
            android:text="save"
            />
        <TextView
            android:gravity="right"
            android:text="Ctrl-S"
            />
        </TableRow>
    <TableRow
        >
        <TextView
            android:text="  "
            />
        <TextView
            android:text="save AS"
            />
        <TextView
            android:text="Ctrl-shift-S"
            />
    </TableRow>
    
    <TextView
        android:layout_height="1dp"
        android:background="#000000"
        />
    
    <TableRow
        
        >
        <TextView
            android:text="X"
            />
        <TextView
            android:layout_span="2"
            android:text="Import"
            />
        
    </TableRow>
    <TableRow
        
        >
         <TextView
            android:text="X"
            />
        <TextView
            android:text="Export"
            />
        <TextView
            android:gravity="right"
            android:text="Ctrl-E"
            />
    </TableRow>
     <TextView
        android:layout_height="1dp"
        android:background="#000000"
        />
    <TableRow
        
        >
        <TextView
            android:layout_column="1"
            android:layout_span="2"
            android:text="Quit"
            />
        
    </TableRow>

</TableLayout>

事例结果:  

  Android first---常见布局