Przejdź do treści głównej
Wersja: 0.81

DrawerLayoutAndroid

Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

Komponent React opakowujący natywny DrawerLayout (tylko Android). Menu boczne (zwykle używane do nawigacji) jest renderowane za pomocą renderNavigationView, a bezpośrednie elementy potomne stanowią główny widok (gdzie trafia twoja zawartość). Widok nawigacyjny początkowo nie jest widoczny na ekranie, ale można go wysunąć z boku okna określonego przez właściwość drawerPosition, a jego szerokość można ustawić za pomocą właściwości drawerWidth.

Przykład


Dokumentacja

Właściwości

Właściwości widoku

Dziedziczy właściwości widoku.


drawerBackgroundColor

Określa kolor tła menu bocznego. Domyślna wartość to white. Aby ustawić przezroczystość, użyj formatu rgba. Przykład:

tsx
return (
<DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)" />
);
TypeRequired
colorNo

drawerLockMode

Określa tryb blokady menu bocznego. Menu może być zablokowane w 3 stanach:

  • unlocked (domyślnie) - menu reaguje na gesty dotykowe (otwieranie/zamykanie).

  • locked-closed - menu pozostaje zamknięte i nie reaguje na gesty.

  • locked-open - menu pozostaje otwarte i nie reaguje na gesty. Nadal można je otwierać/zamykać programowo (openDrawer/closeDrawer).

TypeRequired
enum('unlocked', 'locked-closed', 'locked-open')No

drawerPosition

Określa stronę ekranu, z której wysuwa się menu boczne. Domyślnie ustawione na left.

TypeRequired
enum('left', 'right')No

drawerWidth

Określa szerokość menu bocznego, dokładniej szerokość widoku wysuwanego z krawędzi okna.

TypeRequired
numberNo

keyboardDismissMode

Określa, czy klawiatura ma być chowana w odpowiedzi na przeciąganie.

  • 'none' (domyślnie) - przeciąganie nie powoduje chowania klawiatury.

  • 'on-drag' - klawiatura jest chowana przy rozpoczęciu przeciągania.

TypeRequired
enum('none', 'on-drag')No

onDrawerClose

Funkcja wywoływana po zamknięciu widoku nawigacyjnego.

TypeRequired
functionNo

onDrawerOpen

Funkcja wywoływana po otwarciu widoku nawigacyjnego.

TypeRequired
functionNo

onDrawerSlide

Funkcja wywoływana przy każdej interakcji z widokiem nawigacyjnym.

TypeRequired
functionNo

onDrawerStateChanged

Funkcja wywoływana przy zmianie stanu menu bocznego. Dostępne 3 stany:

  • idle - brak aktualnej interakcji z widokiem nawigacyjnym

  • dragging - trwa interakcja z widokiem nawigacyjnym (przeciąganie)

  • settling - zakończono interakcję, a widok kończy animację zamykania/otwierania

TypeRequired
functionNo

renderNavigationView

Widok nawigacyjny renderowany z boku ekranu, który można wysunąć.

TypeRequired
functionYes

statusBarBackgroundColor

Umożliwia menu zajęcie całego ekranu i rysowanie tła paska stanu, aby otwierało się nad nim. Działa tylko w interfejsach API 21+.

TypeRequired
colorNo

Metody

closeDrawer()

tsx
closeDrawer();

Zamyka menu boczne.


openDrawer()

tsx
openDrawer();

Otwiera menu boczne.