15天快速入门安卓开发布局知识

Posted 2021-08-27 长安不及十里

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了15天快速入门安卓开发布局知识相关的知识，希望对你有一定的参考价值。

文章目录

- 三布局知识

三布局知识

关于布局有多样式，同一个uI布局可能有多方式来实现，因此我们关注的是功能的实现，而不是布局的使用，适合自己是最好的，不必纠结。

UI组件：https://qmuiteam.com/android

图标网站：https://www.iconfont.cn/

图片网站：https://www.logosc.cn/so/s%E5%9B%A2%E9%98%9F

3.1 布局理论

View

View在Android中可以理解为视图。它占据屏幕上的一块矩形区域，负责提供组件绘制和事件处理的方法。
View类是所有的widgets组件的基类。
View类位于android.view包中；View类的子类一般都位于android.widget包中。

viewGroup

ViewGroup在Android中可以理解为容器。
ViewGroup类继承自View类，它是View类的扩展，是用来容纳其他组件的容器；
ViewGroup是一个抽象类，在实际应用中使用ViewGroup的子类来作为容器的。
ViewGroup.MarginLayoutParams类 ViewGroup.LayoutParams类
ViewGroup是一个抽象类,也是其他容器类的基类。它的一些实现类有： LinearLayout(线性布局)，RelativeLayout(相对布局)，TableLayout(表格布局) FrameLayout(帧布局)，AbsoluteLayout(绝对布局)，GridLayout(网格布局)

Padding和Margins

Padding：在View的顶部、底部、左侧和右侧的填充像素，也称为内边距。它设置的是内容与View边缘的距离。Padding将占据View的宽度和高度。设置指定的内边距后，视图内容将偏离View边缘指定的距离。
Margins：组件的顶部、底部、左侧和右侧的空白区域，称为外边距。它设置的是组件与其父容器的距离。Margins不占据组件的宽度和高度。为组件设置外边距后，该组件将远离父容器指定的距离，如果还有相邻组件，那么也将远离其相邻组件指定距离

3.2 线性布局LinearLayout

常用属性

android:gravity：是对view控件本身来说的，是用来设置view本身的内容应该显示在view的什么位置,默认值是左侧

android:layout_gravity：是相对于包含该元素的父元素来说的，设置该元素在父元素的什么位置

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:hint="@string/app_edit"
        android:layout_weight="1"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_button"
        android:onClick="go"
         />
</LinearLayout>

权重用来等比例划分（weight）

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/LinearLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"    
    android:orientation="horizontal">    
    <LinearLayout    
        android:layout_width="0dp"    
        android:layout_height="fill_parent"    
        android:background="#ADFF2F"     
        android:layout_weight="1"/>    

    <LinearLayout    
        android:layout_width="0dp"    
        android:layout_height="fill_parent"    
        android:background="#DA70D6"     
        android:layout_weight="2"/>    

</LinearLayout>

3.3 帧布局FrameLayout

FrameLayout(帧布局)可以说是六大布局中最为简单的一个布局,这个布局直接在屏幕上开辟出一块空白的区域,当我们往里面添加控件的时候,会默认把他们放到这块区域的左上角。

android:foreground:设置改帧布局容器的前景图像
android:foregroundGravity:设置前景图像显示的位置
ScrollView和HorizontalScrollView，分别支持视图的垂直滚动和水平滚动。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/FrameLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:foreground="@drawable/logo"
    android:foregroundGravity="right|bottom">

    <TextView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:background="#FF6143" />
    <TextView
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:background="#7BFE00" />
    <TextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#FFFF00" />

</FrameLayout>

3.4 相对布局 RelativeLayout

通过指定界面元素与其他元素的相对位置关系，确定界面中所有元素的布局位置
特点：灵活，最大程度保证在各种屏幕类型的手机上正确显示
在众多布局中，推荐使用相对布局

父容器布局

控件布局

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

    <TextView
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="这是已知控件"
        android:textColor="#E30808"
        />
    <EditText
        android:id="@+id/text2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="这是文本编辑框"
        android:layout_below="@+id/text"
        />
    
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="登录"
        android:layout_below="@+id/text2"
        />

</RelativeLayout>

3.5 表格布局TableLayout

TableLayout的用法还是很简单的,无非就是确定表格的行数,以及使用那三个属性来设置每一行中的第某列的元素隐藏,拉伸,或者收缩即可！

