2015-06-17 118 views
1

我想實現一個TableLayout有兩列,第二列分成兩行。事情是這樣的:兩列,一列分成兩行 - Android

enter image description here

什麼我到目前爲止是這樣它基本上創建三列:

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

    <TableRow 
     android:id="@+id/tr1" 
     android:layout_width="wrap_content" 
     android:layout_height="160dp" 
     > 

     <ImageView 
      android:src="@drawable/icon" 
      android:layout_span="1" 
      android:layout_height="160dp" 
      android:layout_width="200dp" 
      android:scaleType="centerCrop" 
      /> 

     <ImageView 
      android:src="@drawable/icon" 
      android:layout_height="75dp" 
      android:layout_width="wrap_content" 
      android:scaleType="centerCrop" 
      /> 

     <ImageView 
      android:src="@drawable/icon" 
      android:layout_height="75dp" 
      android:scaleType="centerCrop" 
      android:layout_width="wrap_content"/> 

    </TableRow> 

</TableLayout> 

回答

1

您可以通過的LinearLayout!而非TableLayout組合實現這一點:

<LinearLayout 
    android:layout_width="0dp" 
    android:layout_height="144dp" 
    android:layout_weight="0.5" 
    android:background="@android:color/holo_red_dark"> 

    // Column A. 
    // Put your content here.. 

</LinearLayout> 

<LinearLayout 
    android:layout_width="0dp" 
    android:layout_height="144dp" 
    android:orientation="vertical" 
    android:weightSum="1" 
    android:layout_weight="0.5"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="72dp" 
     android:background="@android:color/holo_green_dark" 
     android:layout_weight="0.5"> 

     // Column B, row 1. 
     // Put your content here.. 

    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="72dp" 
     android:background="@android:color/holo_blue_dark" 
     android:layout_weight="0.5"> 

     // Column B, row 2. 
     // Put your content here.. 

    </LinearLayout> 

</LinearLayout> 

這是它會產生的佈局:

enter image description here

0

您可以使用LinearLayout歸檔相同的結果:

<?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="100dp" 
android:orientation="horizontal"> 

<LinearLayout 
    android:layout_width="0dp" 
    android:layout_weight="50" 
    android:layout_height="match_parent" 
    android:orientation="vertical"></LinearLayout> 

<LinearLayout 
    android:layout_width="0dp" 
    android:layout_weight="50" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 
    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_weight="50" 
     android:layout_height="0dp" 
     android:orientation="vertical"></LinearLayout> 
    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_weight="50" 
     android:orientation="vertical" 
     android:layout_height="0dp"></LinearLayout> 
</LinearLayout> 
</LinearLayout> 

但是你可以使用RelativeLayout獲得更好的性能。

+0

爲什麼不使用'RelativeLayout'回答? – lpfx