Interface de Usuários - Aplicando estilos e Temas na interface

É isso ai pessoal, mesmo com dengue, cá estou eu não deixando-os na mão. Pelo menos a febre baixou, mas o corpo ainda está todo dolorido. Nada que me impedisse de vir aqui escrever mais esse post.

-----

Existem duas maneiras de se aplicar um estilo:

• Aplicando o estilo a uma View individual, onde você adiciona o atributo style no elemento View dentro da XML responsável pelo seu layout ou;
• Aplicando um estilo para uma atividade ou aplicação, onde você adiciona o atributo android:theme em <activity> ou <application> dentro do manifesto do Android.

Quando você aplica um estilo a uma View em particular dentro do layout, as propriedades definidas pelo estilo são aplicadas apenas aquela View. Se um estilo é aplicado a um ViewGroup, os elementos View filhos NÃO vão herdar as propriedades de estilo - apenas o elemento no qual é aplicado diretamente o estilo terá as propriedades mostradas. Contudo, se você quer que um estilo se aplique a todos os elementos View, você terá de usar um tema.

Para aplicar uma definição de estilo como um tema, você deve aplicá-lo à atividade ou aplicação dentro do manifesto do Android. Quando você faz dessa maneira, cada View dentro da atividade ou aplicação vai aplicar as propriedades que suportadas. Por exemplo, se você aplicar o estilo CodeFont do post anterior a uma atividade, então todas os elementos View que suportam o estilo de texto descrito dentro do arquivo de estilo vão aplicá-lo. Quaisquer Views que não suportem alguma das propriedades não a terão aplicada. Se uma View suporte apenas uma das propriedades, apenas essa propriedade será aplicada.

Aplicando um estilo a uma View

Aqui está como aplicar um estilo para uma View no layout XML:

<TextView
    style="@style/CodeFont"
    android:text="@string/hello" />

Agora esse TextView terá um estilo definido pelo estilo de nome CodeFont.

Nota: O atributo style NÃO usa o prefixo android: como visto em android:text.

Aplicando um tema a uma atividade ou aplicação

Para aplicar um tema para todas as atividades de sua aplicação, abra o arquivo AndroidManifest.xml e edite a tag <application> inserindo o atributo android:theme com o nome do estilo. Por exemplo:

<application android:theme="@style/CustomTheme">

Se você quer um tema aplicado apenas a uma atividade de sua aplicação, então adicione o atributo android:theme à tag <activity>.

Assim como o Android provê outros recursos já built-in (ou, de fábrica, por assim dizer), existem outros temas pré-definidos que você pode usar para evitar escrever tudo você mesmo. Por exemplo, você pode usar o tema Dialog e fazer com que uma atividade fique com a cara de uma caixa de diálogo:

<activity android:theme="@android:style/Theme.Dialog">

Ou, se você pode querer que o fundo seja transparente, você pode usar o tema Translucent:

<activity android:theme="@android:style/Theme.Translucent">

Se você gostou de algum tema, você ainda pode modificá-lo e, por que não, melhorá-lo. Para tal, adicione o tema como parent de seu tema customizado. Por exemplo, você pode modificar o tema e inserir suas próprias cores:

<color name="custom_theme_color">#b0b0ff</color><style name="CustomTheme" parent="android:Theme.Light">    <item name="android:windowBackground">@color/custom_theme_color</item>    <item name="android:colorBackground">@color/custom_theme_color</item></style>

Note que a cor precisa ser suprida como um recurso separado aqui pois o atributo android:windowBackground apenas suporta a referência para outro recurso, diferente de android:colorBackground, que a ele pode ser dado um literal representando uma cor.

Agora, para usar o tema customizado ao invés de Theme.Light dentro do manifesto Android, basta fazer isso:

<activity android:theme="@style/CustomTheme">

Selecione o tema baseado na versão de plataforma

Novas versões do Android tem temas adicionais aplicáveis às aplicações e você pode querer usá-los quando estiver rodando suas aplicações nessas plataformas enquanto elas se mantém, mesmo assim, compatíveis com versões anteriores. Você pode conseguir isso através de um tema customizado que usa uma seleção de recursos para definir diferentes temas pais, baseados na versão da plataforma.

Por exemplo, aqui está uma declaração de um tema customizável que é simplesmente a versão padrão Theme.Light que se encontraria dentro de um arquivo XML na pasta res/values (tipicamente res/values/styles.xml):

<style name="LightThemeSelector" parent="android:Theme.Light">    ...</style>

Para que esse tema use o tema holográfico do Android 3.0 (API 11), você pode colocar uma declaração alternativa para o tema dentro de um arquivo XML em res/values-v11, mudando apenas o valor de parent:

<style name="LightThemeSelector" parent="android:Theme.Holo.Light">    ...</style>

Assim, ele saberá qual tema pai usar baseado na versão da API. Caso seja a API 11 ou maior, usará o android:Theme.Holo.Light. Caso seja menor, usará android:Theme.Light.

Uma lista de atributos padrão que você pode usar em temas pode ser encontrado em R.stylable.Theme.

Usando uma plataforma de estilos e temas

A plataforma Android provê uma larga coleção de estilos e temas que você pode usar em suas aplicações. Você poderá encontrar referências para estilos disponíveis na classe R.style. Para usar os estilos listados dentro de R.style, substitua todos os caracteres underscore _ com um ponto. Por exemplo, você pode aplicar o tema Theme_NoTitleBar com "@android:style/Theme.NoTitleBar".

No entanto, a referência contida em R.style não é bem documentada e não descreve no todo os estilos, então ver o código desses estilos dá um melhor entendimento de como ele é. Para uma melhor referência dos estilos e temas do Android, veja esses códigos fontes:

• Estilos do Android
• Temas do Android