【第一行代码】UILayoutTest

简介

介绍常用的四个布局方式
实现自定义标题栏

成果展示

四种基本布局

线性布局LinearLayout

这个布局会将它所包含的控件在线性方向依次排列。
android:orientation=“horizontal” 表示水平方向，默认方向
android:orientation=“vertical” 表示垂直方向
如果LinearLayout的排列方向是horizontal，内部控件的宽度一般不要设置match_parent，否则它将占满整个宽度，其他控件则没有可放置的位置。
同理，当LinearLayout的排列方向是vertical，内部控件的高度一般不要设置match_parent
android:gravity 指定文字在控件的对齐方式
android:layout_gravity 指定控件在布局的对齐方式
android:layout_weight 用比例的方式来指定控件的大小，当使用这个属性时，一般将android:layout_width=“0dp”

相对布局 RelativeLayout

这种布局是通过相对定位的方式让控件出现在布局的任何位置，属性非常多。
详情

帧布局 FrameLayout

所有的控件都会默认的摆放在布局的左上角。
可以通过android:layout_gravity 指定控件在布局的对齐方式

百分比布局

PercentFrameLayout和PercentRelativeLayout两种
app:layout_widthPercent 指定控件宽度为布局的百分比数
app:layout_heightPercent 指定控件高度为布局的百分比数

实现自定义标题

标题布局title.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#87CEFA">

    <Button
        android:id="@+id/title_back"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5dp"
        android:text="Back"
        android:textColor="#fff"/>

    <TextView
        android:id="@+id/title_text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1"
        android:gravity="center"
        android:textColor="#fff"
        android:text="Title Text"
        android:textSize="24sp"/>

    <Button
        android:id="@+id/title_edit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5dp"

        android:text="Edit"
        android:textColor="#fff"/>

</LinearLayout>

主活动布局activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<!--    <include layout="@layout/title"/>-->

    <com.example.uilayouttest.TitleLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.example.uilayouttest.TitleLayout>

</LinearLayout>

主活动MainActivity

package com.example.uilayouttest;

import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //隐藏系统自带的标题栏
        ActionBar actionBar = getSupportActionBar();
        if(actionBar != null) {
            actionBar.hide();
        }
    }
}

自定义标题TitleLayout

package com.example.uilayouttest;

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;

/**
 * Created by zl on 19-10-15.
 */
public class TitleLayout extends LinearLayout implements View.OnClickListener{

    private static final String TAG = "TitleLayout";

    public TitleLayout (Context context, AttributeSet attrs) {
        super(context,attrs);
        //动态加载一个布局文件R.layout.title，将加载文件的父布局指定为TitleLayout
        LayoutInflater.from(context).inflate(R.layout.title,this);
        Button titleBack = (Button) findViewById(R.id.title_back);
        Button titleEdit = (Button) findViewById(R.id.title_edit);
        titleBack.setOnClickListener(this);
        titleEdit.setOnClickListener(this);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.title_back:
                Log.d(TAG, "onClick: back");
                break;
            case R.id.title_edit:
                Log.d(TAG, "onClick: edit");
                break;
                default:break;
        }
    }
}

项目源码下载

github