Pular para o conteúdo

Mais visitados

Visitados recentemente

navigation

Como definir sombras e recortar visualizações

O Material Design introduz a elevação em elementos da interface do usuário. A elevação ajuda os usuários a entender a importância relativa de cada elemento e concentrar a atenção deles nas tarefas à mão.

A elevação de uma visualização, representada pela propriedade Z, determina a aparência visual das sombras: visualizações com valores de Z mais altos lançam sombras maiores e mais suaves. Visualizações com valores de Z mais altos ocultam visualizações com valores de Z mais baixos, mas o valor de Z de uma visualização não afeta o tamanho dela.

As sombras são desenhadas pelo pai da visualização elevada e, por isso, estão sujeitas a recortes padrão de visualização, recortadas pelo pai por padrão.

A elevação também é útil para criar animações em que os widgets se elevam temporariamente sobre o plano de visualização ao realizar alguma ação.

Para obter mais informações sobre elevação no Material Design, consulte Objetos no espaço 3D.

Atribuir elevação a visualizações

O valor de Z para uma visualização tem dois componentes:

Z = elevation + translationZ

Figura 1 - sombras para diferentes elevações de visualização.

Para definir a elevação de uma visualização em uma definição de layout, use o atributo android:elevation . Para definir a elevação de uma visualização no código de uma atividade, use o método View.setElevation().

Para definir a conversão de uma visualização, use o método View.setTranslationZ().

Os novos métodos ViewPropertyAnimator.z() e ViewPropertyAnimator.translationZ() permitem animar facilmente a elevação de exibições. Para obter mais informações, consulte a referência de API para ViewPropertyAnimator e o guia do desenvolvedor Animação de propriedade.

Você também pode usar um StateListAnimator para especificar essas animações de um modo declarativo, O que é especialmente útil para casos em que o estado muda as animações de acionamento, como quando um usuário pressiona um botão. Para obter mais informações, consulte Mudanças de estado de visualização da animação.

Os valores de Z são medidos em dp (pixels independentes de densidade).

Personalizar sombras e contornos de visualizações

Os limites de um desenhável do segundo plano da visualização determinam a forma padrão da sombra. Contornos representam a forma externa de um objeto gráfico e definem a área de ondulação para o feedback de toque.

Analise esta visualização, definida com um desenhável de segundo plano:

<TextView
    android:id="@+id/myview"
    ...
    android:elevation="2dp"
    android:background="@drawable/myrect" />

O desenhável do segundo plano é definido como um retângulo com bordas arredondadas:

<!-- res/drawable/myrect.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <solid android:color="#42000000" />
    <corners android:radius="5dp" />
</shape>

A visualização lança uma sombra com bordas arredondadas, uma vez que o desenhável de segundo plano define o contorno da visualização. Fornecer um contorno personalizado neutraliza a forma padrão de uma sombra da visualização.

Para definir um contorno personalizado para uma visualização no seu código:

  1. Amplie a classe ViewOutlineProvider.
  2. Neutralize o método getOutline().
  3. Atribua o novo fornecedor de contorno à visualização com o método View.setOutlineProvider().

Você pode criar contornos ovais e retangulares com bordas arredondadas usando os métodos na classe Outline. O fornecedor de contorno padrão para visualizações obtém o contorno do segundo plano da visualização. Para evitar que uma visualização lance uma sombra, defina o fornecedor de contorno dela como null.

Recortar visualizações

Recortar visualizações permite mudar facilmente a forma de uma visualização. Você pode recortar visualizações para obter consistência com outros elementos de design ou para mudar a forma de uma visualização em resposta à interação do usuário. É possível recortar uma visualização na área do contorno usando o método View.setClipToOutline() ou o atributo android:clipToOutline. Somente contornos retangulares, circulares e retangulares redondos são compatíveis com recorte, conforme determinado pelo método Outline.canClip().

Para recortar uma visualização na forma de um desenhável, defina o desenhável como o segundo plano da visualização (conforme exibido acima) e chame o método View.setClipToOutline() .

O recorte de visualizações é uma operação cara, por isso, não anime a forma que você usa para recortar uma visualização. Para atingir esse efeito, use a animação Efeito de Revelação.

Este site usa cookies para armazenar suas preferências quanto às opções de idioma e exibição específicas ao site.

Receba as dicas e notícias mais recentes para desenvolvedores Android que ajudarão você a ter sucesso no Google Play.

* Campos obrigatórios

Uhu!

Siga o Google Developers no WeChat

Navegar neste site em ?

Você solicitou uma página em , mas sua preferência de idioma para este site está definida como .

Quer alterar sua preferência de idioma e navegar neste site em ? Para alterar a preferência de idioma depois, use o menu de idiomas na parte inferior de cada página.

É preciso ter o nível de API ou superior para esta aula

Este documento está oculto porque o nível de API selecionado para a documentação é o . Para alterar o nível, clique no seletor acima da barra de navegação esquerda.

Para mais informações sobre como especificar o nível de API que o seu app precisa, leia o artigo Compatibilidade com diferentes versões de plataforma.

Take a short survey?
Help us improve the Android developer experience. (April 2018 — Developer Survey)