Android 学习：布局方式_android:layout_height

Android 学习：布局方式

1、线性布局

线性布局：

控件从左到右排列：水平方式

控件从上到下排列：垂直方式

标签：LinearLayout

1.语法格式

<LinearLayoutear 		  xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <!--属性列表-->
</LinearLayoutear>

xmlns:android:声明一个命名空间前缀，叫做 Android，http://schemas.andeoid.com/apk/res/android ,是网格格式，才可以使用Android前缀

2.常用属性

android：orientation

android：orientation="vertical" 是控件垂直排列
android：orientation="horizontal"是控件水平排列

android：gravity

用于设置布局管理器中控件的对齐方式，其可选值包括 top、bottom、left、right、cnter、center_horizontal和center_vertical等。这些属性值可以同时指定也可以单独指定，同时指定时需要用竖线在各属性之间隔开，例如指定控件靠左上角对齐，可以设置该属性值为left|top。android：geavity属性的各项可选值的具体功能如下表：

android:layout_width 和 android：layout_height

分别用于设置控件的宽度和高度，可选值包括fill_parent、match_parent和wrap_content，其中，fill_parent强制性地使控件扩展以充满布局单元的空间。

从Android2.2开始，match_parent 和 fill_parent功能相同，如果兼顾低版本的使用，就只能使用fill_parent。wrap_parent可以自适应大小，强制使视图扩展以便显示其全部内容。

android：id

用于为控件指定一个id属性，这样在java代码中就可以通过该属性值来引用相应的控件，并通过代码操作该控件。

android：background

用于为控件背景指定具体的图片或者将其设置为某一颜色。（注：Android Studio向导创建的Android应用程序的用户登录界面默认背景未必是白色）

【提示】 控件的属性中，带有layout的属性（如android：layout_gravity）用来设置控件本身的对齐方式；不带layout的属性（android：gravity）用来设置该控件所包含的子元素的对齐方式。

线性布局的练习：

​

<?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="match_parent"
    android:orientation="vertical">
    <!--    线性布局;Ctrl+Alt+L键：格式化代码;-->
    <!--
        1.行 用户名： 输入框
        2.行 密码：输入框
        3.登录 取消
    -->
    <!-- 1.第一行线性布局：水平方式
            match_parent 表示使空间填充布局单元内的尽可能多的空间，
            wrap_content:表示使视图扩展以现实全部内容；
            layout_width:布局宽;
            layout_height:height:布局高度;
            txt:文本内容
            textSize:文本大小
            layout_weight:字体粗细
            paddingLeft:左填充
            paddingTop:上填充;
       -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
 
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:paddingLeft="15dp"
            android:paddingTop="15dp"
            android:text="用户"
            android:textSize="20dp" />
 
        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3" />
    </LinearLayout>
    <!--    第二行，线性布局，水平方式-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
 
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:paddingLeft="10dp"
            android:paddingTop="10dp"
            android:text="密码"
            android:textSize="20dp" />
 
        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3" />
    </LinearLayout>
    <!--    第三行，线性布局，水平方式-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="登录"/>
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="取消"/>
    </LinearLayout>
</LinearLayout>

除了LinearLayout线性布局之外，上面代码里还讲了三个控件；

1、TextView:显示文本提示内容

2、EditText:输入框

3、Button:按钮

【提示】单独一个线性布局管理器中包含的控件，要么全部水平布局，要么全部垂直布局，如果要控件水平布局和垂直布局并存，可以将线性布局管理器（包括后续将介绍的其他几种布局管理器）进行嵌套。

2、表格布局

表格布局管理器（TableLayout）用行、列（也称为单元格）方式来管理容器内的控件，无论是在界面的设计状态还是实际运行状态，都不会显示表格线。在TableRow中，每添加一个TableRow控件，就添加一行，然后就可以在TableRow中添加其他需要布局的具体控件，而在TableRow中每添加一个具体控件，当前行就增加一列（列可以为空）。

