Barra de controle minimizada
Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
A barra de controle minimizada é usada para exibir um conjunto mínimo de controles e metadados. Quando selecionada, ela abre uma sobreposição em tela cheia que inclui uma barra de controle maior com controles adicionais.
Por exemplo, a barra de controle minimizada para aplicativos de mídia mantém um pequeno conjunto de controles de reprodução e metadados disponíveis em todo o aplicativo enquanto a música está sendo reproduzida – e também pode abrir uma visualização de reprodução em tela cheia.
Componente da barra de controle
A barra de controle completa pode exibir um conjunto expandido de controles.
Anatomia
1. Bloco de conteúdo 2. Metadados 3. Controles
Especificações
Componente de itens da lista
Especificações, diretrizes de estilo e muito mais
Barra de controle minimizada
Barra de controle minimizada com texto excedente
Dimensionamento de layouts
Esses layouts de referência mostram como adaptar a barra de controle minimizada para telas de diferentes larguras e alturas. Observe que todos os valores de pixel estão em pixels renderizados, antes de qualquer redução ou aumento de resolução.
Telas de largura padrão
Telas amplas
Telas extralargas e superlargas
Estilos
Tipografia
Estilo de digitação
Tipo de letra
Peso
Tamanho (dp)
Corpo 1
Robô
Regular
32
Corpo 3
Robô
Regular
24
Cor
Elemento
Cor (modo diurno)
Cor (modo noturno)
Tipo primário
Branco
Branco @ 88%
Tipo secundário
Branco @ 72%
Branco @ 60%
Ícones
Branco
Branco @ 88%
Indicador de tempo decorrido
sotaque de terceiros
sotaque de terceiros
Indicador de tempo restante
#464A4D
#464A4D
Fundo da barra de controle minimizada
#0E1013 @ 84%
#0E1013 @ 88%
Truncamento de gradiente
Preto @ 0-100% em 10% do espaço de texto
Preto @ 0-100% em 10% do espaço de texto
Tamanhos
Elemento
Tamanho (dp)
Ícones
44
Bloco de conteúdo
96
Indicador de progresso
84
Acompanhamento do indicador de progresso
4
Altura da barra de controle minimizada
128
Raio do canto arredondado (R1)
4
Exemplos
Barra de controle minimizada para telas com largura superior à padrão. Barra de controle minimizada para telas de largura padrão.
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Não contém as informações de que eu preciso","missingTheInformationINeed","thumb-down"],["Muito complicado / etapas demais","tooComplicatedTooManySteps","thumb-down"],["Desatualizado","outOfDate","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Problema com as amostras / o código","samplesCodeIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 2026-03-04 UTC."],[],[]]