Android UI Design System-android selector start custom style

Source: Internet
Author: User

Structure Description of selector:

<?xml version= "1.0" encoding= "Utf-8"?>

<selector xmlns:android= "Http://schemas.android.com/apk/res/android" >

<item

Android:color= "Hex_color"

Android:state_pressed= "True/false"

"True" indicates the use of a pressed state (for example, a button is pressed); "false" indicates a non-pressed state.

Android:state_focused= "True/false"

"True" indicates that the focus state is used (for example, using a rolling ball/d-pad focus button); "False" indicates the use of a non-focused state.

Android:state_selected= "True/false"

"True" indicates that the selected state is used (for example, tab-Open); "false" indicates a unchecked state.

Android:state_active= "True/false"

"True" indicates that the status can be checked and "false" means that it is not available for tick status. (Useful only for components that can toggle tick-not tick.) )

Android:state_checkable= "True/false"

"True" indicates that the check status is used; "false" indicates a non-tick status.

Android:state_checked= "True/false"

True "indicates that the check status is used;" false "indicates non-tick status.

Android:state_enabled= "True/false"

"True" indicates that the available state is used (can receive touch/click events); "False" indicates an unavailable state to use.

Android:state_window_focused= "True/false"

"True" indicates that the application window has focus when used (the application is in the foreground); "false" means use when there is no focus (for example, Notification Bar drop or dialog box display).

/>

</selector>

Structure Description of shape:

<shape>

<!--solid--

<solid android:color= "#ff9d77"/>

<!--gradients--

<gradient

Android:startcolor= "#ff8c00" <!-start Color--

Android:endcolor= "#FFFFFF" <!-End color--

Android:angle= "/>"

<!--strokes--

<stroke

Android:width= "2DP"

Android:color= "#dcdcdc"/>

<!--rounded corners--

<corners

android:radius= "2DP"/>

<padding

android:left= "10DP"

android:top= "10DP"

android:right= "10DP"

android:bottom= "10DP"/>

</shape>

The following is a description of the properties above

Solid: Filled is the meaning of filling

ANDROID:COLOR Specifies the color of the fill

Gradient: Gradient

Android:startcolor and Android:endcolor are start and end colors respectively, Ndroid:angle is the gradient angle and must be an integer multiple of 45.

In addition, the default mode of the gradient is android:type= "linear", that is, linear gradient, you can specify the gradient to radial gradient, android:type= "radial", radial gradient needs to specify the radius android:gradientradius= "50".

Stroke: Stroke

Android:width= the width of the "2DP" stroke, android:color the color of the stroke.

We can also make the stroke into a dashed form, set in the following way:

Android:dashwidth= "5DP"

android:dashgap= "3DP"

Where android:dashwidth represents the width of a horizontal line such as '-', android:dashgap represents the distance between them.

Corners: Rounded Corners

The Android:radius is the radian of the angle, and the larger the value the greater the rounded.

We can also set the four angles to different angles by:

<corners

android:toprightradius= "20DP" upper right corner

android:bottomleftradius= "20DP" lower right corner

android:topleftradius= "1DP" upper left corner

android:bottomrightradius= "0DP" lower left corner

/>

Here is a place to pay attention, Bottomleftradius is the lower right corner, not the lower left corner, this is a bit depressed, but do not affect the use, remember not to make a mistake on the line.

There are also online to see someone said set to 0DP invalid, but I found in the test is OK, I use 2.2, may fix the problem, if it is invalid, it can only be set to 1DP.

padding: Interval

This is not much to say, XML layout files are often used.

The specific code is as follows:

Main.xml:

<button

Android:layout_width= "Wrap_content"

android:layout_height= "Wrap_content"

android:text= "Testshapebutton"

android:background= "@drawable/button_selector"/>

Button_selector.xml:

<?xml version= "1.0" encoding= "Utf-8"?>

<selector

Xmlns:android= "Http://schemas.android.com/apk/res/android" >

<item android:state_pressed= "true" >

<shape>

<!--gradients--

<gradient

Android:startcolor= "#ff8c00"

Android:endcolor= "#FFFFFF"

Android:type= "Radial"

Android:gradientradius= "/>"

<!--strokes--

<stroke

Android:width= "2DP"

Android:color= "#dcdcdc"

Android:dashwidth= "5DP"

android:dashgap= "3DP"/>

<!--rounded corners--

<corners

android:radius= "2DP"/>

<padding

android:left= "10DP"

android:top= "10DP"

android:right= "10DP"

android:bottom= "10DP"/>

</shape>

</item>

<item android:state_focused= "true" >

<shape>

<gradient

Android:startcolor= "#ffc2b7"

Android:endcolor= "#ffc2b7"

Android:angle= "/>"

<stroke

Android:width= "2DP"

Android:color= "#dcdcdc"/>

<corners

android:radius= "2DP"/>

<padding

android:left= "10DP"

android:top= "10DP"

android:right= "10DP"

android:bottom= "10DP"/>

</shape>

</item>

<item>

<shape>

<solid android:color= "#ff9d77"/>

<stroke

Android:width= "2DP"

Android:color= "#fad3cf"/>

<corners

Android:toprightradius= "5DP"

Android:bottomleftradius= "5DP"

Android:topleftradius= "0DP"

android:bottomrightradius= "0DP"/>

<padding

android:left= "10DP"

android:top= "10DP"

android:right= "10DP"

android:bottom= "10DP"/>

</shape>

</item>

</selector>

Android UI Design System-android selector start custom style

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.