TableLayout
to ViewGroup
, które
wyświetla podrzędne elementy View
w wierszach i kolumnach.
Uwaga: Aby uzyskać lepszą wydajność i dostęp do narzędzi, lepiej skompiluj układ przy użyciu ConstraintLayout.
TableLayout
umieszcza swoje elementy podrzędne w wierszach i
kolumny. Kontenery TableLayout nie wyświetlają linii obramowania swoich wierszy,
kolumn lub komórek. Tabela będzie miała tyle kolumn, co wiersz z
do większości komórek. Komórki w tabeli mogą być puste. Komórki mogą obejmować wiele kolumn,
jak w kodzie HTML. Możesz rozciągać kolumny za pomocą funkcji span
w klasie TableRow.LayoutParams
.
Uwaga: komórki nie mogą obejmować wielu wierszy.
Obiekty TableRow
są widokami podrzędnymi klasy TableLayout
(każdy wiersz TableRow definiuje jeden wiersz w tabeli). Każdy wiersz zawiera co najmniej 0
komórek, z których każda jest definiowana przez dowolny inny widok danych. Komórki
wiersz może zawierać różne obiekty View, takie jak ImageView albo
Obiekty TextView. Komórka może być również obiektem ViewGroup (na przykład
możesz zagnieździć inny układ tabel jako komórkę).
Ten przykładowy układ zawiera 2 wiersze i 2 komórki w każdej z nich. Zrzut ekranu przedstawia wynik z obramowaniem komórek wyświetlanym jako linie przerywane (dodane w celu uzyskania efektu wizualnego).
<?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:stretchColumns="1"> <TableRow> <TextView android:text="@string/table_layout_4_open" android:padding="3dip" /> <TextView android:text="@string/table_layout_4_open_shortcut" android:gravity="right" android:padding="3dip" /> </TableRow> <TableRow> <TextView android:text="@string/table_layout_4_save" android:padding="3dip" /> <TextView android:text="@string/table_layout_4_save_shortcut" android:gravity="right" android:padding="3dip" /> </TableRow> </TableLayout>
Kolumny można ukrywać, oznaczać jako rozciągające i wypełniające dostępną przestrzeń na ekranie
lub mogą zostać oznaczone jako możliwe do zmniejszenia, aby wymusić zmniejszenie kolumny do momentu, gdy tabela
pasuje do ekranu. Zobacz TableLayout reference
dokumentację.
Przykład
- Uruchom nowy projekt o nazwie HelloTableLayout.
- Otwórz plik
res/layout/main.xml
i wstaw te dane:<?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:stretchColumns="1"> <TableRow> <TextView android:layout_column="1" android:text="Open..." android:padding="3dip" /> <TextView android:text="Ctrl-O" android:gravity="right" android:padding="3dip" /> </TableRow> <TableRow> <TextView android:layout_column="1" android:text="Save..." android:padding="3dip" /> <TextView android:text="Ctrl-S" android:gravity="right" android:padding="3dip" /> </TableRow> <TableRow> <TextView android:layout_column="1" android:text="Save As..." android:padding="3dip" /> <TextView android:text="Ctrl-Shift-S" android:gravity="right" android:padding="3dip" /> </TableRow> <View android:layout_height="2dip" android:background="#FF909090" /> <TableRow> <TextView android:text="X" android:padding="3dip" /> <TextView android:text="Import..." android:padding="3dip" /> </TableRow> <TableRow> <TextView android:text="X" android:padding="3dip" /> <TextView android:text="Export..." android:padding="3dip" /> <TextView android:text="Ctrl-E" android:gravity="right" android:padding="3dip" /> </TableRow> <View android:layout_height="2dip" android:background="#FF909090" /> <TableRow> <TextView android:layout_column="1" android:text="Quit" android:padding="3dip" /> </TableRow> </TableLayout>
Przypomina to strukturę tabeli HTML.
TableLayout
jest podobny do elementu HTML<table>
;TableRow
jest jak element><tr>>
; ale w komórkach możesz użyć dowolnego elementuView
. W tym przykładzie W każdej komórce jest używane poleTextView
. Pomiędzy niektórymi wierszami jest też podstawowyView
, który służy do rysowania linii poziomej. - Upewnij się, że aktywność HelloTableLayout wczytuje ten układ w
Metoda
onCreate()
:Kotlin
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.main) }
Java
public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); }
Metoda
setContentView(int)
wczytuje plik układu dla elementuActivity
, określony przez zasób Identyfikator –R.layout.main
odnosi się do układures/layout/main.xml
. - Uruchom aplikację.
Strona powinna wyglądać tak: