Android TableLayout 问题 - 无法正确设置

Question

请分享 TableLayout 的修复 - 有点困惑如何根据需要设置权重和列来安排布局。我希望您能根据 layout_span 获得格式化需求。但会尽量用文字解释。写下我如何可视化布局

第一行 - 有一个横跨整个宽度的按钮
第二行 - 对齐标题中心
第三行 - 让两个 TextView 每个占据 50% 的区域
第四行 - 对齐航向中心
第五行 - 一个 ImageView 占据 16.6% 的宽度，TextView 占据其余的 83.3%。
第六行 - 一个 ImageView 占据 16.6% 的宽度，TextView 占据其余的 83.3%。

代码如下：

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

    <TableRow
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:padding="10dp">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_get_questions"
            android:id="@+id/btnNext"
            android:textColor="@color/windowBackground"
            android:layout_span="4"
            android:layout_column="1"
            />
    </TableRow>
    <TableRow
        android:layout_height="fill_parent"
        android:layout_width="match_parent"
        >
        <TextView
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/app_scoring_leaders"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textStyle="bold"
            android:layout_span="4"
            android:layout_column="1"
            android:padding="5dp"/>
    </TableRow>
    <TableRow
        android:layout_height="fill_parent"
        android:layout_width="match_parent"
        android:padding="5dp">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/txtDailyScores"
            android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:layout_margin="5dp"
            android:layout_column="1"
            android:layout_span="2"
            android:layout_weight="3"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/txtAllTimeScores"
            android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:layout_margin="5dp"
            android:layout_column="3"
            android:layout_span="2"
            android:layout_weight="3"/>
    </TableRow>
    <TableRow
        android:layout_height="fill_parent"
        android:layout_width="match_parent"
        >
        <TextView
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/app_get_started"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textStyle="bold"
            android:layout_column="1"
            android:layout_span="4"
            android:padding="5dp"/>
    </TableRow>
    <TableRow
        android:layout_height="fill_parent"
        android:layout_width="match_parent"
        android:padding="5dp">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_assessment_black_36dp"
            android:layout_gravity="center_vertical"
            android:layout_column="1"
            android:layout_span="1"
            android:layout_weight="1"
            />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_intro"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:layout_margin="5dp"
            android:layout_column="2"
            android:layout_span="3"
            android:layout_weight="5"/>

    </TableRow>
    <TableRow
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:padding="5dp">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:src="@drawable/ic_today_black_36dp"
            android:layout_column="1"
            android:layout_span="1"
            android:layout_weight="1"
            />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:gravity="left"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:text="@string/app_base_score"
            android:layout_margin="5dp"
            android:layout_column="2"
            android:layout_span="3"
            android:layout_weight="5"/>
    </TableRow>
</TableLayout>

Answer 1

这花了一点时间，但我必须做与 layout_weight 相关的更改，整个 table 结构必须更改。我对最后两行使用了 LinearLayout。前四行可以使用 TableLayout 完成。 Layout_spans 必须简化 - 似乎我们不能有复杂的布局。很高兴了解是否有更好的解决方案。

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

    <TableRow
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:padding="5dp" >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_rankgrade"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textStyle="bold"
            android:textColor="@android:color/black"
            android:textAlignment="center"
            android:layout_weight="2"
            />

    </TableRow>
    <TableRow
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:padding="2dp" android:layout_gravity="center">
        <RelativeLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/relativelayout"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"  android:layout_gravity="center" android:gravity="center" android:layout_weight="1">

            <ImageView
                android:id="@+id/myImageView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/trframered1"

                />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignLeft="@id/myImageView"
                android:layout_alignTop="@id/myImageView"
                android:layout_alignRight="@id/myImageView"
                android:layout_alignBottom="@id/myImageView"
                android:layout_margin="1dp"
                android:gravity="center"
                android:orientation="vertical"
                >
                <TextView
                    android:id="@+id/myImageViewTextHead"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="1dp"
                    android:gravity="center"
                    android:text="@string/app_last_rank_grade"
                    android:textColor="#000000" />
                <TextView
                    android:id="@+id/txtLastDayRankGrade"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="1dp"
                    android:gravity="center"
                    android:text="-"
                    android:textColor="#000000" />

            </LinearLayout>


        </RelativeLayout>

        <RelativeLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/relativelayout1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" android:layout_gravity="center" android:gravity="center" android:layout_weight="1">

            <ImageView
                android:id="@+id/myImageView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/trframered1" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignLeft="@id/myImageView1"
                android:layout_alignTop="@id/myImageView1"
                android:layout_alignRight="@id/myImageView1"
                android:layout_alignBottom="@id/myImageView1"
                android:layout_margin="1dp"
                android:gravity="center"
                android:orientation="vertical"
                >
                <TextView
                    android:id="@+id/myImageViewTextHead1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="1dp"
                    android:gravity="center"
                    android:text="All Time"
                    android:textColor="#000000" />
                <TextView
                    android:id="@+id/txtLastAllTimeRankGrade"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="1dp"
                    android:gravity="center"
                    android:text="-"
                    android:textColor="#000000" />

            </LinearLayout>


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

    <TableRow
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:padding="5dp">
        <Button
            android:layout_height="wrap_content"
            android:text="@string/app_get_questions"
            android:id="@+id/btnNext"
            android:textColor="@color/windowBackground"
            android:layout_span="2"
            android:layout_weight="2"
            />
    </TableRow>
    <TableRow
        android:layout_height="fill_parent"
        android:layout_width="match_parent"
        >
        <TextView
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/app_scoring_leaders"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textStyle="bold"
            android:layout_span="2"
            android:layout_weight="2"
            android:padding="5dp"/>
    </TableRow>
    <TableRow
        android:layout_height="fill_parent"
        android:layout_width="match_parent"
        android:padding="5dp">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/txtDailyScores"
            android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:layout_margin="5dp"
            android:layout_weight="1"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/txtAllTimeScores"
            android:text="1. Kapil Bhagia (34511)\n2. Hardik Bhagia (2231)"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:layout_margin="5dp"
            android:layout_weight="1"/>
    </TableRow>

    <TableRow
        android:layout_height="fill_parent"
        android:layout_width="match_parent"
        >
        <TextView
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:text="@string/app_get_started"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textStyle="bold"
            android:layout_weight="2"
            android:layout_span="2"
            android:padding="5dp"/>
    </TableRow>
   </TableLayout>

            <LinearLayout
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal" >
                <ImageView
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_assessment_black_36dp"
                    android:layout_gravity="center_vertical"
                    android:layout_width="wrap_content"
                    android:padding="10dp"
                    />
                <TextView
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    android:text="@string/app_intro"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:padding="10dp"
                    />
            </LinearLayout>

            <LinearLayout
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal" >
                <ImageView
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:src="@drawable/ic_today_black_36dp"
                    android:layout_width="wrap_content"
                    android:padding="10dp"
                    />
                <TextView
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:text="@string/app_base_score"
                    android:padding="10dp"
                    />
            </LinearLayout>

Android TableLayout 问题 - 无法正确设置

Android TableLayout issue - Not able to set it correctly

android

android-tablelayout