Android - Estilos e Temas

UMA stylerecurso define o formato e procura uma IU. Um estilo pode ser aplicado a uma Visualização individual (de dentro de um arquivo de layout) ou a uma Atividade ou aplicativo inteiro (de dentro do arquivo de manifesto).

Definindo Estilos

Um estilo é definido em um recurso XML separado do XML que especifica o layout. Este arquivo XML reside emres/values/ diretório do seu projeto e terá <resources>como o nó raiz, que é obrigatório para o arquivo de estilo. O nome do arquivo XML é arbitrário, mas deve usar a extensão .xml.

Você pode definir vários estilos por arquivo usando <style>tag, mas cada estilo terá seu nome que identifica exclusivamente o estilo. Os atributos de estilo do Android são definidos usando<item> tag conforme mostrado abaixo -

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <style name="CustomFontStyle">
      <item name="android:layout_width">fill_parent</item>
      <item name="android:layout_height">wrap_content</item>
      <item name="android:capitalize">characters</item>
      <item name="android:typeface">monospace</item>
      <item name="android:textSize">12pt</item>
      <item name="android:textColor">#00FF00</item>/> 
   </style>
</resources>

O valor de <item> pode ser uma string de palavra-chave, uma cor hexadecimal, uma referência a outro tipo de recurso ou outro valor dependendo da propriedade de estilo.

Usando Estilos

Uma vez que seu estilo é definido, você pode usá-lo em seu arquivo XML Layout usando style atributo da seguinte forma -

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:orientation="vertical" >

   <TextView
      android:id="@+id/text_id"
      style="@style/CustomFontStyle"
      android:text="@string/hello_world" />

</LinearLayout>

Para entender o conceito relacionado ao estilo Android, você pode verificar o exemplo de demonstração de estilo .

Herança de estilo

O Android oferece suporte à Herança de estilo de maneira muito semelhante à folha de estilo em cascata no web design. Você pode usar isso para herdar propriedades de um estilo existente e, a seguir, definir apenas as propriedades que deseja alterar ou adicionar.

Para implementar um tema personalizado, crie ou edite MyAndroidApp / res / values / themes.xml e adicione o seguinte -

<resources>
   ...
   <style name="MyCustomTheme" parent="android:style/Theme">
   <item name="android:textColorPrimary">#ffff0000</item>
   </style>
   ...
</resources>

Em seu AndroidManifest.xml, aplique o tema às atividades que deseja estilizar -

<activity
   android:name="com.myapp.MyActivity"
   ...
   android:theme="@style/MyCustomTheme"
   />

Seu novo tema será aplicado à sua atividade, e o texto agora é vermelho brilhante.

Aplicando Cores aos Atributos do Tema

Seu recurso de cor pode então ser aplicado a alguns atributos do tema, como o plano de fundo da janela e a cor primária do texto, adicionando elementos <item> ao seu tema personalizado. Esses atributos são definidos em seu arquivo styles.xml. Por exemplo, para aplicar a cor personalizada ao fundo da janela, adicione os seguintes dois elementos <item> ao seu tema personalizado, definido no arquivo MyAndroidApp / res / values / styles.xml -

<resources>
   ...
   <style name="MyCustomTheme" ...>
      <item name="android:windowBackground">@color/my_custom_color</item>
      <item name="android:colorBackgroundCacheHint">@color/my_custom_color</item>
   </style>
   ...
</resources>

Usando um Nove-Patch Personalizado com Botões

Um drawable de nove remendos é um tipo especial de imagem que pode ser dimensionada em largura e altura, mantendo sua integridade visual. Nove patches são a maneira mais comum de especificar a aparência dos botões do Android, embora qualquer tipo de drawable possa ser usado.

um botão Sample of Nine-Patch

Passos para criar botões de nove patches

Salve este bitmap como /res/drawable/my_nine_patch.9.png
Defina um novo estilo
Aplique o novo estilo de botão ao atributo buttonStyle do seu tema personalizado

Define a new Style

<resources>
   ...
      <style name="MyCustomButton" parent="android:Widget.Button">
      <item name="android:background">@drawable/my_nine_patch</item>
      </style>
   ...
</resources>

Apply the theme

<resources>
   ...
      <style name="MyCustomTheme" parent=...>
         ...
         <item name="android:buttonStyle">@style/MyCustomButton</item>
      </style>
   ...
</resources>

Temas Android

Espero que você tenha entendido o conceito de estilo, então agora vamos tentar entender o que é um Theme. Um tema nada mais é que um estilo Android aplicado a uma atividade ou aplicativo inteiro, em vez de uma Visualização individual.

Assim, quando um estilo é aplicado como tema, todo Viewna atividade ou aplicativo aplicará cada propriedade de estilo que ele suporta. Por exemplo, você pode aplicar o mesmoCustomFontStyle estilo como um tema para uma atividade e, em seguida, todo o texto dentro desse Activity terá uma fonte monoespaçada verde.

Para definir um tema para todas as atividades de seu aplicativo, abra o AndroidManifest.xml arquivo e edite o <application> tag para incluir o android:themeatributo com o nome do estilo. Por exemplo -

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

Mas se você quiser que um tema seja aplicado a apenas uma atividade em seu aplicativo, adicione o atributo android: theme apenas à tag <activity>. Por exemplo -

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

Existem vários temas padrão definidos pelo Android que você pode usar diretamente ou herdá-los usando parent atributo da seguinte forma -

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

Para entender o conceito relacionado ao tema Android, você pode verificar Exemplo de demonstração de tema .

Estilo da paleta de cores

O design do layout pode ser implementado com base nas cores baseadas, por exemplo, como o design a seguir é projetado com base nas cores (azul)

O layout acima foi projetado com base no arquivo style.xml, que foi colocado em res/values/

<resource>
   <style name="AppTheme" parent="android:Theme.Material">	
      <item name ="android:color/primary">@color/primary</item>
      <item name ="android:color/primaryDark">@color/primary_dark</item>
      <item name ="android:colorAccent/primary">@color/accent</item>
   </style>
<resource>

Estilos e temas padrão

A plataforma Android oferece uma grande coleção de estilos e temas que você pode usar em seus aplicativos. Você pode encontrar uma referência de todos os estilos disponíveis noR.styleclasse. Para usar os estilos listados aqui, substitua todos os sublinhados no nome do estilo por um ponto. Por exemplo, você pode aplicar o tema Theme_NoTitleBar com "@android: style / Theme.NoTitleBar". Você pode ver o seguinte código-fonte para estilos e temas Android -

↰ Previous page Next page ↱