表格布局管理器的列数由包含的列数最多的那一行确定。并且，列还可以根据实际需要被隐藏、伸展或者收缩。

1、语法格式

表格布局管理器的语法格式如下：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <TableRow ...>
        ...
     </TableRow>
        ...
</TableLayout>

2、常用属性

TableLayout继承自LinearLayout,所以它完全支持线性布局管理器的全部XML属性，另外，TableLayout还支持下表所示的其他XML属性。

表格布局的练习：

<TableLayout 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="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    tools:context=".MainActivity">
​
    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="用户名：" />
        <EditText
            android:id="@+id/editTesr"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:layout_span="2"
            android:inputType="textPersonName"/>
    </TableRow>
    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent">
     <TextView
         android:id="@+id/textView2"
         android:layout_height="wrap_content"
         android:layout_width="wrap_content"
         android:text="密码："/>
        <EditText
            android:id="@+id/editTest2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_span="2"
            android:inputType="textPassword"/>
    </TableRow>
    <TableRow
        android:layout_height="match_parent"
        android:layout_width="match_parent">
        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:text="确定"/>
        <TextView
            android:id="@+id/textView3"
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:text=""/>
        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            android:text="取消"/>
    </TableRow>
​
</TableLayout>

​

3、网格布局

网格布局管理器（GridLayout）是Android SDK 4.0（API Level 14）以后才增加的新的布局方式。这种布局将容器划分为“行*列”的网格，每个控件置于相应的网格中，并且也可以通过设置相关属性使一个控件在网格中占据多行多列。相对而言，网格布局管理器比表格布局管理器在界面上更简单，高效。

1、语法格式：

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

2、常用属性

下表为GridLayout所支持的常用XML属性。

3、代码练习：

<GridLayout 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_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_gravity="center"
    android:columnCount="4"
    android:rowCount="4"
    tools:context=".MainActivity">
    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_row="0"
        android:layout_column="0"
        android:layout_columnSpan="3"
        android:layout_gravity="center_horizontal"
        android:text="----用户登录----"/>
​
    <TextView
        android:id="@+id/TextView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_row="1"
        android:layout_column="0"
        android:layout_gravity="right"
        android:text="用户名："/>
    <EditText
        android:id="@+id/editText1"
        android:layout_width="150dp"
        android:layout_height="wrap_content"
        android:layout_columnSpan="2"
        android:inputType="textPersonName"/>
​
    <TextView
        android:id="@+id/TextView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_row="2"
        android:layout_column="0"
        android:layout_gravity="right"
        android:text="密码："/>
    <EditText
        android:id="@+id/editText2"
        android:layout_width="150dp"
        android:layout_height="wrap_content"
        android:layout_columnSpan="2"
        android:inputType="textPassword"/>
    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_row="3"
        android:layout_column="0"
        android:text="确定" />
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_row="4"
        android:layout_column="0"
        android:text="取消" />
</GridLayout>

【提示】只有在API等级等于或者大于21的Android系统中，才有layout_columnWeight和layout_rowWeight这两个属性。另外，每当布局换行时，需要先设定当前行第一个控件所在行、列的位置属性值，紧随着第一个控件之后的控件，则无须再设置行、列属性值。

4、框架布局

框架布局管理器（FrameLayout）也称“帧布局管理器”，是所有布局管理器中最简单的一种布局，通常用于嵌套布局的局部区域设计，也经常被用在游戏程序开发中，显示自定义的动态视图。

框架布局管理器为容器内的每个控件创建一款块空白区域（帧），一帧对应一个控件，后面的添加的帧（控件）会叠加到前面的帧（控件）上面。默认情况下，每帧以屏幕的左上角为坐标起点（0,0）开始布局，当然，也可以通过设置响应的gravity属性，来控制每一帧的对齐方式。还可以通过margin属性来设置每个帧的位置，但是这种方式设置的位置，需要兼顾分辨率状况，否则，实际的显示效果可能不是预期的。

1、语法格式：

