Wie verwende ich TableLayout, um das gewünschte Design zu erstellen?

Question

HELP Ich benutze TableLayout & TableRow, im Bild unten versuche ich Nr. 4 und Nr.6 zusammen wie Nr.1 ​​aber ich hatte keine Ahnung, wie es geht. Für Nr. 1 konnte ich tun, weil ich nur Layout-Gewicht verwende, um den Bildschirm in 3row, 3col zu teilen.

<TableLayout 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:stretchColumns="*"> 
<TableRow 
    android:layout_weight="2" 
    android:id="@+id/tableRow1"> 
    <TextView 
     android:text="1" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:gravity="center" 
     android:background="@android:color/holo_blue_dark" /> 
    <TableLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_span="2" 
     android:stretchColumns="*" 
     android:id="@+id/tableLayout1"> 
     <TableRow 
      android:layout_weight="1" 
      android:id="@+id/tableRow1" 
      android:background="@android:color/holo_red_dark"> 
      <TextView 
       android:text="2" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:layout_span="2" 
       android:gravity="center" /> 
     </TableRow> 
     <TableRow 
      android:layout_weight="1" 
      android:id="@+id/tableRow3"> 
      <TextView 
       android:text="3" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:gravity="center" /> 
      <TextView 
       android:text="4" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:gravity="center" /> 
     </TableRow> 
    </TableLayout> 
</TableRow> 
<TableRow 
    android:layout_weight="1" 
    android:id="@+id/tableRow1"> 
    <TextView 
     android:text="5" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_span="2" 
     android:gravity="center" 
     android:background="@android:color/holo_green_dark" /> 
    <TextView 
     android:text="6" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:gravity="right" /> 
</TableRow> 

unten img ist das Ergebnis, das ich

Answer 1

Verwendung GridLayout will. Versuchen Sie diesen folgenden Code

<?xml version="1.0" encoding="utf-8"?> 
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:padding="5dp" 
android:rowCount="3" 
android:columnCount="3" 
android:layout_height="wrap_content"> 


<Button 
android:text="1" 
android:layout_height="wrap_content" 
android:layout_gravity="fill_vertical" 
android:layout_rowSpan="2" 
android:layout_width="wrap_content" 
android:background="#abc012"/> 

<Button 
android:text="2" 
android:layout_columnSpan="2" 
android:layout_gravity="fill_horizontal" 
android:layout_height="wrap_content" 
android:layout_width="wrap_content" 
android:background="#a01012"/> 
<Button 
android:text="3" 
android:layout_gravity="fill" 
android:layout_height="wrap_content" 
android:layout_width="wrap_content" 
android:background="#10fa5c"/> 

<Button 
android:text="4" 
android:layout_rowSpan="2" 
android:layout_gravity="fill_vertical" 
android:layout_height="wrap_content" 
android:layout_width="wrap_content" 
android:background="#9d34a1"/> 

<Button 
android:text="5" 
android:layout_gravity="fill_horizontal" 
android:layout_columnSpan="2" 
android:layout_height="wrap_content" 
android:layout_width="wrap_content" 
android:background="#f0f53f"/> 

</GridLayout> 

Bildschirm geschossen

bearbeiten 1

ersetzen Sie einfach den

android:layout_height="match_parent" 

statt

android:layout_height="wrap_content" 

in <GridLayout>. Dann erhalten Sie folgende Ausgabe: