1

メニューを次のように表示します。

ここに画像の説明を入力

アイコンを各グリッドの中央に常に配置したい。そのため、さまざまな画面サイズで見栄えがします。

今私のコードはこのように見えますが、画面が大きくなると見栄えが悪くなります。

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" 
android:background="@drawable/water">

 <TableRow
     android:id="@+id/tableRow1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:gravity="center" >

     <ImageButton
         android:id="@+id/imageButton_city"
         android:layout_width="128dp"
         android:layout_height="128dp"
         android:layout_gravity="center_horizontal"
         android:layout_marginBottom="15dp"
         android:layout_marginRight="15dp"
         android:background="@null"
         android:contentDescription="@string/city_des"
         android:scaleType="fitCenter"
         android:src="@drawable/city_button" />

     <ImageButton
         android:id="@+id/imageButton_states"
         android:layout_width="128dp"
         android:layout_height="128dp"
         android:layout_gravity="center_horizontal"
         android:layout_marginBottom="15dp"
         android:layout_marginLeft="15dp"
         android:background="@null"
         android:contentDescription="@string/state_des"
         android:scaleType="fitCenter"
         android:src="@drawable/states_button" />

 </TableRow>

 <TableRow
     android:id="@+id/tableRow2"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:gravity="center" >

     <ImageButton
         android:id="@+id/imageButton_currency"
         android:layout_width="128dp"
         android:layout_height="128dp"
         android:layout_marginRight="15dp"
         android:background="@null"
         android:contentDescription="@string/converter_des"
         android:scaleType="fitCenter"
         android:src="@drawable/currency_button" />

    <ImageButton
        android:id="@+id/imageButton_tip"
        android:layout_width="128dp"
        android:layout_height="128dp"
        android:layout_marginLeft="15dp"
        android:background="@null"
        android:contentDescription="@string/tip_des"
        android:scaleType="fitCenter"
        android:src="@drawable/tip_button" />

 </TableRow>

 <TableRow
     android:id="@+id/tableRow3"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:gravity="center_horizontal|center" >

     <ImageButton
         android:id="@+id/imageButton_information"
         android:layout_width="128dp"
         android:layout_height="128dp"
         android:layout_marginTop="15dp"
         android:background="@null"
         android:contentDescription="@string/information_des"
         android:scaleType="fitCenter"
         android:src="@drawable/information_button" />

 </TableRow>

誰かがこれを達成する方法を教えてください。

編集：

Davidの助けを借りて、私はそれを修正しました。コードは次のようになります。

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

<TableRow
    android:id="@+id/tableRow1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

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

        <ImageButton                
            android:layout_centerInParent="true"
            ...>
        </ImageButton>
    </RelativeLayout>

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

        <ImageButton                
            android:layout_centerInParent="true"
            ...  >
        </ImageButton>
    </RelativeLayout>
</TableRow>

<TableRow
    android:id="@+id/tableRow2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

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

        <ImageButton
            android:layout_centerInParent="true"
            ...  >
        </ImageButton>
    </RelativeLayout>

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

        <ImageButton                
            android:layout_centerInParent="true"
            ...   >
        </ImageButton>
    </RelativeLayout>
</TableRow>

<TableRow
    android:id="@+id/tableRow3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center" >

    <ImageButton
        ...  >
    </ImageButton>

</TableRow>

4

2 に答える 2

0

あなたImageButtonを aでラップして、属性RelativeLayoutを与えてみませんか? の子は、常に完全に中心にある子を持つです。これで、ビュー階層は次のようになります。ImageButtonandroid:layout_centerInParent="true"TableRowRelativeLayoutImageButton

<TableRow
    ... >

    <RelativeLayout
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        ... >

        <ImageButton
            android:layout_height="match_parent"
            android:layout_width="match_parent"
            android:layout_centerInParent="true"
            ... >

        </ImageButton>
    </RelativeLayout>
</TableRow>

また、2 つのボタンがある行の場合、1 つのボタンでラップし、それぞれに 1 の重みを与えることができます。これRelativeLayoutによりLinearLayout、RelativeLayoutスペースが均等に分配され、各ビューに 50%、または 3 の場合は 33.3%、4 の場合は 25% などになります。 ...例は次のとおりです。

<TableRow
    ... >

    <LinearLayout
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        ... >

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

            <ImageButton
                android:layout_height="match_parent"
                android:layout_width="match_parent"
                android:layout_centerInParent="true"
                ... >

            </ImageButton>
        </RelativeLayout>

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

            <ImageButton
                android:layout_height="match_parent"
                android:layout_width="match_parent"
                android:layout_centerInParent="true"
                ... >

            </ImageButton>
        </RelativeLayout>
    </LinearLayout>
</TableRow>
于 2013-04-19T14:33:30.873 に答える
0

ここを参考にandroid:layout_gravity="center_horizontal"画像を中心に使用できます。

于 2013-04-19T14:33:36.217 に答える