Android 布局

又逢乱世

已于 2023-08-15 22:40:19 修改

阅读量820

点赞数

分类专栏： Android 文章标签： android

于 2023-04-12 15:45:16 首次发布

本文链接：https://blog.csdn.net/a1053765496/article/details/130108026

版权

Android 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

什么是 UI

用户界面（User Interface，简称 UI，亦称使用者界面）是系统和用户之间进行交互和信息交换的媒介，它实现信息的内部形式与人类可以接受形式之间的转换。
软件设计可分为两个部分：编码设计与UI设计。

Android UI

Android应用界面包含用户可查看并与之交互的所有内容。Android 提供丰富多样的预置 UI 组件，例如结构化布局对象和 UI 控件，您可以利用这些组件为您的应用构建图形界面。Android 还提供其他界面模块，用于构建特殊界面，例如对话框、通知和菜单。
Android UI 都是由布局和控件组成的。

布局

布局(layout)可定义应用中的界面结构（例如 Activity 的界面结构）。布局中的所有元素均使用 View 和 ViewGroup 对象的层次结构进行构建。View 通常绘制用户可查看并进行交互的内容。然而 ViewGroup 是不可见容器，用于定义 View 和其他 ViewGroup 对象的布局结构。

布局结构

View 对象通常称为“微件”，可以是众多子类之一，例如 Button 或 TextView 。
ViewGroup 对象通常称为“布局”，可以是提供其他布局结构的众多类型之一，例如 LinearLayout 或 ConstraintLayout 。

声明布局

在 XML 中声明界面元素，Android 提供对应 View 类及其子类的简明 XML 词汇，如用于微件和布局的词汇。也可以使用 Android Studio 的 Layout Editor，并采用拖放界面来构建 XML 布局。
在运行时实例化布局元素。可以通过编程的方式创建 View 对象和 ViewGroup 对象（并操纵其属性）。

编写XML

利用 Android 的 XML 词汇，按照在 HTML 中创建包含一系列嵌套元素的网页的相同方式快速设计UI 布局及其包含的屏幕元素
每个布局文件都必须只包含一个根元素，并且该元素必须是视图对象或 ViewGroup 对象
定义根元素后，可以子元素的形式添加其他布局对象或控件，从而逐步构建定义布局的视图层次结构
在 XML 中声明布局后，以 .xml 扩展名将文件保存在Android 项目的 res/layout/ 目录中。

<?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" >
    <TextView android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello, I am a TextView" />
    <Button android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello, I am a Button" />
</LinearLayout>

加载XML资源

当编译应用时，系统会将每个 XML 布局文件编译成 View 资源。在 Activity.onCreate() 回调
内，通过调用 setContentView() ，并以 R.layout.*layout_file_name* 形式向应用代码传
递布局资源的引用，加载应用代码中的布局资源。layout_file_name就是res/layout目录中的布局文件名。

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
}

属性

每个 View 对象和 ViewGroup 对象均支持自己的各种 XML 属性。某些属性是 View 对象的特有属性（例如，TextView 支持 textSize 属性），但可扩展此类的任一 View 对象也会继承这些属性。某些属性是所有 View 对象的共有属性，因为它们继承自 View 根类（例如 id 属性）。此外，其他属性被视为“布局参数”，即描述 View 对象特定布局方向的属性，如由该对象的父 ViewGroup 对象定义的属性。

<TextView android:textSize="10" />

ID

任何 View 对象均可拥有与之关联的整型 ID，用于在结构树中对 View 对象进行唯一标识。编译应用后，系统会以整型形式引用此 ID，但在布局 XML 文件中，系统通常会以字符串的形式在 id 属性中指定该 ID。这是所有 View 对象共有的 XML 属性（由 View 类定义），并且您会经常使用该属性。 ID 字符串名称，在同一布局中必须是唯一的，不能重名，不同布局中可以同名。

<TextView android:id="@+id/abc" />

@ 符号的作用

字符串开头处的 @ 符号指示 XML 解析器应解析并展开 ID 字符串的其余部分，并将其标识为 ID 资源。加号 (+) 表示这是一个新的资源名称，必须创建该名称并将其添加到我们的资源（在 R.java文件中）内。Android 框架还提供许多其他 ID 资源。引用 Android 资源 ID 时，不需要加号，但必须添加 android 软件包命名空间。

@+id 和 @id 的区别

：@+id就是在R.java文件里新增一个id名称，如果之前已经存在相同的id名称，那么会覆盖之前的名称。而@id则是直接引用R.java文件的存在的id资源，如果不存在，会编译报错。

ID的作用

通过ID值创建我们视图对象的实例

<TextView
	android:id="@+id/tv"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hello World!"
	android:textSize="24sp"/>
	
TextView textView = (TextView) findViewById(R.id.tv);

布局属性 LayoutParmas

布局属性以 layout_ 开头
布局属性作用是给我们的视图设定在布局中位置和大小
ViewGroup 类会实现一个扩展 ViewGroup.LayoutParams 的嵌套类，里面包含一些设置视图 view 的尺寸和位置的属性。
一般而言，建议不要使用绝对单位（如像素）来指定布局宽度和高度。更好的方法是使用相对测量单位（如与密度无关的像素单位 (dp) 、 wrap_content 或 match_parent ），因为其有助于确保您的应用在各类尺寸的设备屏幕上正确显示。
wrap_content ：您的视图将其大小调整为内容所需的尺寸。
match_parent ：您的视图尽可能采用其父视图组所允许的最大尺寸。