android:collapseColumns:设置需要被隐藏的列的序号
android:shrinkColumns:设置允许被收缩的列的列序号
android:stretchColumns:设置运行被拉伸的列的列序号
以上这三个属性的列号都是从0开始算的,比如shrinkColunmns = “2”,对应的是第三列！

<TableLayout    
    android:id="@+id/TableLayout2"    
    android:layout_width="fill_parent"    
    android:layout_height="wrap_content"    
    android:stretchColumns="1"
             
             >    

    <TableRow>    

        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="one" />    

        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="two" />    

        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="three" />    

        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="four" />                 
    </TableRow>    
</TableLayout>

3.6 网格布局GridLayout

网格布局（GridLayout）与表格布局相似，用一组无限细的直线将界面分割成行、列、单元。然后，指定控件显示的区域和控件在该区域的显示方式。网格布局实现了控件的交错显示，避免使用布局嵌套，更有利于自由编辑布局的开发。

可以自己设置布局中组件的排列方式
可以自定义网格布局有多少行,多少列
可以直接设置组件位于某行某列
可以设置组件横跨几行或者几列

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/GridLayout1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:columnCount="4"
    android:orientation="horizontal"
    android:rowCount="6" >

    <TextView
        android:layout_columnSpan="4"
        android:layout_gravity="fill"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:background="#FFCCCC"
        android:text="0"
        android:textSize="50sp" />

    <Button
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="回退" />

    <Button
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="清空" />

    <Button android:text="+" />

    <Button android:text="1" />

    <Button android:text="2" />

    <Button android:text="3" />

    <Button android:text="-" />

    <Button android:text="4" />

    <Button android:text="5" />

    <Button android:text="6" />

    <Button android:text="*" />

    <Button android:text="7" />

    <Button android:text="8" />

    <Button android:text="9" />

    <Button android:text="/" />

    <Button
        android:layout_width="wrap_content"
        android:text="." />

    <Button android:text="0" />

    <Button android:text="=" />

</GridLayout>

3.7 百分比布局（PercentRelativeLayout、PercentFrameLayout）

Android引入了一种全新的布局方式来解决此问题——百分比布局。在这种布局中，我们可以不再使用wrap_content、match_parent等方式来指定控件的大小，而是允许直接指定控件在布局中所占的百分比，这样的话就可以轻松实现平分布局甚至是任意比例分割布局的效果了。

添加依赖

 implementation 'com.android.support:percent:24.4.0'

编写xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.percentlayout.widget.PercentFrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <Button
        android:id="@+id/button1"
        android:text="Button1"
        android:layout_gravity="left|top"
        app:layout_widthPercent="50%"
        app:layout_heightPercent="50%">
    </Button>
    <Button
        android:id="@+id/button2"
        android:text="Button2"
        android:layout_gravity="right|top"
        app:layout_widthPercent="50%"
        app:layout_heightPercent="50%">
    </Button>
    <Button
        android:id="@+id/button3"
        android:text="Button3"
        android:layout_gravity="left|bottom"
        app:layout_widthPercent="50%"
        app:layout_heightPercent="50%">
    </Button>
    <Button
        android:id="@+id/button4"
        android:text="Button4"
        android:layout_gravity="right|bottom"
        app:layout_widthPercent="50%"
        app:layout_heightPercent="50%">
    </Button>
</androidx.percentlayout.widget.PercentFrameLayout>

3.8 常用的控件

TextView 显示文字，ImageView 显示图片，EditText 输入框，Button 按钮，CheckBox 复选框，RadioButton 单选按钮（和 RadioGroup 配合使用）

ListView(简单用法)

ListView绝对可以称得上是Android中最常用的控件之一，几乎所有的应用程序都会用到它(相当于展示数据的表格)
Android中提供了很多适配器的实现类，其中我认为最好用的就是ArrayAdapter。

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.LinearLayoutCompat
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</androidx.appcompat.widget.LinearLayoutCompat>

package com.shu;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class ThirdActivity extends AppCompatActivity {


    private String[] data={"01","02","03","04","05","06","07","08",
                           "09","10","11","12","13","14","15","16"
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.以上是关于15天快速入门安卓开发 布局知识的主要内容，如果未能解决你的问题，请参考以下文章 
 程序员带你学习安卓开发，十天快速入门-基础知识
 安卓快速入门指南（上）
 2019/2/15安卓应用——记账本，开发记录
 三天学会css3基础知识
 安卓 学习之旅 入门
 Android开发快速入门及导出apk

15天快速入门安卓开发 布局知识