A plataforma Android é responsável por desenhar a interface do sistema, como a barra de status e a barra de navegação. Essa interface do sistema é exibida independentemente do app que o usuário está usando.
WindowInsets fornece informações sobre a interface
do sistema para garantir que o app seja renderizado na área correta e que a interface não seja obscurecida
pela interface do sistema.
No Android 14 (nível 34 da API) e versões anteriores, a interface do app não é renderizada abaixo das barras de sistema e dos cortes de tela por padrão.
No Android 15 (nível 35 da API) e versões mais recentes, o app é renderizado abaixo das barras do sistema e exibe recortes quando o app é direcionado ao SDK 35. Isso resulta em uma experiência do usuário mais integrada e permite que o app aproveite ao máximo o espaço da janela disponível.
Mostrar conteúdo atrás da IU do sistema é chamado de exibição de ponta a ponta. Nesta página, você vai aprender sobre os diferentes tipos de insets, como ir de borda a borda, e como usar as APIs inset para animar a interface e garantir que o conteúdo do app não seja obscurecido por elementos da interface do sistema.
Conceitos básicos de inserção
Quando um app é exibido de ponta a ponta, é necessário garantir que o conteúdo e as interações importantes não sejam obscurecidos pela interface do sistema. Por exemplo, se um botão for colocado atrás da barra de navegação, o usuário não poderá clicar nele.
O tamanho da interface do sistema e as informações sobre onde ela é colocada são especificados por insets.
Cada parte da interface do sistema tem um tipo correspondente de inseto que descreve o tamanho e o local onde ele é colocado. Por exemplo, os insetos da barra de status fornecem o tamanho e a posição da barra de status, enquanto os insetos da barra de navegação fornecem o tamanho e a posição da barra de navegação. Cada tipo de inseto consiste em quatro dimensões de pixel: superior, esquerda, direita e inferior. Essas dimensões especificam até onde a interface do sistema se estende dos lados correspondentes da janela do app. Para evitar a sobreposição com esse tipo de interface do sistema, a interface do app precisa ser inserida nesse valor.
Estes tipos de inset integrados do Android estão disponíveis no WindowInsets:
Os insetos descrevem as barras de status. São as barras da interface do sistema na parte de cima que contêm ícones de notificação e outros indicadores. |
|
Os entalhes da barra de status quando eles estão visíveis. Se as barras de status estiverem ocultas (por causa da entrada no modo de tela cheia imersiva), os insetos da barra de status principal vão estar vazios, mas não vão estar vazios. |
|
Os insetos descrevendo as barras de navegação. São as barras da interface do sistema à esquerda, à direita ou na parte de baixo do dispositivo, que descrevem a barra de tarefas ou os ícones de navegação. Eles podem mudar no momento da execução com base no método de navegação preferido do usuário e na interação com a barra de tarefas. |
|
Os engastes da barra de navegação quando eles estão visíveis. Se as barras de navegação estiverem ocultas (devido à entrada no modo de tela cheia imersiva), os insetos da barra de navegação principal vão estar vazios, mas não vão estar vazios. |
|
O inseto que descreve a decoração da janela da interface do sistema em uma janela de formato livre, como a barra de título da parte de cima. |
|
Os insetos da barra de legendas quando estão visíveis. Se as barras de legenda estiverem ocultas, os insetos da barra de legenda principal vão estar vazios, mas não vão estar vazios. |
|
A união dos encartes da barra do sistema, que inclui as barras de status, de navegação e de legenda. |
|
Os engastes da barra do sistema quando eles estão visíveis. Se as barras do sistema estiverem ocultas (por causa da entrada no modo de tela cheia imersiva), os insetos da barra do sistema principal vão estar vazios, mas não vão estar vazios. |
|
Os insetos descrevem a quantidade de espaço na parte de baixo que o teclado de software ocupa. |
|
Os insetos descrevem a quantidade de espaço que o teclado de software ocupava antes da animação atual. |
|
Os insetos descrevem a quantidade de espaço que o teclado de software vai ocupar após a animação atual do teclado. |
|
Um tipo de encarte que descreve informações mais detalhadas sobre a interface de navegação, indicando a quantidade de espaço em que os "toques" serão processados pelo sistema, e não pelo app. Para barras de navegação transparentes com navegação por gestos, alguns elementos do app podem ser tocados pela interface de navegação do sistema. |
|
Os elementos de inserção tocáveis quando estão visíveis. Se os elementos que podem ser tocados estiverem ocultos (por causa da entrada no modo de tela cheia imersiva), os insetos principais do elemento que pode ser tocado vão estar vazios, mas não vão estar vazios. |
|
Os insets representam a quantidade de insetos em que o sistema vai interceptar gestos para navegação. Os apps podem especificar manualmente o processamento de uma quantidade limitada desses gestos usando |
|
Um subconjunto dos gestos do sistema que sempre serão processados pelo sistema e que não podem ser desativados usando |
|
Os insetos representam a quantidade de espaço necessária para evitar a sobreposição com um entalhe na tela (entalhe ou orifício). |
|
Os engastes que representam as áreas curvas de uma exibição em cascata. Uma tela em cascata tem áreas curvas ao longo das bordas, onde a tela começa a se curvar nas laterais do dispositivo. |
Esses tipos são resumidos por três tipos de inserção "seguros" que garantem que o conteúdo não seja obstruído:
Esses tipos de insetos "seguros" protegem o conteúdo de maneiras diferentes, com base nos insetos da plataforma:
- Use
WindowInsets.safeDrawingpara proteger conteúdo que não pode ser exibido abaixo de nenhuma interface do sistema. Esse é o uso mais comum de insets: evitar a exibição de conteúdo obscurecido pela interface do sistema (parcial ou completamente). - Use
WindowInsets.safeGesturespara proteger o conteúdo com gestos. Isso evita que os gestos do sistema entrem em conflito com os gestos do app (como os de páginas inferiores, carrosséis ou jogos). - Use
WindowInsets.safeContentcomo uma combinação deWindowInsets.safeDrawingeWindowInsets.safeGesturespara garantir que o conteúdo não tenha sobreposição visual nem de gestos.
Recomendados para você
- Observação: o texto do link aparece quando o JavaScript está desativado.
- Componentes e layouts do Material Design
- Migrar
CoordinatorLayoutpara o Compose - Outras considerações