TextView tv = new TextView(this);
LinearLayout linearLayout = new LinearLayout(this);
LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams)tv.getLayoutParams();
layoutParams.leftMargin = 30; //左边距
layoutParams.topMargin = 30;//上边距
layoutParams.width = 100;//宽
layoutParams.height = 200;//高
tv.setLayoutParams(layoutParams);
linearLayout.addView(tv);

布局位置

getLeft()、getTop()：获取基于父视图的坐标位置

getWidth()、getHeight()：获取基于父视图的尺寸

位置和尺寸的单位是像素（px）

px 与 dp 的区别

px 即像素，1px代表屏幕上一个物理的像素点，给视图设置px单位，不同分辨率下，尺寸不一样
dp（Density independent pixels），设备无关像素。它与“像素密度”密切相关。
什么是像素密度：每英寸包含的像素数。
假设有一部手机，屏幕的物理尺寸为1.5英寸x2英寸，屏幕分辨率为240x320，则我们可以计算出在这部手机的屏幕上，每英寸包含的像素点的数量为240/1.5=160dpi（横向）或320/2=160dpi（纵向），160dpi就是这部手机的像素密度，像素密度的单位dpi是Dots Per Inch的缩写，即每英寸像素数量。

密度类型	代表的分辨率（px）	屏幕密度（dpi）	换算（px/dp）	比例
低密度（ldpi）	240x320	120	1dp=0.75px	3
中密度（mdpi）	320x480	160	1dp=1px	4
高密度（hdpi）	480x800	240	1dp=1.5px	6
超高密度（xhdpi）	720x1280	320	1dp=2px	8
超超高密度（xxhdpi）	1080x1920	480	1dp=3px	12

外边距和内边距

外边距		内边距
layout_margin	外边距	padding	内边距
layout_marginTop	上外边距	paddingTop	上内边距
layout_marginBottom	下外边距	paddingBottom	下内边距
layout_marginLeft	左外边距	paddingLeft	左内边距
layout_marginRight	右外边距	paddingRight	右内边距

常用布局

线性布局 LinearLayout

LinearLayout 是一个视图容器，用于使所有子视图在单个方向（垂直或水平）保持对齐。您可使用 android:orientation 属性指定布局方向。

android:orientation="horizontal"

android:orientation="vertical"

布局权重

通过给子视图设置权重值，来分配子视图所占空间的权重（比例），如图三个子视图权重分别设置为1，均分页面空间

android:layout_weight = 1(2或3或n)

相对布局 RelativeLayout

相对布局：子视图可通过相应的布局属性，设定相对于另一个兄弟视图或父视图容器的相对位置

属性说明

相对于兄弟元素

属性名称	属性含义
android:layout_below="@id/aaa"	在指定View的下方
android:layout_above="@id/aaa"	在指定View的上方
android:layout_toLeftOf="@id/aaa"	在指定View的左边
android:layout_toRightOf="@id/aaa"	在指定View的右边
android:layout_alignTop="@id/aaa"	与指定View的上边界一致
android:layout_alignBottom="@id/aaa"	与指定View下边界一致
android:layout_alignLeft="@id/aaa"	与指定View的左边界一致
android:layout_alignRight="@id/aaa"	与指定View的右边界一致

相对于父元素

属性名称	属性含义
android:layout_alignParentLeft="true"	在父元素内左边
android:layout_alignParentRight="true"	在父元素内右边
android:layout_alignParentTop="true"	在父元素内顶部
android:layout_alignParentBottom="true"	在父元素内底部

对齐方式

属性名称	属性含义
android:layout_centerInParent="true"	居中布局
android:layout_centerVertical="true"	垂直居中布局
android:layout_centerHorizontal="true"	水平居中布局

间隔

属性名称	属性含义
android:layout_marginBottom=""	离某元素底边缘的距离
android:layout_marginLeft=""	离某元素左边缘的距离
android:layout_marginRight =""	离某元素右边缘的距离
android:layout_marginTop=""	离某元素上边缘的距离
android:layout_paddingBottom=""	往内部元素底边缘填充距离
android:layout_paddingLeft=""	往内部元素左边缘填充距离
android:layout_paddingRight =""	往内部元素右边缘填充距离
android:layout_paddingTop=""	往内部元素右边缘填充距离

帧布局 FrameLayout

最简单的一种布局，没有任何定位方式，当我们往里面添加控件的时候，会默认把他们放到这块区域的左上角，帧布局的大小由控件中最大的子控件决定，如果控件的大小一样大的话，那么同一时刻就只能看到最上面的那个组件，后续添加的控件会覆盖前一个。应用场景：悬浮按钮

网格布局 GridLayout

顾名思义就是表格布局

属性名称	属性含义
android:columnCount	列数
android:rowCount	行数
android:layout_columnSpan	横跨的列数
android:layout_rowSpan	横跨的行数

又逢乱世

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
Android 布局

用户界面（User Interface，简称 UI，亦称使用者界面）是系统和用户之间进行交互和信息交换的媒介，它实现信息的内部形式与人类可以接受形式之间的转换。软件设计可分为两个部分：编码设计与UI设计。
复制链接

扫一扫