学习Android UI

Linear Layout Tutorial With Examples In Android

Linear layout is a simple layout used in android for layout designing. In the Linear layout all the elements are displayed in linear fashion means all the childs/elements of a linear layout are displayed according to its orientation. The value for orientation property can be either horizontal or vertical.

线性布局中的水平和垂直方向


Types Of Linear Layout Orientation

There are two types of linear layout orientation:

  1. Vertical
  2. Horizontal

As the name specified these two orientations are used to arrange there child one after the other, in a line, either vertically or horizontally. Let’s we describe these in detail.

1.Vertical:

In this all the child are arranged vertically in a line one after the other. In below code snippets we have specified orientation “vertical” so the childs/views of this layout are displayed vertically.

<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“填充父对象”
    android:layout\u height=“包装内容”
    android:方向=“垂直”><!--垂直方向设置-->

    <!-- 子视图(在本例中为2个按钮)位于此处-->


    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:text=“按钮1”
        android:id=“@+id/按钮”
        android:背景=“358a32”/>

    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:text=“按钮2”
        android:id=“@+id/按钮2”
        android:背景=“#0058b6”/>

 
</线性布局>

线性布局中的垂直方向
2、水平:

在这种情况下,所有的孩子都被一个接一个地水平排列成一行。在下面的代码段中,我们指定了方向“水平”,因此此布局的子视图/视图水平显示。

<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“填充父对象”
    android:layout\u height=“包装内容”
    android:orientation=“horizontal”><!--水平方向设置-->

    <!-- 子视图(在本例中为2个按钮)位于此处-->


    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:text=“按钮1”
        android:id=“@+id/按钮”
        android:背景=“358a32”/>

    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:text=“按钮2”
        android:id=“@+id/按钮2”
        android:背景=“#0058b6”/>


</线性布局>

线性布局中的水平方向
重要提示: 所有布局管理器都可以嵌套。这意味着你可以 相对布局图框架布局图 作为线性布局的子级。


线性布局中的主要属性:

现在,让我们讨论一下帮助我们配置线性布局及其子控件的属性。将用于线性布局的一些最重要属性 包括:

1、方向: 用于水平或垂直设置子视图/视图的方向属性。在线性布局中,默认方向为垂直。

示例:垂直方向:

<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“填充父对象”
    android:layout\u height=“包装内容”
    android:方向=“垂直”><!--垂直方向设置-->

    <!-- 在此处放置类似按钮的子视图-->
</线性布局>

示例:水平方向:

<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“填充父对象”
    android:layout\u height=“包装内容”
    android:orientation=“horizontal”><!--水平方向设置-->

    <!-- 子视图位于此处-->

</线性布局>

线性布局中的水平和垂直方向
2、重力: 重力属性是一个可选属性,用于控制布局的对齐,如左、右、中、上、下等。

示例:我们为线性布局设置了正确的重力。所以按钮在水平方向上从右侧对齐。

<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“匹配父项”
    android:layout\u height=“match\u parent”
    android:gravity=“右”
    android:方向=“水平”>


<!--此处按钮子视图--->

    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:text=“按钮2”
        android:id=“@+id/按钮2”
        android:背景=“#0e7d0d”/>

    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:text=“按钮1”
        android:id=“@+id/按钮”
        android:背景=“#761212”/>
</线性布局>

Android线性布局中的重力
3、布局重量: “布局权重”属性指定父线性布局中每个子控件的相对重要性。

示例:线性布局中按钮的权重属性。在下面的示例中,一个按钮的重量为2,另一个按钮的重量为1。

<?xml版本=“1.0”编码=“utf-8”?>
<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“匹配父项”
    android:layout\u height=“match\u parent”
    android:方向=“水平”>


<!--在此处添加子视图--->

    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:text=“权重2”
        android:background=“#761212”
        android:layout\u margin=“5dp”
        android:id=“@+id/按钮”
        android:layout\u weight=“2”/>

    <按钮
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:background=“#761212”
        android:layout\u margin=“5dp”
        android:layout\u weight=“1”
        android:text=“权重1”/>
</线性布局>

在布局图像中,您可以注意到权重为2的按钮与其他按钮的尺寸相关程度更大。

线性布局中的权重
4、权重总和: weightSum是所有子属性权重的总和。如果定义childs的weight属性,则需要此属性。

示例:在上述相同的权重示例中,我们可以定义weightSum值3。

