Question

我试图使用GridLayout模仿Android上的这种设计：

enter image description here

我认为我使用以下代码完成了大部分操作：

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:columnCount="8"
    android:rowCount="4"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="10dp"
    android:orientation="horizontal"
    android:background="@drawable/rounded">

    <TextView
        android:layout_gravity="center_horizontal"
        android:text="Some Text Here"
        android:textStyle="bold"
        android:textColor="#000000"
        android:textSize="30dp"
        android:textAlignment="center"
        android:layout_columnSpan="8"
        android:paddingBottom="10dp"
        />

    <TextView
        android:text="16"
        android:textStyle="bold"
        android:paddingRight="70dp"
        android:textColor="#000000"
        android:textSize="18dp"
        android:paddingLeft="10dp"
        android:paddingBottom="5dp"/>

    <TextView
        android:text="27"
        android:textStyle="bold"
        android:paddingRight="70dp"
        android:textSize="18dp"
        android:textColor="#000000"/>

    <TextView
        android:text="52"
        android:textStyle="bold"
        android:layout_columnSpan="6"
        android:textSize="18dp"
        android:paddingRight="10dp"
        android:textColor="#000000"/>

    <TextView
        android:text="Text 1"
        android:paddingRight="20dp"
        android:paddingLeft="10dp"
        android:textSize="18dp"
        android:textColor="#ff565656"
        android:paddingBottom="10dp"/>

    <TextView
        android:text="Text 2"
        android:paddingRight="20dp"
        android:textSize="18dp"
        android:textColor="#ff565656"/>

    <TextView
        android:text="Text 3"
        android:textColor="#ff565656"
        android:textSize="18dp"
        android:paddingRight="10dp"/>

</GridLayout>

但是，当我在我的模拟器中运行它时，它看起来像这样：

enter image description here

请注意，它在左侧和左侧留下了太多空间。

问题

如何配置网格布局，使其占据屏幕右侧和左侧的大部分屏幕（就像上面的示例一样）。
如何更改屏幕背景颜色 - 现在它是黑色的，我想将其更改为其他颜色。

Answer 1

对于GridLayout，请替换此...

android:layout_width="wrap_content"

...与

android:layout_width="fill_parent"

如下......

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:columnCount="8"
    android:rowCount="4"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="10dp"
    android:orientation="horizontal"
    android:background="@drawable/rounded">

Answer 2

@Anthony - 您在编写的代码中没有使用GridLayout的强大功能和本质。因为您已经为视图手动分配了填充，以使它们出现在第一个屏幕中，这对于任何其他布局也是如此。如下所示。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center" >

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"

    android:layout_height="0dp"
    android:layout_weight="2"
    android:text="Some Text Here"
    android:textAppearance="?android:attr/textAppearanceLarge" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" >

    <TextView
    android:id="@+id/textView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="2"
    android:text="16"
    android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
    android:id="@+id/textView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="2"
    android:text="17"
    android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
    android:id="@+id/textView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="2"
    android:text="18"
    android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" >

    <TextView
    android:id="@+id/textView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="2"
    android:text="Text1"
    android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
    android:id="@+id/textView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="2"
    android:text="Text2"
    android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
    android:id="@+id/textView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="2"
    android:text="Text3"
    android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>

而且，GridLayout是关于行和列的。因此，如果您希望将视图放置在这样并且使用它来更充分，那么您可以提供行和列位置，您应该按哪种顺序放置它们，并将其它属性添加到其中。这是link.

试试这个，我相信你会更好地理解它。快乐的编码。：）

如何配置GridLayout以占用大部分水平屏幕空间

2 个答案: