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

Okno modalne

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 Modal to podstawowy sposób prezentowania treści nad otaczającym widokiem.

Przykład


Dokumentacja

Właściwości

Właściwości widoku

Dziedziczy właściwości widoku.


animated

Przestarzałe. Zamiast tego użyj właściwości animationType.


animationType

Właściwość animationType kontroluje sposób animowania modalu.

Dopuszczalne wartości:

  • slide - wsuwa się od dołu

  • fade - pojawia się stopniowo

  • none - pojawia się bez animacji

TypeDefault
enum('none', 'slide', 'fade')none

backdropColor

backdropColor modalu (lub kolor tła kontenera modalu). Domyślnie white, jeśli nie podano i transparent ma wartość false. Ignorowane, gdy transparent jest true.

TypeDefault
colorwhite

hardwareAccelerated
Android

Właściwość hardwareAccelerated kontroluje, czy wymusić przyspieszanie sprzętowe dla leżącego u podstaw okna.

TypeDefault
boolfalse

Właściwość navigationBarTranslucent określa, czy modal powinien być wyświetlany pod systemowym paskiem nawigacyjnym. Jednakże, aby pasek nawigacyjny był półprzezroczysty, właściwość statusBarTranslucent również musi być ustawiona na true.

TypeDefault
boolfalse

onDismiss
iOS

Właściwość onDismiss pozwala przekazać funkcję, która zostanie wywołana po zamknięciu modalu.

Type
function

onOrientationChange
iOS

Funkcja zwrotna onOrientationChange jest wywoływana przy zmianie orientacji podczas wyświetlania modalu. Orientacja jest podawana tylko jako 'portrait' lub 'landscape'. Funkcja jest również wywoływana przy początkowym renderowaniu, niezależnie od bieżącej orientacji.

Type
function

onRequestClose

Funkcja zwrotna onRequestClose jest wywoływana, gdy użytkownik naciśnie sprzętowy przycisk wstecz na Androidzie lub przycisk menu w Apple TV. Ze względu na tę wymaganą właściwość pamiętaj, że zdarzenia BackHandler nie będą emitowane, dopóki modal jest otwarty. Na iOS funkcja ta jest wywoływana podczas zamykania modalu gestem przeciągnięcia, gdy presentationStyle ma wartość pageSheet or formSheet.

Type
function
Required
Android
TV

function
iOS

onShow

Właściwość onShow pozwala przekazać funkcję, która zostanie wywołana po wyświetleniu modalu.

Type
function

presentationStyle
iOS

Właściwość presentationStyle kontroluje sposób wyświetlania modalu (głównie na większych urządzeniach jak iPad czy iPhone'y Plus). Szczegóły: https://developer.apple.com/reference/uikit/uimodalpresentationstyle.

Dopuszczalne wartości:

  • fullScreen - zajmuje cały ekran

  • pageSheet - zajmuje wyśrodkowany widok o szerokości portretu (tylko większe urządzenia)

  • formSheet - zajmuje wyśrodkowany widok o wąskiej szerokości (tylko większe urządzenia)

  • overFullScreen - zajmuje cały ekran, ale pozwala na przezroczystość

TypeDefault
enum('fullScreen', 'pageSheet', 'formSheet', 'overFullScreen')fullScreen if transparent={false}
overFullScreen if transparent={true}

statusBarTranslucent
Android

Właściwość statusBarTranslucent określa, czy modal powinien być wyświetlany pod systemowym paskiem stanu.

TypeDefault
boolfalse

supportedOrientations
iOS

Właściwość supportedOrientations pozwala na obracanie modalu do określonych orientacji. Na iOS modal nadal jest ograniczony wartościami z pola UISupportedInterfaceOrientations w pliku Info.plist aplikacji.

Gdy używasz właściwości presentationStyle ustawionej na pageSheet lub formSheet, ta właściwość jest ignorowana przez iOS.

TypeDefault
array of enums('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right')['portrait']

transparent

Właściwość transparent określa, czy modal wypełni cały widok. Ustawienie true wyrenderuje modal na przezroczystym tle.

TypeDefault
boolfalse

visible

Właściwość visible określa widoczność modalu.

TypeDefault
booltrue