<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“匹配父项”
    android:layout\u height=“match\u parent”
    android:weightSum=“3”
    android:方向=“水平”>
    <!--在此处添加子视图--->

</线性布局>

线性布局示例:

现在让我们设计2个线性布局UI。首先,我们使用权重属性进行设计,其次,我们不使用它。因此,下面的布局输出将清除它们之间的差异:

Android输出中的线性布局
示例1: 首先,我们将在不使用权重属性的情况下设计Android线性布局

在本例中,我们使用了一个 文本框 和4 按钮. 方向设置为垂直。

下面是activity\u main的代码。xml

<!-- 设置垂直方向-->
<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“匹配父项”
    android:layout\u height=“match\u parent”
    android:方向=“垂直”>

    <!-- 顶部显示的文本-->

    <文本视图
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:textAppearance=“?android:attr/textAppearanceLarge”
        android:text=“线性布局(无重量)”
        android:id=“@+id/textView”
        android:layout\u gravity=“center\u horizontal”/>

    <!-- 使用的按钮-->

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮1”
        android:背景=“#009300”/>

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮2”
        android:背景=“#e6cf00”/>

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮3”
        android:背景=“#0472f9”/>

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮4”
        android:背景=“#e100d5”/>
</线性布局>

输出屏幕:

Android示例1中的线性布局
示例2: 在这个线性布局的示例中,我们使用了权重属性。

下面是activity\u main的代码。包含解释的xml

<!-- 垂直方向设置为weightSum-->
<线性布局xmlns:android=”http://schemas.android.com/apk/res/android"
    android:layout\u width=“匹配父项”
    android:layout\u height=“match\u parent”
    android:weightSum=“5”
    android:方向=“垂直”>

    <!-- 顶部显示的文本-->

    <文本视图
        android:layout\u width=“包装内容”
        android:layout\u height=“包装内容”
        android:textAppearance=“?android:attr/textAppearanceLarge”
        android:text=“线性布局(带权重)”
        android:id=“@+id/textView”
        android:layout\u gravity=“center\u horizontal”
        android:layout\u weight=“0”/>

    <!-- 使用的按钮-->

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮1”
        android:background=“#009300”
        android:layout\u weight=“1”/>

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮2”
        android:background=“#e6cf00”
        android:layout\u weight=“1”/>

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮3”
        android:background=“#0472f9”
        android:layout\u weight=“1”/>

    <按钮
        android:layout\u width=“填充父对象”
        android:layout\u height=“包装内容”
        android:text=“按钮4”
        android:background=“#e100d5”
        android:layout\u weight=“1”/>
</线性布局>

输出屏幕:

Android示例2中带权重的线性布局

下载此 免费的 电子书!

这本免费电子书将帮助您在Android Studio中掌握Android应用程序开发的学习!

关于“Android中的线性布局示例教程”的6点思考

  1. 我正在使用recycleview应用程序编程,但我从依赖项中得到了一些错误和错误,但我已将依赖项设置为25.3.1,但错误即将发生,请告诉我如何解决他的错误

  2. 你没有解释权重值的含义!权重为零意味着什么?为什么它会将TextView置于顶部?

    1. 您好,首先他提到android:weightSum=“5”在线性布局中,这意味着整个屏幕将垂直分为5个部分,如果您看到按钮的高度比上一个线性布局示例(没有重量)大。希望你能理解。

  3. 您好,本教程对android开发人员非常有用。
    你能添加facebook集成和twitter集成的概念吗

留下答复

您的电子邮件地址将不会发布。 已标记必填字段 *



继续阅读:

免费下载-主Android应用程序开发侧栏

下载此 免费的 电子书!

这本免费电子书将帮助您在Android Studio中掌握Android应用程序开发的学习!
关闭链接

Android开发者Facebook群免费

下载此 免费的 电子书!

这本免费电子书将帮助您在Android Studio中掌握Android应用程序开发的学习!
关闭链接

下载此 免费的 电子书!

这本免费电子书将帮助您在Android Studio中掌握Android应用程序开发的学习!
关闭链接

下载此 免费的 电子书!

这本免费电子书将帮助您在Android Studio中掌握Android应用程序开发的学习!
关闭链接

看看AbhiAndroid 一步一步地 视频培训帮助您掌握Android应用程序开发

视频培训- 定期添加新内容,逐步解锁视频培训。开发Android应用程序。
Android应用程序源代码- 通过文档获取令人惊叹的电子商务、食品订购和终极WebView源代码。
立即获取访问权限
关闭链接