Android学习笔记---第一天---布局

今天刚开始学习Android,记录一下一天学习的内容。


LinearLayout//线性布局


常用属性:

android:orientation//设置LinearLayout的方向;

可用值:vertical//垂直方向;

             horizontal//水平方向

android:layout_width    //设置该控件在父控件中的宽

android:layout_height  //设置该控件在父控件中的高

可用值:wrap_content//使大小刚好足够显示控件内的内容;

             fill_parent//使大小铺满父控件的空白处;

             match_parent//与fill_parent效果相同在sdk2.2后用于取代fill_parent

android:gravity//设置的是控件自身上面的内容位置

android:layout_gravity//设置控件本身相对于父控件的显示位置

可用值:top//不改变大小,位置置于容器的顶部

             bottom//不改变大小,位置置于容器的底部

             left//不改变大小,位置置于容器的左边

             right//不改变大小,位置置于容器的右边

             center_vertical//不改变大小,位置置于容器的纵向中央部分

             center_horizontal//不改变大小,位置置于容器的横向中央部分

             center//不改变大小,位置置于容器的横向和纵向的中央部分

             fill_vertical//可能的话,纵向延伸可以填满容器

             fiil_horizontal//可能的话,横向延伸可以填满容器

             fiil//可能的话,纵向和横向延伸填满容器

android:layout_weight//控件权值,即分配个子控件之间的显示比例


代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="match_parent">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:layout_weight="0"
        android:text="ssss"
        android:background="#fc0000"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="2"
        android:background="#00ef93"/>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="3"
        android:orientation="vertical"
        >
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#f900cb"
            android:layout_weight="1"/>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#ff7300"
            android:layout_weight="1"/>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#0004f9"
            android:layout_weight="1"/>
    </LinearLayout>
</LinearLayout>

效果图:

Android学习笔记---第一天---布局_第1张图片

RelativeLayout//相对布局

常用属性:

android:layout_alignParentBottom               //如果值为true,将该控件的底部边缘与父控件的底部边缘对齐

android:layout_alignParentLeft                      //如果值为true,将该控件的左边边缘与父控件的左边边缘对齐

android:layout_alignParentReght                  //如果值为true,将该控件的右边边缘与父控件的右边边缘对齐

android:layout_alignParentTop                      //如果值为true,将该控件的顶部边缘与父控件的顶部边缘对齐

android:layout_alignCenterHorizontal          //如果值为true,将该控件的水平中央与父控件的水平中央对齐

android:layout_alignCenterVertical                //如果值为true,将该控件的垂直中央与父控件的垂直中央对齐

android:layout_alignCenterInParent              //如果值为true,将该控件的水平垂直中央与父控件的水平垂直中央对齐


android:layout_above                         //将该控件的底部置于给定ID的控件之上

android:layout_below                         //将该控件的底部置于给定ID的控件之下

android:layout_toLeftOf                     //将该控件的右边缘和给定ID的控件左边缘对齐

android:layout_torightOf                   //将该控件的左边缘和给定ID的控件右边缘对齐

android:layout_alignBaseline          //将该控件的baseline和给定ID的控件的baseline对齐

android:layout_alignBottom             //将该控件的底部边缘与给定ID的控件的底部边缘对齐

android:layout_alignLeft                   //将该控件的左边缘和给定ID的空间左边缘对齐

android:layout_alignRight                //将该控件的右边缘和给定ID的空间右边缘对齐

android:layout_alignTop                   //将该控件的顶部边缘与给定ID的控件的顶部边缘对齐


代码:

<?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:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/text1"
        android:text="第一个Text"
        android:textSize="30sp"
        android:background="#ff0000"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/text2"
        android:background="#6200ff"
        android:text="第二个Text"
        android:textSize="40sp"
        android:layout_above="@id/text1"
        android:layout_centerHorizontal="true"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/text3"
        android:background="#00ffbb"
        android:text="第三个Text"
        android:textSize="45sp"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/text4"
        android:background="#51ff00"
        android:text="第四个Text"
        android:textSize="25sp"
        android:layout_below="@id/text3"
        android:layout_alignRight="@id/text3"
        />
</RelativeLayout>

效果图:

Android学习笔记---第一天---布局_第2张图片

