Development of Android style: Style article

The front cushion so much, finally to talk about this series of Saga, the integration of all resources, defined as a unified style.
What should be defined as a uniform style? Give some examples:

1. The title of each page title bar will basically have the same font size, color, alignment, inner spacing, outer space, etc., which can be defined as a style;
2. Many buttons also use a consistent background, inner spacing, text color, text size, text alignment, and so on, which can also be defined as a style;
3. Network loading progress bar is basically the same, can also be defined as a style;
4. If you don't like the system's popup style, you can also customize the style.

Definition of Style

The Android style is generally defined in the res/values/styles.xml file, which has a root element <resource>, and each style definition is defined by the < Resource> Sub-tab <style> to complete,<style> to set different properties by adding multiple <item> .
In addition, styles can be inherited through the parent property of the <style> tag that declares the style to inherit, or by a dot prefix (.), preceded by a parent style name followed by a child style name. The point prefix method only applies to custom styles, and to inherit the Android built-in style, it can only be declared through the parent property.
Use an example to illustrate the specific usage, the following code is the default button style for Android 5.0 system:

<styleName="Widget.Material.Button"><itemName="Background"> @drawable/btn_default_material</item><itemName="Textappearance">?attr/textappearancebutton</item><itemName="MinHeight">48dip</item> <item name= "MinWidth" >88dip</item> <item name=  "Statelistanimator" > @anim/button_state_list_anim_material </item> <item name= "focusable" > True</item> <item name= "clickable" Span class= "NT" >>true</item> <item name=  "Gravity" >center_vertical|center_horizontal</item>< Span class= "NT" ></STYLE>            

Wherestatelistanimator specifies the animation when the state changes, thebutton_state_list_anim_material code is as follows:

<!--Res/anim/button_state_list_anim_material.xml--<?xml version= "1.0" encoding= "Utf-8"?><selectorXmlns:android="Http://schemas.android.com/apk/res/android"><itemAndroid:state_pressed="True"Android:state_enabled="True"><set><objectanimatorAndroid:propertyname="Translationz"android:duration="@integer/button_pressed_animation_duration"android:valueto="@dimen/button_pressed_z_material"Android:valuetype="Floattype"/><objectanimatorAndroid:propertyname="Elevation"android:duration="0"android:valueto="@dimen/button_elevation_material"Android:valuetype="Floattype"/></set></item><!--base State--<itemAndroid:state_enabled="True"><set><objectanimatorAndroid:propertyname="Translationz"android:duration="@integer/button_pressed_animation_duration"android:valueto="0"android:startdelay="@integer/button_pressed_animation_delay"Android:valuetype="Floattype"/><objectanimatorAndroid:propertyname="Elevation"android:duration="0"android:valueto="@dimen/button_elevation_material"Android:valuetype="Floattype"/></set> </item> <item> < Set> <objectanimator android:propertyname= "TranslationZ" android:duration= "0" android:valueto= "0" android:valuetype= "Floattype" /> < Objectanimator android:propertyname= "elevation" android: Duration= "0" android:valueto= "0" android: Valuetype= "Floattype" /> </set> </ Item></SELECTOR>           

As you can see, the animation for each state is an animated set of properties, and the use of property animations is referenced in the animation chapter.
Now I want to inherit the Widget.Material.Button style, change the background and the text color, then the code is as follows:

<!--res/values/styles.xml--<resources>    name=parent=name="Android: Background "> @drawable/bg_btn_selectorname=" Android:textcolor "> @color/text_btn_ Selector</style></resources>          

Among them,@drawable/bg_btn_selector and @color/text_btn_selector Implementation, please refer to selector chapter.
Some buttons, I just want to change the text color, but the background want to make it transparent, then you can use a dot prefix to inherit the above style, the code is as follows:

<!--Res/values/styles.xml--<resources><styleName="Buttonnormal"Parent="@android: Style/widget.material.button"><itemName= "Android:background" > @drawable/bg_btn_selector</item > <item name= "Android:textcolor" >@ Color/text_btn_selector</item> </style> <style name= "buttonnormal.transparent" > <item name= "Android:background" > @drawable/bg_btn_transparent< Span class= "NT" ></item> <item name= "Android:textcolor" > @color/text_btn_selector</item> </style>< Span class= "NT" ></RESOURCES>            

