web-dev-qa-db-ja.com

Windowsタイルのような6つのボタンでレイアウトを作成する方法

WindowsPhoneのタイルとして画面サイズに自動的に適応する6つのボタンを備えたレイアウトを作成しようとしています。コードでは、6ボタン、2行を動的に作成しますが、ボタンは後者を埋める画面のサイズに合う必要があります。どうすれば続行できますか？

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:orientation="vertical" >

<LinearLayout
    Android:layout_width="match_parent"
        Android:layout_height="0dip"
    Android:orientation="horizontal"
    Android:weightSum="2" >

    <Button
        Android:layout_width="0dip"
                Android:layout_height="match_parent"
        Android:layout_weight="1"
        Android:background="@drawable/conv_up" />

    <Button
        Android:layout_width="0dip"
                Android:layout_height="match_parent"
        Android:layout_weight="1"
        Android:background="@drawable/conv_up"
         />

</LinearLayout>

<LinearLayout
    Android:layout_width="match_parent"
        Android:layout_height="0dip"
    Android:orientation="horizontal"
    Android:weightSum="2" >

    <Button
        Android:layout_width="0dip"
                Android:layout_height="match_parent"
        Android:layout_weight="1"
        Android:background="@drawable/conv_up"
        />

    <Button
        Android:layout_width="0dip"
                Android:layout_height="match_parent"
        Android:layout_weight="1"
        Android:background="@drawable/conv_up"
         />

</LinearLayout>

<LinearLayout
    Android:layout_width="match_parent"
        Android:layout_height="0dip"
    Android:orientation="horizontal"
    Android:weightSum="2" >

    <Button
        Android:layout_width="0dip"
                Android:layout_height="match_parent"
        Android:layout_weight="1"
        Android:background="@drawable/conv_up"
         />

    <Button
        Android:layout_width="0dip"
                Android:layout_height="match_parent"
        Android:layout_weight="1"
        Android:background="@drawable/conv_up"
        />

</LinearLayout>
androidandroid-layoutandroid-intentandroid-listview
11
bisemanu

子と同じ重みの3つの行を持つ垂直LinearLayoutを使用します。各行は、同じ重みの2つの子を持つ水平LinearLayoutであり、領域全体が確実に満たされるようにします。 6つのボタンの場合、パフォーマンスは問題になりません。

パフォーマンスが懸念される場合は、行をRelativeLayoutsとして作成し、支柱を使用して半分に分割し、それに基づいて2つの子を配置できます。

私がstrutと言うとき、私はこれを意味します：

<View Android:id="@+id/strut"
    Android:layout_width="0dp"
    Android:layout_height="0dp" 
    Android:layout_centerHorizontal="true"/>

更新：LinearLayoutsを試しているので、高さと幅を処理する方法は次のとおりです。

親LinearLayoutは次のものを持つことができます。

Android:layout_width="match_parent"
Android:layout_height="match_parent"

3人のLinearLayoutの子は次のようになります。

Android:layout_width="match_parent"
Android:layout_height="0dip"

Buttonsには次のものがあります。

Android:layout_width="0dip"
Android:layout_height="match_parent"

お気づきのように、0dipウェイトが適用されるプロパティ（親が垂直方向の場合は高さ、親が水平方向の場合は幅）。スペースを埋めるために拡大する必要があります。

これが完全なXMLです（ボタンにはドローアブルが含まれていないので、自由に追加してください）：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:orientation="vertical" >

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="0dip"
        Android:orientation="horizontal"
        Android:layout_weight="1" >

        <Button
            Android:layout_width="0dip"
            Android:layout_height="match_parent"
            Android:layout_weight="1" />

        <Button
            Android:layout_width="0dip"
            Android:layout_height="match_parent"
            Android:layout_weight="1"/>
    </LinearLayout>

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="0dip"
        Android:orientation="horizontal"
        Android:layout_weight="1" >

        <Button
            Android:layout_width="0dip"
            Android:layout_height="match_parent"
            Android:layout_weight="1" />

        <Button
            Android:layout_width="0dip"
            Android:layout_height="match_parent"
            Android:layout_weight="1"/>
    </LinearLayout>

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="0dip"
        Android:orientation="horizontal"
        Android:layout_weight="1" >

        <Button
            Android:layout_width="0dip"
            Android:layout_height="match_parent"
            Android:layout_weight="1" />

        <Button
            Android:layout_width="0dip"
            Android:layout_height="match_parent"
            Android:layout_weight="1" />
    </LinearLayout>
</LinearLayout>

そして結果： enter image description here

18
Voicu

GridView を見てみるべきだと思います

5
Hein

GridLayoutを使用してください！これはこの状況に最適です

<GridLayout
    Android:layout_width="match_parent"
    Android:layout_height="350dp"
    Android:layout_margin="0.5dp"
    Android:columnCount="2"
    Android:rowCount="3" >

    <Button
        Android:id="@+id/b_1"
         />

    <Button
        Android:id="@+id/b_2"
         />

    <Button
        Android:id="@+id/b_3"
         />

    <Button
        Android:id="@+id/b_4"
         />

    <Button
        Android:id="@+id/b_5"
         />

    <Button
        Android:id="@+id/b_6"
        />
</GridLayout>
1
user2983212

Android .v7ライブラリを使用しています。このxmlは、画面全体に表示される2列3行のレイアウトを作成するために機能しました。

<?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/lib/Android.support.v7.widget.GridLayout"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    xmlns:grid="http://schemas.Android.com/apk/res-auto"
    Android:layout_margin="0.5dp"
    app:columnCount="2"
    app:rowCount="3"
    app:useDefaultMargins="true">

    <Button
        Android:id="@+id/b_1"
        grid:layout_columnWeight="1"
        grid:layout_rowWeight="1"
        grid:layout_row="0"
        grid:layout_column="0"
        Android:text="Hellooo"/>

    <Button
        Android:id="@+id/b_2"
        grid:layout_columnWeight="1"
        grid:layout_rowWeight="1"
        grid:layout_row="0"
        grid:layout_column="1"
        Android:text="Hellooo"/>

    <Button
        Android:id="@+id/b_3"
        grid:layout_columnWeight="1"
        grid:layout_rowWeight="1"
        grid:layout_row="1"
        grid:layout_column="0"
        Android:text="Hellooo"/>

    <Button
        Android:id="@+id/b_4"
        grid:layout_columnWeight="1"
        grid:layout_rowWeight="1"
        grid:layout_row="1"
        grid:layout_column="1"
        Android:text="Hellooo"/>

    <Button
        Android:id="@+id/b_5"
        grid:layout_columnWeight="1"
        grid:layout_rowWeight="1"
        grid:layout_row="2"
        grid:layout_column="0"
        Android:text="Hellooo"/>

    <Button
        Android:id="@+id/b_6"
        grid:layout_columnWeight="1"
        grid:layout_rowWeight="1"
        grid:layout_row="2"
        grid:layout_column="1"
        Android:text="Hellooo"/>

</Android.support.v7.widget.GridLayout>
0
Gene Bo