Android visual effects: colours and themes
I'm back; this time, to talk about styles in Android. Styles and colours. And themes too. Let's get started.
Who's what and what's who
Here's a basic guide to the files involved in colouring up your app:
The styles.xml found in the values folder (app/res/values/styles.xml) is what pretty much controls everything. That has the names of the themes your app may use in the <style> tag and all the different colours under the <style> tag.
Here's an example:
<style name="AppTheme" parent="android:Theme.Holo.Light">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
It's pretty self explanatory. The name holds the name of the theme and the parent of the theme holds the theme that your customised theme is based on.
Important: You may get errors if you try to mix and match themes.
If you're using Android studio, then you should have an option to open the file in editor. The editor will give you a GUI to easily change the colours of just about anything you want to. However, if you are not using Android Studio then you will have to change the colours manually.
That's not exactly hard. You just have to go to the colors.xml (app/res/values/colors.xml) and change the colours from there. All colours are in the normal HTML colour format.
Once the colours have been set, put them into the styles.xml. Here's how:
colorPrimary is the primary colour (your toolbars and all that will have this colour). Change this into a colour you want to be most prominent in your app.
colorPrimaryDark is the secondary colour (your title bar and things like that). Change this into a darker colour of whatever you chose for colorPrimary (you don't want to emphasise this colour)
Now that your theme is ready, you need to fix this theme into your app. Go to your android manifest.xml and in the application tag, do this:
where MyTheme is the theme you just created in the styles.xml.
And you're done. This should replace the colour schemes in your Android app.
Important: You may get errors if you try to mix and match themes.
If you're using Android studio, then you should have an option to open the file in editor. The editor will give you a GUI to easily change the colours of just about anything you want to. However, if you are not using Android Studio then you will have to change the colours manually.
That's not exactly hard. You just have to go to the colors.xml (app/res/values/colors.xml) and change the colours from there. All colours are in the normal HTML colour format.
Once the colours have been set, put them into the styles.xml. Here's how:
colorPrimary is the primary colour (your toolbars and all that will have this colour). Change this into a colour you want to be most prominent in your app.
colorPrimaryDark is the secondary colour (your title bar and things like that). Change this into a darker colour of whatever you chose for colorPrimary (you don't want to emphasise this colour)
Now that your theme is ready, you need to fix this theme into your app. Go to your android manifest.xml and in the application tag, do this:
android:theme="@style/MyTheme"
where MyTheme is the theme you just created in the styles.xml.
And you're done. This should replace the colour schemes in your Android app.
Comments
Post a Comment