项目代码 Github 代码

从页面布局开始

1. LinearLayout 线性布局

LinearLayout 线性布局

(父元素) 属性	属性功能	默认值	可选值
orientation="horizontal"	控制子元素布局水平货垂直方向	horizontal	horizontal / vertical

注意权重 是值元素自身的高度,占比来分配宽度,也就是说如果元素自身有宽度的话按照自身宽度占比

(子元素) 属性	属性功能	默认值	可选值
layout_weight="1"	相对父元素占比的宽度	Null	Number

2. RelativeLayout 相对布局

子元素属性(需要指定参考元素)	介绍	值
layout_above	参考组件的上方	组件 ID
layout_below	参考组件的下方	组件 ID
layout_toLeftof	参考组件的左侧	组件 ID
layout_toRightof	参考组件的右侧	组件 ID
layout_alignParentTop	相对与父容器上对齐	布尔类型
layout_alignParentBottom	相对与父容器底对齐	布尔类型
layout_alignParentRight	相对与父容器右对齐	布尔类型
layout_alignParentLeft	相对与父容器左对齐	布尔类型
layout_alignTop	相对与参考上对齐	组件 ID
layout_alignBottom	相对与参考底对齐	组件 ID
layout_alignRight	相对与参考右对齐	组件 ID
layout_alignLeft	相对与参考左对齐	组件 ID
layout_centerHorizontal	相对于父容器水平位置	true / false
layout_centerVertical	相对于父容器垂直位置	true / false
layout_centerInParent	水平垂直居中	true / false

<RelativeLayout 
    android:layout_width="match_parent"
    android:orientation="horizontal"
    android:layout_height="match_parent"
    android:gravity="center"
    android:ignoreGravity="@id/btn"
    >

    <Button
        android:id="@+id/btn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="更新"
        android:layout_weight="1"
        android:layout_margin="2dp"
        />
</RelativeLayout>


 - 相对父元素布局
<?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"
    >
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="默认"/>
    <Button
        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_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:text="右上角" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:text="右下角" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:text="左下角" />
</RelativeLayout>

- 相对兄弟元素布局
<?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">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_margin="5dp"
        android:text="Button" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_toLeftOf="@id/button"
        android:textColor="#000"
        android:text="在左边"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_above="@id/button"
        android:text="在顶部"/>


    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
       android:layout_toRightOf="@id/button"
        android:text="在右侧"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/button"
        android:text="在右侧"/>
</RelativeLayout>