Estou começando um desenvolvimento no Eclipse, porém o estilo é muito feio, bordas, letras etc.
É possível utilizar CSS no Android?
Estou começando um desenvolvimento no Eclipse, porém o estilo é muito feio, bordas, letras etc.
É possível utilizar CSS no Android?
Os Views
do Android "não usam"/"não suportam" StyleSheet (folha de estilo) o que você pode alterar é o textColor
o typeface
, etc pelo XML do View
.
Por exemplo:
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#00FF00"
android:typeface="monospace"
android:text="@string/hello" />
Outra maneira de alterar que ficará semelhante ao CSS é usar o atributo style=""
, assim:
<TextView
style="@style/CodeFont"
android:text="@string/hello" />
Este @style/CodeFont
pode ser aplicado a vários "Views".
Você também pode usar herança assim como é no CSS através do atributo parent
:
<style name="GreenText" parent="@android:style/TextAppearance">
<item name="android:textColor">#00FF00</item>
</style>
Na tag style
você pode usar o atributo name
para herdar outros estilos de outras tags style
. Seria algo como:
<style name="CodeFont">
...
</style>
Este vai herdar o CodeFont
e a aplicar algo a mais
<style name="CodeFont.Red">
...
</style>
Este vai herdar o CodeFont
e CodeFont.Red
e a aplicar algo a mais
<style name="CodeFont.Red">
...
</style>
Porém ainda sim não conseguirá efeitos muito avançados
Existe uma maneira de usar o WebView
para criar aplicativos e assim usar CSS. Porém seus aplicativos serão quase totalmente em HTML.
Você precisa criar um WebView
:
<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
E precisará habilitar o JavaScript:
WebView myWebView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
Para carregar um arquivo dos resources use o caminho do url como file:///android_asset/...
, exemplo:
myWebView.loadUrl("file:///android_asset/html/index.html");
Para carregar a folha de estilo, use algo como no seu html:
<link rel="stylesheet" type="text/css" href="file:///android_asset/css/main.css">
Para carregar backgrounds no CSS, faça algo como:
body {
background: url(file:///android_asset/images/bg.jpg);
}
Para entender como usar os resources leia: http://developer.android.com/guide/topics/resources/overview.html
Nota: Requer Android 5.0 (API level 21)
O Android agora possui o "Material Design" que pode lhe ajudar, leia Creating Apps with Material Design
Você pode usar chamando:
@android:style/Theme.Material
(dark version)@android:style/Theme.Material.Light
(light version)@android:style/Theme.Material.Light.DarkActionBar
Usando herança para chamar o tema:
<style name="AppTheme" parent="android:Theme.Material">
<!-- Cores do tema -->
<!-- Cores do appbar -->
<item name="android:colorPrimary">@color/primary</item>
<!-- variação "dark" para a barra de estado e o contexto das "barras de ferramentas" -->
<item name="android:colorPrimaryDark">@color/primary_dark</item>
<!-- Tema UI dos controles (tipo checkboxes e campos de texto) -->
<item name="android:colorAccent">@color/accent</item>
</style>
Por onde começar: https://developer.android.com/training/material/get-started.html
Não é possível usar CSS em View's do Android puro. Se você usar WebView
você pode é claro.
Mas você pode criar Styles
que podem ser associadas as mesmas pelo atributo android:style
, o que seria semelhante a um seletor/classe css. Mas essa estilização segue o padrão do android, com os atributos que você já usa.
Um exemplo seria:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CodeFont" parent="@android:style/TextAppearance.Medium">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textColor">#00FF00</item>
<item name="android:typeface">monospace</item>
</style>
</resources>
Para usar:
<EditText
android:id="@+id/edittext"
android:style="@style/CodeFont" <!-- "import" do estilo criado -->
android:layout_alignLeft="@+id/button"
android:layout_below="@+id/textView1"
android:layout_marginTop="61dp"
android:ems="10"
android:text="@string/enter_text"
android:inputType="text" />
Algumas referências: