2.Android学习之UI设计相关的概念

目录

2. UI设计相关的概念

1.View

2.ViewGroup

①ViewGroup.LayoutParams类

②ViewGroup.MarginLayoutParams类

3.布局管理器

3-1.相对布局管理器（RelativeLayout）

3-2.线性布局管理器（LinearLayout）

3-3.帧布局管理器（FrameLayout）

3-4.表格布局管理器（TableLayout）

3-5.网格布局管理器(GridLayout)

3-6.布局管理器的嵌套

4.Padding（内边距）和Margins（外边距）

---

2. UI设计相关的概念

用户界面User Interface 简称UI

1.View

视图，占据屏幕上的一个矩形区域，负责提供组件绘制和事件处理的方法。View类是所有的UI组件的基类。

注：View类位于android.view包中；文本框组件TextView是View类的子类，位于android.widget包中。

在Android中，View类及其子类的相关属性，既可以在XML布局文件中进行设置，也可以通过成员方法在Java代码中动态设置。View类支持的常用XML属性及对应的方法如表所示

XML 属性	方法	描述
android:background	setBackgroundResource(int)	设置背景，其属性值为Drawable资源或者颜色值
android:clickable	setClickable（boolean）	设置是否响应单击事件，其属性值为boolean型的true或false
android:elevation	setElevation(float)	Android API 21新添加的，用于设置z轴深度，其属性值为带单位的有效浮点数
android:id	setId（int）	设置组件的唯一标识符ID，可以通过findViewById（）方法获取
android: longClickable	setLongClickable(boolean)	设置是否响应长按事件，其属性值为boolean型的true或false
android: minHeight	setMinimumHeight(int)	设置最小高度，其属性值为带单位的整数
android: minWidth	setMinimumWidth(int)	设置最小宽度，其属性值为带单位的整数
android: onClick		设置单击事件触发的方法
android: padding	setPaddingRelative(int,int,int,int)	设置4个边的内边距
android: paddingBottom	setPaddingRelative(int,int,int,int)	设置底边的内边距
android: paddingEnd	setPaddingRelative(int,int,int,int)	设置右边的内边距
android: paddingLeft	setPadding(int,int,int,int)	设置左边的内边距
android: paddingRight	setPadding(int,int,int,int)	设置右边的内边距
android: paddingStart	setPaddingRelative(int,int,int,int)	设置左边的内边距
android: paddingTop	setPaddingRelative(int,int,int,int)	设置顶边的内边距
android:visibility	setVisibility（int）	设置View的可见性

2.ViewGroup

在Android中代表容器。继承View类，是View类的扩展，是用来容纳其他组件的容器，由于ViewGroup是一个抽象类，在实际应用中通常是使用ViewGroup的子类来作为容器。

ViewGroup控制其子组件的分布时（例如，设置子组件的内边距、宽度和高度等），还经常依赖于ViewGroup.LayoutParams和ViewGroup.MarginLayoutParams两个内部类。

①ViewGroup.LayoutParams类

封装了布局的位置、高和宽等信息。支持android:layout_height和android:layout_width两个XML属性，它们的属性值可以使用精确的数值，也可以使用FILL_PARENT （表示与父容器相同）、MATCH_PARENT（表示与父容器相同，需要API 8或以上版本才支持）或者WRAP_CONTENT(表示包裹其自身的内容)指定。

②ViewGroup.MarginLayoutParams类

用于控制其子组件的外边距。它支持的常用XML属性如表：

XML 属性	描述
android:layout_marginBottom	设置底外边距
android:layout_marginEnd	该属性为Android 4.2新增加的属性，设置右外边距
android:layout_marginLeft	设置左外边距
android:layout_marginRight	设置右外边距
android:layout_marginStart	该属性为Android 4.2新增加的属性，设置左外边距
android:layout_marginTop	设置顶外边距

所有的UI界面都是由View类和ViewGroup类及其子类组合而成的。在ViewGroup类中可以同时包含View类和ViewGroup类。

3.布局管理器

①相对布局管理器（RelativeLayout）:通过相对定位的方式来控制组件的摆放位置。

②线性布局管理器（LinearLayout）:是指垂直或水平方向上依次摆放组件。

③帧布局管理器（FrameLayout）:没有任何定位方式，默认情况下。所有的组件都会摆放在容器的左上角，逐个覆盖。

④表格布局管理器（TableLayout）:使用表格的方式按行、列来摆放组件。

⑤绝对布局管理器（AbsoluteLayout）:通过绝对定位（x、y坐标）的方式来控制组件的摆放位置。（已过期）

3-1.相对布局管理器（RelativeLayout）

通过相对定位的方式来控制组件的摆放位置。

在Android中，可以在XML布局文件中定义相对布局管理器，也可以使用Java代码来创建。

在XML布局文件中定义相对布局管理器的基本语法格式：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   属性列表
>
</RelativeLayout>

RelativeLayout支持的常用XML属性：

XML 属性	描述
android:gravity	用于设置布局管理器中各子组件的对齐方式
android:ignoreGravity	用于指定哪个组件不受gravity属性的影响

RelativeLayout提供了一个内部类RelativeLayout.LayoutParams,通过该类提供的大量XML属性，可以很好地控制相对布局管理器中各组件的分布方式。

RelativeLayout.LayoutParams支持的常用XML属性：

XML 属性	描述
android:layout_above	其属性值为其他UI组件的ID属性，用于指定该组件位于哪个组件的上方
android:layout_alignBottom	其属性值为其他UI组件的ID属性，用于指定该组件与哪个组件的下边界对齐
android:layout_alignLeft	其属性值为其他UI组件的ID属性，用于指定该组件与哪个组件的左边界对齐
android:layout_alignParentBottom	其属性值为boolean值，用于指定该组件是否与布局管理器底端对齐
android:layout_alignParentLeft	其属性值为boolean值，用于指定该组件是否与布局管理器左边对齐
android:layout_alignParentRight	其属性值为boolean值，用于指定该组件是否与布局管理器右边对齐
android:layout_alignParentTop	其属性值为boolean值，用于指定该组件是否与布局管理器顶端对齐
android:layout_alignRight	其属性值为其他UI组件的ID属性，用于指定该组件与哪个组件的右边界对齐
android:layout_alignTop	其属性值为其他UI组件的ID属性，用于指定该组件与哪个组件的上边界对齐
android:layout_below	其属性值为其他UI组件的ID属性，用于指定该组件位于哪个组件的下方
android:layout_centerHorizontal	其属性值为boolean值，用于指定该组件是否位于布局管理器水平居中的位置
android:layout_centerInParent	其属性值为boolean值，用于指定该组件是否位于布局管理器的中央位置
android:layout_centerVertical	其属性值为boolean值，用于指定该组件是否位于布局管理器垂直居中的位置
android:layout_toLeftOf	其属性值为其他UI组件的ID属性，用于指定该组件位于哪个组件的左侧
android:layout_toRightOf	其属性值为其他UI组件的ID属性，用于指定该组件位于哪个组件的右侧

例：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="16dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:paddingTop="16dp"
    android:background="@mipmap/bg"
    tools:context=".MainActivity">

<!--    添加一个居中显示的文本视图textView1-->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="发现有Widget的新版本，您想现在就安装吗？"
        android:id="@+id/textView1"
        android:layout_ce