When referencing, just add a style to the corresponding Button , and the code is as follows:

<button    android:layout_width="wrap_content"    android:layout_height="Wrap_content"    android:onclick=android:text=style=/>       

Sometimes, the definition of too many styles, if it is placed in the styles.xml file, the file is too bloated. Therefore, you can split a style classification into multiple files. The Android system itself is split into multiple files, such as the following tables are all style files:

styles.xmlstyles_device_defaults.xmlstyles_holo.xmlstyles_leanback.xmlstyles_material.xmlstyles_micro.xmlthemes.xmlthemes_device_defaults.xmlthemes_holo.xmlthemes_leanback.xmlthemes_material.xmlthemes_micro.xml

Among them, there are two main categories, styles defines a simple style, and themes defines the theme.

Theme

The simple example above is only for a single View, which is the simplest use of the style. However, the usage of a style is not only used for a single View, but also for Activity or for the entire application, which is required in the corresponding <activity> tag or The android:theme* attribute is set in the <application> tag , which is also a style*, but is generally called a theme.

The Android system offers several sets of themes to view the Android Frameworks/base/core/res/res/values directory, and you will see the following files (so far):

• themes.xml: Low version of the theme, target API level is generally 10 or below
• themes_holo.xml: Topics added from API level 11
• themes_device_defaults.xml: Topics added from API level 14
• themes_material.xml: Topics added from API level 21
• themes_micro.xml: Should be the theme for Android Wear
• Themes_leanback.xml: It's not clear what to use.

However, in practical applications, because most of them are compatible, a set of topics provided by the Compatibility Pack is generally used:Theme.appcompat. The AppCompat theme automatically matches the corresponding theme based on different versions of the system, such as the Android 5.0 system, which inherits the material theme. However, this can also lead to a problem where different versions of the system use different themes and different experiences will occur. Therefore, in order to unify the user experience, it is best to customize the theme.

Custom themes are also simple, as long as you inherit a parent topic and then reference it in the <activity> tag or <application> .
A sample definition of a theme is as follows:

<resources><styleName="Apptheme"Parent="Theme.appcompat"><itemName="Windowactionbar">false</item><itemName="Windownotitle">true</item><itemName="Windowanimationstyle"> @style/windowanimation</item></style><!--standard animations for a full-screen window or activity. -<styleName="Windowanimation"Parent= "@android: style/animation.activity" > <item name= "activityopenenteranimation" > @anim/activity_open_ Enter</item> <item name= " Activityopenexitanimation "> @anim/activity_open_exit</item> <item name= "activitycloseenteranimation"  > @anim/activity_close_enter</item> <item name=< Span class= "s" > "activitycloseexitanimation" > @anim/activity_close_exit</ Item> </style></RESOURCES>       

Wherewindowanimation has re-specified the Activity 's transition animation, the following is the sample code for activity_close_exit :

<!--Res/anim/activity_close_exit.xml--<?xml version= "1.0" encoding= "Utf-8"?><setXmlns:android="Http://schemas.android.com/apk/res/android"Android:shareinterpolator="False"Android:zadjustment="Top"><alphaAndroid:fromalpha="0.0"Android:toalpha="1.0"Android:interpolator="@interpolator/decelerate_quart"android:fillenabled= "true" android:fillbefore=  "false" android:fillafter= "true" android: Duration= "
                            
                             /> 
                             <translate android: Fromydelta= "8%" android:toydelta= "0" android: Fillenabled= "true" android:fillbefore= "true"  Android:fillafter= "true" android:interpolator= "@interpolator/ Decelerate_quint "android:duration=" /> </SET>              
                            

This is a relatively simple view animation, view animation specific usage can refer to the View animation chapter.
Next, to use the application to the entire androidmanifest.xml , set the Android:theme property on the <application> tab of the The sample code is as follows:

<application    android:allowbackup="true"    android:icon="@mipmap/ic_launcher"    android:label=android:theme="@style/apptheme"<!--activity here--</ application>        

Written in the last

At this point, all the articles in this series are finished, welcome message discussion.

Development of Android style: Style article