Material Design风格常用控件的使用与定制

   <h2><strong>一、前言</strong></h2>    <p>你是否还在使用selector来定制Button普通状态、按下状态的变化呢？</p>    <p>你是否也想自己的Button有Material Design的阴影效果呢？</p>    <p>你是否也想让各种控件轻松变换各种颜色风格呢？</p>    <p>那么看完这篇分享，你就会有答案了。</p>    <h2><strong>二、4种风格的Button</strong></h2>    <p>系统默认有4种风格的Button效果，分别是</p>    <pre>  <code class="language-xml">Widget.AppCompat.Button    Widget.AppCompat.Button.Colored    Widget.AppCompat.Button.Borderless    Widget.AppCompat.Button.Borderless.Colored</code></pre>    <p>效果如下（1-4）：</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/62747cd78116048766375e36f274c10b.png"></p>    <p style="text-align:center">4种风格的Button</p>    <p>按命名、并结合效果图可以看出，这4种风格对应两个属性： 字体颜色 、 边框颜色 （或称背景颜色）;</p>    <p>4种风格可完整描述为 默认边框默认字体 、 彩色边框默认字体 、 无边框默认字体 、 无边框彩色字体 ，使用方法也很简单，只需在普通Button的xml布局文件中，加上style属性即可：</p>    <pre>  <code class="language-xml"><Button      ...      style="@style/Widget.AppCompat.Button" />    <Button      ...      style="@style/Widget.AppCompat.Button.Colored" />    <Button      ...      style="@style/Widget.AppCompat.Button.Borderless" />    <Button      ...      style="@style/Widget.AppCompat.Button.Borderless.Colored" /></code></pre>    <p>从上图也可以看到，不加style属性的话，默认是使用 Widget.AppCompat.Button 风格的。</p>    <p>后面两种无边框Button，只需要改变 textColor 属性来设置效果，没什么好说的；主要是前面两种，其实就是同一种效果：有边框颜色的Button，如何定制请看下一节内容。</p>    <h2><strong>三、各种颜色的Button</strong></h2>    <p>你是否还在用selector文件来定制各种颜色、各种不同状态下的Button呢？如果一个应用中需要10个不同的Button，你是否需要定义10*4个xml文件呢？(normal状态+pressed状态+disabled状态+selector选择器)</p>    <p>其实使用系统的Button控件就可以轻松实现，只需要配置一定的属性。</p>    <h2><strong>首先，确保主题使用Material风格</strong></h2>    <p>主题需要使用 Theme.AppCompat 或 Theme.Design 类的子主题（建议使用 Theme.AppCompat 子类主题，兼容Android 5.0以下版本），如 Theme.AppCompat.Light 。</p>    <h2><strong>其次，在style文件中设置Button颜色</strong></h2>    <p>在 styles.xml 文件中设置 colorButtonNormal 属性：</p>    <p>values/styles.xml</p>    <pre>  <code class="language-xml"><style name="RedButton">      <item name="colorButtonNormal">#F44336</item>  </style></code></pre>    <h2><strong>好了，一起来见证奇迹</strong></h2>    <p>在布局文件中定义Button，增加theme属性(注意，是 theme ，不是 style )：</p>    <pre>  <code class="language-xml"><Button      ...      android:theme="@style/RedButton" /></code></pre>    <p>效果如下：</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/884d73c5575c0b41548b7efbaaf600cc.png"></p>    <p style="text-align:center">各种颜色的Button</p>    <p>现在，就可以看到Button变成了你想要的颜色，而且点击后Button颜色也加深了，完全跟使用selector定制出来的一模一样。并且如果使用Android 5.0以上的手机，还会默认带有 水纹波 和 阴影 的炫酷效果。</p>    <h2><strong>四、其它各种常用控件</strong></h2>    <p style="text-align:center"><img src="https://simg.open-open.com/show/70e4394c6f200299d8bc8f12585371dd.png"></p>    <p style="text-align:center">CheckBox</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/d983069bd2e81eff353bc361b24b8b1d.png"></p>    <p style="text-align:center">RadioButton</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/5e2ed16c9f1df3413db207214995d4c6.png"></p>    <p style="text-align:center">Switch</p>    <p>其余控件像 CheckBox 、 RadioButton ，可以用 colorControlNormal 、 colorControlActivated （或 colorAccent ）来控制正常状态和按下状态的背景颜色；</p>    <p>而像 Switch 、 EditText 等控件，可以用 colorControlActivated （或 colorAccent ）来控制背景颜色。</p>    <h2><strong>五、总结</strong></h2>    <p>其实本篇主要只有两部分内容：</p>    <ul>     <li> <p>4种Button风格：</p> </li>    </ul>    <pre>  <code class="language-xml">Widget.AppCompat.Button  Widget.AppCompat.Button.Colored  Widget.AppCompat.Button.Borderless  Widget.AppCompat.Button.Borderless.Colored</code></pre>    <ul>     <li> <p>4个控件属性</p> </li>    </ul>    <pre>  <code class="language-xml">colorButtonNormal: Button正常状态颜色  colorControlNormal: 控件正常状态颜色  colorControlActivated: 选中或者点击获得焦点后的颜色  colorAccent: 选中或者点击获得焦点后的颜色</code></pre>    <p> </p>    <p> </p>    <p>来自：http://www.jianshu.com/p/70a485c168be</p>    <p> </p>