TableLayout//表单布局

常用属性:

android:collapseColumns        //将TableLayout里面指定的列隐藏,若有多列需要隐藏,请用逗号将需要隐藏的列序号隔开。           

android:stretchColumns           //设置指定的列为可伸展的列,以填满剩下的多余空白空间,若有多列需要设置为可伸展,请用逗号将需要伸展的列序号隔开。

android:shrinkColumns            //设置指定的列为可收缩的列。当可收缩的列太宽(内容过多)不会被挤出屏幕。当需要设置多列为可收缩时,将列序号用逗号隔开。


android:layout_column             //该控件在TableRow中指定的列

android:layout_span                 //该控件可跨越几列

代码:

<?xml version="1.0" encoding="utf-8"?>
<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_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="用户名:"/>

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:layout_span="3" />

    </TableRow>
    <TableRow>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="密    码:"/>
        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:inputType="textPassword"
            android:ems="10"
            android:layout_column="1"
            android:layout_span="3"/>
    </TableRow>
    <TableRow>
        <Button
            android:text="登录"
            android:textSize="20sp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"/>
        <Button
            android:text="注册"
            android:textSize="20sp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="3"/>
    </TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="没有TableRow独占一行"/>
</TableLayout>

效果图:

Android学习笔记---第一天---布局_第3张图片

FrameLayout//单针布局

单针布局十分简单可以理解为就是一层一层的往上叠最先放入的控件在最底层;

代码:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="一"
        android:textSize="300sp"
        android:background="#fc0000"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="二"
        android:textSize="200sp"
        android:background="#0022ff"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="三"
        android:background="#e6ff00"
        android:textSize="100sp"
        />
</FrameLayout>

效果图:

Android学习笔记---第一天---布局_第4张图片

GridLayout//网格布局

常用属性:

android:rowCount                            //设置网格布局有几行

android:columnCount                      //设置网格布局有几列


android:layout_row                          //该控件位于网格第几行

android:layout_column                    //该控件位于网格第几列

android:layout_rowSpan                 //挂控件纵向横跨几行

android:layout_columnSpan           //该控件横向横跨几列

代码:

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    >

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="C"
        android:id="@+id/button"
        android:layout_row="0"
        android:layout_column="0" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="<-"
        android:id="@+id/button2"
        android:layout_row="0"
        android:layout_column="1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="/"
        android:id="@+id/button3"
        android:layout_row="0"
        android:layout_column="2" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="*"
        android:id="@+id/button4"
        android:layout_row="0"
        android:layout_column="3" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="7"
        android:id="@+id/button5"
        android:layout_row="1"
        android:layout_column="0" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="8"
        android:id="@+id/button6"
        android:layout_row="1"
        android:layout_column="1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="9"
        android:id="@+id/button7"
        android:layout_row="1"
        android:layout_column="2" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="-"
        android:id="@+id/button8"
        android:layout_row="1"
        android:layout_column="3" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="4"
        android:id="@+id/button9"
        android:layout_row="2"
        android:layout_column="0" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="5"
        android:id="@+id/button10"
        android:layout_row="2"
        android:layout_column="1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="6"
        android:id="@+id/button11"
        android:layout_row="2"
        android:layout_column="2" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="+"
        android:id="@+id/button12"
        android:layout_row="2"
        android:layout_column="3" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="1"
        android:id="@+id/button13"
        android:layout_row="3"
        android:layout_column="0" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="2"
        android:id="@+id/button14"
        android:layout_row="3"
        android:layout_column="1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="3"
        android:id="@+id/button15"
        android:layout_row="3"
        android:layout_column="2" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="="
        android:id="@+id/button16"
        android:layout_row="3"
        android:layout_column="3"
        android:layout_rowSpan="2"
        android:layout_rowWeight="1"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0"
        android:id="@+id/button17"
        android:layout_row="4"
        android:layout_column="0"
        android:layout_columnSpan="2"
        android:layout_columnWeight="1"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="."
        android:id="@+id/button19"
        android:layout_row="4"
        android:layout_column="2" />

</GridLayout>

效果图:

Android学习笔记---第一天---布局_第5张图片

AbsoluteLayout//坐标布局已被废弃




你可能感兴趣的:(android)