美文网首页
Android - 4种基本布局

Android - 4种基本布局

作者: 疯狂小跳虫 | 来源:发表于2017-12-21 14:34 被阅读11次
1.线性布局

LinearLayout:线性布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="horizontal"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <!--android:orientation属性指定了排列方向,可选值:
     vertical:垂直方向排列
     horizontal:水平方向排列
     
     android:layout_gravity属性根据 android:orientation属性来给值
     android:orientation="horizontal"   那么layout_gravity就只能给垂直方向的对齐
     android:orientation="vertical"     道理同上
    -->

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:text="Button"/>

    <Button
        android:id="@+id/button4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:text="Button"/>

    <Button
        android:id="@+id/button5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:text="Button"/>
</LinearLayout>

EditText 和 Button 的 android:layout_weight 属性都为1,表示水平方向各占1/2

<android.support.v7.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
    <EditText
        android:id="@+id/editText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:hint="Type something"
        />
    <Button
        android:id="@+id/send"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Send"
        android:textAllCaps="false"
        />
</android.support.v7.widget.LinearLayoutCompat>

最理想的布局:
Button只占其自身内容大小的宽,其余的宽由EditText占用

    <EditText
        android:id="@+id/editText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:hint="Type something"
        />
    <Button
        android:id="@+id/send"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Send"
        android:textAllCaps="false"
        />
2.相对布局

RelativeLayout :相对布局
相对父视图上、下、左、右
android:layout_alignParentTop="true"。
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
        android:id="@+id/button6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"/>
    <Button
        android:id="@+id/button7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:text="Button"/>
    <Button
        android:id="@+id/button8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Button"/>
    <Button
        android:id="@+id/button9"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:text="Button"/>
    <Button
        android:id="@+id/button10"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:text="Button"/>
</RelativeLayout>

相对于另一个控件。
android:layout_toLeftOf="@id/button6"。相对button6在它左边
android:layout_toRightOf="@id/button6"。在button6右边
android:layout_above。在上面
android:layout_below。在下面
android:layout_alignBottom。同底
android:layout_alignRight。同右
android:layout_alignLeft。同左
android:layout_alignTop。同顶

    <Button
        android:id="@+id/button6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button6"
        android:layout_centerInParent="true"/>

    <Button
        android:id="@+id/button7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button7"
        android:layout_toLeftOf="@id/button6"
        android:layout_above="@id/button6"/>

    <Button
        android:id="@+id/button8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/button6"
        android:layout_above="@id/button6"
        android:text="Button8"/>

    <Button
        android:id="@+id/button9"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/button6"
        android:layout_toLeftOf="@id/button6"
        android:text="Button9"/>

    <Button
        android:id="@+id/button10"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/button6"
        android:layout_toRightOf="@id/button6"
        android:text="Button10"/>
3.帧布局

android:layout_gravity。可选值:
bottom、left、right、top
center、center_horizontal、center_vertical

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
        android:id="@+id/button6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"/>
</FrameLayout>
4.百分比布局

PercentFrameLayout。继承帧布局的内容并可以使用百分比属性(相对父视图占用)。

app:layout_widthPercent="%50"
app:layout_heightPercent="%50"

PercentRelativeLayout。道理同PercentFrameLayout。

引入布局

<include layout="@layout/title"/>。@layout/title中,title为一个xml文件名.

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

    <include layout="@layout/title"/>
</LinearLayout>

相关文章

网友评论

      本文标题:Android - 4种基本布局

      本文链接:https://www.haomeiwen.com/subject/lvngwxtx.html