最大化网格布局中的按钮

时间:2016-07-19 12:24:08

标签: android xml button maximize

我有一项活动:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout 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"
                                  app:rowCount="4"
                                  app:columncount="4">

<Button
    android:text="1"
    android:id="@+id/button1"
    app:layout_gravity="fill"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_row="0"
    app:layout_column="0""/>


<Button
    android:text="2"
    android:id="@+id/button2"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_gravity="fill"
    app:layout_row="0"
    app:layout_column="1"/>

<Button
    android:text="3"
    android:id="@+id/button3"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_gravity="fill"
    app:layout_row="0"
    app:layout_column="2"/>

<Button
    android:text="4"
    android:id="@+id/button5"

    app:layout_gravity="fill"
    app:layout_row="1"
    app:layout_column="0"/>

<Button
    android:text="5"
    android:id="@+id/button6"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_gravity="fill"
    app:layout_row="1"
    app:layout_column="1"/>

<Button
    android:text="6"
    android:id="@+id/button7"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_gravity="fill"
    app:layout_row="1"
    app:layout_column="2"/>
<Button
    android:text="7"
    android:id="@+id/button8"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_gravity="fill"
    app:layout_row="2"
    app:layout_column="0"/>
<Button
    android:text="8"
    android:id="@+id/button9"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_gravity="fill"
    app:layout_row="2"
    app:layout_column="1"/>

<Button
    android:text="9"
    android:id="@+id/button4"
    app:layout_gravity="fill"
    app:layout_rowWeight="1"
    app:layout_columnWeight="1"
    app:layout_row="2"
    app:layout_column="2"
    />

看起来像这样:

Current layout

我想更改按钮1,以便垂直划线,4和7必须最小化到wrap_contnet(在photoshop中制作) enter image description here

这样做的最佳方式是什么?

更具体地说,我需要做到这一点:

enter image description here

我是通过使用自定义宽度制作的,但我不知道如何使用布局进行此操作:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:grid="http://schemas.android.com/apk/res-auto"
tools:context="com.example.win72.myapplication.MainActivity"
grid:columnCount="3"
grid:rowCount="3">


<TextView
    grid:layout_gravity="fill"
    grid:layout_columnWeight="1"
    grid:layout_rowWeight="10"
    grid:layout_row="0"
    grid:layout_column="0"
    grid:layout_rowSpan="2"

    android:textSize="60sp"
    android:background="#a49595"
    android:text="90"
    android:id="@+id/textView"
    android:clickable="true"
    android:layout_height="457dp"/>

<TextView
    grid:layout_gravity="fill"
    grid:layout_columnWeight="1"
    grid:layout_rowWeight="10"
    grid:layout_row="0"
    grid:layout_column="2"
    grid:layout_rowSpan="2"

    android:textSize="60sp"
    android:background="#a49595"
    android:text="90"
    android:id="@+id/textView2"/>

<TextView
   grid:layout_row="2"
   grid:layout_column="0"
   grid:layout_gravity="fill_horizontal"
   grid:layout_columnWeight="1"

   android:gravity="center"
   android:textSize="30sp"
   android:text="4"
   android:id="@+id/textView3"/>

<TextView
    grid:layout_row="2"
    grid:layout_column="2"
    grid:layout_gravity="fill_horizontal"


    android:text="6"
    android:id="@+id/textView4"
    android:gravity="center"
    android:textSize="30sp"
    />

<Button
    grid:layout_row="0"
    grid:layout_column="1"
    grid:layout_columnWeight="1"
    grid:layout_gravity="fill_horizontal"
    android:text="Reset"
    android:id="@+id/button"/>

<Button
    grid:layout_row="1"
    grid:layout_column="1"
    grid:columnweight="1"
    grid:layout_gravity="fill_horizontal"

    android:text="Next"
    android:id="@+id/button2"
    />

2 个答案:

答案 0 :(得分:0)

使用staggeredgridlayout可以实现这一点。

答案 1 :(得分:0)

我发现动态计算行/列并使用rowspan可以实现:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:grid="http://schemas.android.com/apk/res-auto"
tools:context="com.example.win72.myapplication.MainActivity">


<TextView
    grid:layout_gravity="fill"
    grid:layout_columnWeight="1"
    grid:layout_rowWeight="1"
    grid:layout_row="0"
    grid:layout_column="0"
    grid:layout_rowSpan="3"

    android:textSize="60sp"
    android:background="#a49595"
    android:text="90"
    android:id="@+id/textView"
    android:clickable="true"
    />

<TextView
    grid:layout_gravity="fill"
    grid:layout_columnWeight="1"
    grid:layout_rowWeight="1"
    grid:layout_row="0"
    grid:layout_column="2"
    grid:layout_rowSpan="3"

    android:textSize="60sp"
    android:background="#a49595"
    android:text="90"
    android:id="@+id/textView2"/>

<TextView
   grid:layout_row="3"
   grid:layout_column="0"
   grid:layout_gravity="fill_horizontal"
   grid:layout_columnWeight="1"

   android:gravity="center"
   android:textSize="30sp"
   android:text="4"
   android:id="@+id/textView3"/>

<TextView
    grid:layout_row="3"
    grid:layout_column="2"
    grid:layout_gravity="fill_horizontal"


    android:text="6"
    android:id="@+id/textView4"
    android:gravity="center"
    android:textSize="30sp"
    />

<Button
    grid:layout_row="0"
    grid:layout_column="1"
    grid:layout_columnWeight="1"
    grid:layout_gravity="fill_horizontal"
    android:text="Reset"
    android:id="@+id/button"/>

<Button
    grid:layout_row="1"
    grid:layout_column="1"
    grid:layout_columnWeight="1"
    grid:layout_gravity="fill_horizontal"

    android:text="Next"
    android:id="@+id/button2"
    />

enter image description here

谢谢你的帮助!