Android 线性布局。 2排2

Question

我有一个线性布局，其中包含 4 个文本视图（2 个标签，2 个带有数据），结构如下

Label    Label
Data     Data

我想把上面的加倍，但我遇到了很大的困难。愿望是

Label    Label
Data     Data
Label    Label
Data     Data

这是我目前所拥有的代码。当我添加更多文本视图时，它会抛出定位。

    <LinearLayout
    android:id="@+id/linearLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/temperatureLabel"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="10dp"
    android:orientation="horizontal"
    android:weightSum="100" android:baselineAligned="false">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="vertical">

        <TextView
            android:id="@+id/label"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/label"
            android:textColor="#80ffffff" />

        <TextView
            android:id="@+id/data"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/data"
            android:textColor="@android:color/white"
            android:textSize="24sp" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="vertical">

        <TextView
            android:id="@+id/Label"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/label"
            android:textColor="#80ffffff" />

        <TextView
            android:id="@+id/data"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/data"
            android:textColor="@android:color/white"
            android:textSize="24sp" />
    </LinearLayout>
</LinearLayout>

Answer 1

如果您打算将其翻倍或采用 table 之类的布局。您可以使用 gridLayout 来解决您的问题。

例如

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:stretchMode="columnWidth"
    app:columnCount="2"
    app:rowCount="2">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="vertical"
        app:layout_column="0"
        app:layout_columnWeight="1"
        app:layout_row="0">

        <TextView
            android:id="@+id/label"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="abel"
            android:textColor="@android:color/holo_blue_bright" />

        <TextView
            android:id="@+id/data"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="data"
            android:textColor="@android:color/black"
            android:textSize="24sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="vertical"
        app:layout_column="1"
        app:layout_columnWeight="1"
        app:layout_row="0">

        <TextView
            android:id="@+id/label1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="abel"
            android:textColor="@android:color/holo_blue_bright" />

        <TextView
            android:id="@+id/data1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="data"
            android:textColor="@android:color/black"
            android:textSize="24sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="vertical"
        app:layout_column="0"
        app:layout_columnWeight="1"
        app:layout_row="1">

        <TextView
            android:id="@+id/label2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="abel"
            android:textColor="@android:color/holo_blue_bright" />

        <TextView
            android:id="@+id/data2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="data"
            android:textColor="@android:color/black"
            android:textSize="24sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="vertical"
        app:layout_column="1"
        app:layout_columnWeight="1"
        app:layout_row="1">

        <TextView
            android:id="@+id/label3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="abel"
            android:textColor="@android:color/holo_blue_bright" />

        <TextView
            android:id="@+id/data3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="data"
            android:textColor="@android:color/black"
            android:textSize="24sp" />
    </LinearLayout>
</android.support.v7.widget.GridLayout> </FrameLayout>

Answer 2

要避免嵌套布局，可以使用约束布局并为每个视图设置水平和垂直约束以获得所需的定位。

<ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<TextView
    android:id="@+id/label1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Label1"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent" />

<TextView
    android:id="@+id/data1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Data1"
    app:layout_constraintStart_toStartOf="@+id/label1"
    app:layout_constraintTop_toBottomOf="@+id/label1" />

<TextView
    android:id="@+id/label2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Label2"
    app:layout_constraintLeft_toRightOf="@id/label1"/>

<TextView
    android:id="@+id/data2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Data2"
    app:layout_constraintStart_toStartOf="@+id/label2"
    app:layout_constraintTop_toBottomOf="@+id/label2" />

<TextView
    android:id="@+id/label3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Label3"
    app:layout_constraintTop_toBottomOf="@id/data1"
    app:layout_constraintStart_toStartOf="@+id/label1" />

<TextView
    android:id="@+id/data3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Data3"
    app:layout_constraintStart_toStartOf="@+id/label3"
    app:layout_constraintTop_toBottomOf="@+id/label3" />

<TextView
    android:id="@+id/label4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Label4"
    app:layout_constraintTop_toBottomOf="@id/data2"
    app:layout_constraintStart_toStartOf="@id/label2" />

<TextView
    android:id="@+id/data4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Data4"
    app:layout_constraintStart_toStartOf="@+id/label4"
    app:layout_constraintTop_toBottomOf="@+id/label4" />

Android 线性布局。 2排2

Android linear layout. 2 rows of 2

android

android-linearlayout