Wycinki w oknie tworzenia

Wycięcie w ekranie to obszar, który na niektórych urządzeniach wykracza poza powierzchnię wyświetlacza. Pozwala on korzystać z usług od początku do końca, a jednocześnie zapewnia miejsce na ważne czujniki z przodu urządzenia.

Rysunek 1 Przykład wycięcia w trybie portretowym

Ilustracja 2. Przykład wycięcia w trybie poziomym

Android obsługuje wycięcia w ekranie na urządzeniach z Androidem 9 (poziom interfejsu API 28) i nowszym. Producenci urządzeń mogą też obsługiwać wycięcia w ekranie na urządzeniach z Androidem 8.1 lub starszym.

Na tej stronie dowiesz się, jak wdrożyć obsługę urządzeń z wycięciami w tworzeniu oraz jak korzystać z obszaru wycięcia – czyli prostokąta od krawędzi do krawędzi na powierzchni wyświetlacza, który zawiera wycięcie.

Domyślna wielkość liter

Domyślnie wycięcia w ekranie są zawarte w informacjach o wkładkach okien. Z tego powodu aplikacja nie rysuje w obszarach wycięcia w ekranie, gdy wykonasz instrukcje tworzenia aplikacji od krawędzi do krawędzi.

Na przykład gdy użyjesz Modifier.windowInsetsPadding(WindowInsets.safeContent) lub Modifier.windowInsetsPadding(WindowInsets.safeDrawing), aplikacja nie rysuje automatycznie w obszarach, w których znajduje się wycięcie. WindowInsets.safeContent i WindowInsets.safeDrawing zawierają informacje o wycięciu w ekranie i nie rysują tam, gdzie znajduje się wycięcie w urządzeniu.

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)

    WindowCompat.setDecorFitsSystemWindows(window, false)

    setContent {
        Box(Modifier.windowInsetsPadding(WindowInsets.safeContent)) {
            // Any composable inside here will avoid drawing behind cutouts
        }
    }
}
CutoutSnippets.kt

Aby jeszcze bardziej dostosować to działanie, musisz samodzielnie przetworzyć dane wycięcia.

Obsługa informacji o wycięciu ręcznie

Możesz radzić sobie z wycięciami na następujące sposoby:

• Używasz WindowInsets.displayCutout

• Ustawienie w pliku manifestu motywu za pomocą opcji android:windowLayoutInDisplayCutoutMode

• Automatyczne ustawianie opcji na Window za pomocą funkcji window.attributes.layoutInDisplayCutoutMode

• Uzyskiwanie dostępu do obiektu wycięcia Path za pomocą narzędzia LocalView.current.rootWindowInsets.displayCutout

W przypadku funkcji Compose zalecamy ustawienie opcji windowLayoutInDisplayCutoutMode na default w ogólnym motywie, a następnie użycie WindowInsets.displayCutout do obsługi wstawienia w plikach kompozycyjnych:

Canvas(modifier = Modifier.fillMaxSize().windowInsetsPadding(WindowInsets.displayCutout)) {
    drawRect(Color.Red, style = Stroke(2.dp.toPx()))
}
CutoutSnippets.kt

Ta metoda umożliwia zachowanie dopełnienia displayCutout tam, gdzie jest to wymagane, lub zignorowanie go, gdy nie jest wymagane.

Możesz też zastosować te same ustawienia, które są opisane w dokumentacji wycięć widoków, ustawiając inną opcję motywu aktywności android:windowLayoutInDisplayCutoutMode lub ustawiając atrybut okna za pomocą window.attributes.layoutInDisplayCutoutMode = LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT. Tryb wycięcia jest jednak stosowany do całej aktywności i nie można go kontrolować dla każdego elementu kompozycyjnego.

Aby uwzględnić wycięcie w ekranie w niektórych funkcjach kompozycyjnych, użyj właściwości WindowInset.displayCutout. Ten interfejs API umożliwia dostęp do informacji o wycięciu, gdy jest to konieczne.

Sprawdzone metody

Podczas pracy z wycięciami w ekranie weź pod uwagę te kwestie:

• Zwróć uwagę na rozmieszczenie kluczowych elementów interfejsu. Zadbaj o to, aby obszar wycięcia nie zasłaniał ważnych tekstów, elementów sterujących ani innych informacji.
• W obszarze wycięcia nie umieszczaj ani nie rozszerzaj żadnych elementów interaktywnych, które wymagają precyzyjnego rozpoznawania dotyku. Czułość ekranu może być niższa w obszarze wycięcia.
• W przypadku stosowania wytycznych od krawędzi do krawędzi we wkładkach safeDrawing / safeContent zawarte są informacje o wycięciu.
• Gdy tylko jest to możliwe, używaj Modifier.windowInsetsPadding(WindowInsets.safeDrawing), aby określić odpowiednie dopełnienie, które zostanie zastosowane do Twoich treści. Unikaj kodowania na stałe wysokości paska stanu, ponieważ może to prowadzić do nakładania się lub obcinania treści.

Sprawdzanie sposobu renderowania treści za pomocą wycięć

Przetestuj wszystkie ekrany i sposób działania aplikacji. Jeśli to możliwe, przeprowadź testy na urządzeniach z różnymi typami wycięć. Jeśli nie masz urządzenia z wycięciem, możesz symulować typowe konfiguracje wycięcia na dowolnym urządzeniu lub w emulatorze z Androidem 9 lub nowszym. Aby to zrobić:

1. Włącz Opcje programisty.
2. Na ekranie Opcje programisty przewiń w dół do sekcji Rysowanie i wybierz Symuluj ekran z wycięciem.
3. Wybierz typ wycięcia.

   

   Rysunek 3. Użyj Opcji programisty, aby przetestować renderowanie treści.