2011-12-17 10 views
0

は誰がどのようにAndroidのレイアウト:テーブルビュー

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 
    <LinearLayout 
     android:orientation="horizontal" 
     android:layout_width="fill_parent" 
     android:gravity="center" 
     android:layout_height="wrap_content" > 
    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="#300000" 
     android:textColor="#ff0000" 
     android:text="Sample Layout"/> 
    </LinearLayout> 
    <TableLayout 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent"> 
    <TableRow> 
    <Button 
     android:layout_column="1" 
     android:layout_height="wrap_content" 
     android:background="@drawable/icon" 
     android:padding="2dip"/> 
    <Button 
     android:layout_column="2" 
     android:layout_height="wrap_content" 
     android:background="@drawable/icon" 
     android:padding="2dip"/> 
    <Button 
     android:layout_column="3" 
     android:layout_height="wrap_content" 
     android:background="@drawable/icon" 
     android:padding="2dip"/> 
    </TableRow> 
    <TableRow> 
    <TextView 
     android:layout_column="1" 
     android:layout_height="wrap_content" 
     android:padding="2dip" 
     android:text="News Feed"/> 
    <TextView 
     android:layout_column="2" 
     android:layout_height="wrap_content" 
     android:text="Profile" 
     android:padding="2dip"/> 
    <TextView 
     android:layout_column="3" 
     android:layout_height="wrap_content" 
     android:text="Friends" 
     android:padding="2dip"/> 
    </TableRow> 
    <TableRow> 
    <Button 
     android:layout_column="1" 
     android:layout_height="wrap_content" 
     android:background="@drawable/icon" 
     android:padding="2dip"/> 
    <Button 
     android:layout_column="2" 
     android:layout_height="wrap_content" 
     android:background="@drawable/icon" 
     android:padding="2dip"/> 
    <Button 
     android:layout_column="3" 
     android:layout_height="wrap_content" 
     android:background="@drawable/icon" 
     android:padding="2dip"/> 
    </TableRow> 
    <TableRow> 
    <TextView 
     android:layout_column="1" 
     android:layout_height="wrap_content" 
     android:text="Messages" 
     android:padding="5dip"/> 
    <TextView 
     android:layout_column="2" 
     android:layout_height="wrap_content" 
     android:text="Places" 
     android:padding="5dip"/> 
    <TextView 
     android:layout_column="3" 
     android:layout_height="wrap_content" 
     android:text="Groups" 
     android:padding="5dip"/> 
    </TableRow> 
    </TableLayout> 
</LinearLayout> 

My layout

の下に私のサンプルを作ることを教えてもらえますより下のターゲットの例のように見えます。パディングは期待どおりに動作していないように見えます。また、テーブルレイアウト全体を中央に配置する必要があると思います。誰かが私に何がうまくいかないのか理解できるように助けてくれる?ターゲットレイアウト(3x3ではなく3x2)に合わせて変更する必要があるのは何ですか?ありがとう。

Target Layout

答えて

2

利用ImageButton代わりのButton、及び各ボタンの下に正しくテキストを中央に各テーブルセル内のネストされたLinearLayoutを使用します。親に水平にあなたのビューを中心

<TableRow> 
    <LinearLayout 
     android:orientation="vertical" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" > 
     <ImageButton 
      android:layout_gravity="center_horizontal" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="#00000000" 
      android:src="@drawable/icon" /> 
     <TextView 
      android:layout_gravity="center_horizontal" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:padding="2dip" 
      android:text="News Feed"/> 
    </LinearLayout> 

    <LinearLayout> 
     ... 
    </LinearLayout> 
</TableRow> 

お知らせandroid:layout_gravity="center_horizontal"ビュー。このコードではいくつかの改善が必要な場合がありますが、これは一般的な考え方です(layout_gravity、ネストされたレイアウト、ImageButtonを使用する)。

<TableLayout 
    android:layout_height="wrap_content" 
    android:layout_width="wrap_content" 
    android:stretchColumns="*" > 
+0

グレート:それは可能な空間全体を使用しますので、

また、あなたのテーブルレイアウトを向上させることができます! android:stretchColumnsを使用すると、テーブルが中央に配置されます。ありがとうございました!これは間違いなく物事を少し改善します。好奇心が強いのですが、ボタンにテキストがないのでImageButtonを使用しますか?また、実際のImageButtonではなく、テキストの周囲にパディングを追加していることに気付きました(しかし、ImageButtonはパディングを持つように見えます)。どのようにImageButtonの周りのパディングを削除しますか? –

+0

はいイメージボタンは、ボタンではなくイメージを表示したいときに適しています。ここでは、ボタンの背景を透明にしました(カラー#00000000)が、背景だけでなく画像も持つことができます。同様のアプリケーションのソースコードを見つけようとして、続ける方法を知っておくことをお勧めします。 – Dalmas

+0

TextViewの周りにパディングを設定していませんでしたが、ImageButtonsで同じことをしたい場合は、パディングの代わりにマージンを使用してください( android:marginLeft、marginRightなど)。 – Dalmas