码迷,mamicode.com
首页 > 移动开发 > 详细

Android 扁平化按钮

时间:2014-10-05 04:04:37      阅读:265      评论:0      收藏:0      [点我收藏+]

标签:android ui   android扁平化按钮   

View

创建 colors.xml 文件定义两个颜色

1. <resources>

2.     <color name="blue_pressed">@android:color/holo_blue_dark</color>

3.     <color name="blue_normal">@android:color/holo_blue_light</color>

4. </resources>

我们这里使用android的 HOLO 色调:

1. <!-- A dark Holo shade of blue -->

2. <color name="holo_blue_dark">#ff0099cc</color>

3. <!-- A light Holo shade of blue -->

4. <color name="holo_blue_light">#ff33b5e5</color>

创建 dimen.xml 文件,定义圆角值和阴影高度,见下图

1. <resources>

2.     <dimen name="corner_radius">4dp</dimen>

3.     <dimen name="layer_padding">3dp<<dimen>

4. </resources>

 bubuko.com,布布扣

 

我们用shape来定义按钮背景 创建rect_pressed.xml 的 drawable 文件

1. <shape xmlns:android="http://schemas.android.com/apk/res/android"

2.     android:shape="rectangle">

3.   <corners android:radius="@dimen/corner_radius" />

4.   <solid android:color="@color/blue_pressed" />

5. </shape>

 

创建rect_normal.xml file 的drawable 文件。

1. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">

2.   <item android:drawable="@drawable/rect_pressed" />

3.  

4.   <item android:bottom="@dimen/layer_padding">

5.       <shape android:shape="rectangle">

6.           <corners android:radius="@dimen/corner_radius" />

7.           <solid android:color="@color/blue_normal" />

8.       </shape>

9.   </item>

10. </layer-list>

 

为按钮定义 selector . 创建flat_selector.xml 文件。

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

2.   <item android:state_pressed="true" android:drawable="@drawable/rect_pressed"/>

3.   <item android:drawable="@drawable/rect_normal"/>

4. </selector>

定义 button 设置 background 为 flat_selector.

1. <Button

2.       android:layout_width="fill_parent"

3.       android:layout_height="wrap_content"

4.       android:background="@drawable/flat_selector"

5.       android:textColor="@android:color/white"

6.       android:text="Say Hello" />

Android 扁平化按钮

标签:android ui   android扁平化按钮   

原文地址:http://blog.csdn.net/kan1kan5/article/details/39790823

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!