框架布局管理器的基本语法如下：

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

2、常用属性

FrameLayout除了支持常规的一些XML属性外，还支持下表所示的其他常用XML属性。

3、代码练习：

<FrameLayout 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_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_gravity="center"
    tools:context=".MainActivity">
      <TextView
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_gravity="center"
        android:text="最低层文本框"
        android:textColor="#FFFFFF"/>
       <TextView
         android:id="@+id/textView"
         android:layout_width="200dp"
         android:layout_height="200dp"
         android:layout_gravity="center"
         android:background="#00FF00"
         android:text="中间层文本框"
         android:textColor="#000000"/>
        <TextView
         android:id="@+id/textView1"
         android:layout_width="100dp"
         android:layout_height="100dp"
         android:layout_gravity="center"
         android:background="#0000FF"
         android:text="中间层文本框"
         android:textColor="#FFFFFF"/>
 </FrameLayout>

5、相对布局

相对布局管理器（RelativeLayout）按照控件之间的相对位置或者控件于容器之间的相对位置进行定位，如控件B在控件A的左侧、右侧、上方或者下方。相对布局管理器是应用较多、使用较灵活的布局管理器之一。

1、语法格式：

相对布局管理器的基本语法如下：

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

2、常用属性

下表为RelativeLayout所支持的常用XML属性

除了上表中所列出的相对布局管理器的基本属性以外，RelativeLayout还提供了一个内部类RelativeLayout.LayoutParams,这个类提供的XML属性能够灵活地控制布局管理器中的控件，具体如下表所示：

6、约束布局

约束布局管理器（ConstraintLayout）是Android Studio 2.2中主要新增的功能之一，是2016年Google I/O推出并宣传的一个组件。虽然此前版本的Android Studio也支持可视化的界面设计，但是操作起来不方便，而ConstraintLayout则使可视化的界面设计更加灵活、方便。当然，可视化操作之后，Android Studio同样会自动为我们生成相应XML布局代码。

【说明】 在较新版本的Android Studio中，ConstraintLayout已经作为默认布局。

利用约束布局管理器进行布局设计，常用的技术要点如下：

1、手动添加约束

拖放所选控件的上、下、左、右的相应约束点到其所参照的控件的相应约束点上，即可为所选控件添加相应的约束。已添加的约束点将有原来的空心圆变成实心圆

2、删除约束（3种方法）

删除一个单独的约束：将鼠标悬浮在所选的控件的约束点上面，此时约束点会变成红色，单击一下该约束点即可将其删除

删除某一个控件的所有约束：选中一个控件，然后他的左下角会出现一个删除约束的图标，单击该图标即可删除所选控件的所有约束

删除当前界面的所有约束：单击布局区域上面工具栏中的删除约束按钮（Clear All Constraints ）即可删除当前界面中的所有约束

3、Constraint Widget 约束滑块应用

控件属性（Attributes）面板的上部区域有一个Constraint Widget约束滑块，拖动它的纵向或横向滑块，就可以调节所选控件的布局位置。

约束滑块中间的正方形区域是用来控制控件大小的。一共有3种模式可选。

4、自动添加约束

Autoconnect（自动生成约束）：可以为当前正在移动的控件自动添加一个或多个约束。如果不需要这个功能，可以单击关闭（默认是开启的）

Infer Constraints（自动推断约束）：推断并自动添加认为必要的约束条件.此项约束功能与Autoconnect的区别在于，自动推断约束会创建布局上所有元素之间的约束。

5、创建控件之间的约束链。

同时选中需要设置约束链的几个控件，然后单击鼠标右键，在弹出的快捷菜单中选择Chains->Create Horizontal Chain（或者 Create Vertical Chain）,即可为这些控件创建相应的水平或者垂直约束链

6、Guideline辅助约束布局

可以利用Guideline为约束布局添加相应的辅助线，从而更准确、快捷地进行约束布局设计，辅助线不会绘制到屏幕上，也不会展现给客户。