在上一篇Android设置界面5分钟搞定--Preferences的使用里讲到了如何运用PreferenceActivity快速的新建出偏好设置页面。如果是内部应用，这样丢过去是完全没有问题的，但我们日常用是达不到产品要求的。本篇我们就来看一下如何更改Preference的样式。
如何更改Preferences的样式
在android ui的开发中，要更改一个控件的样式，我们往往从这几个方面来做
- 通过控件属性，如
background,textSize等 - 通过指定控件的样式
style - 设置主题
theme
本来so easy的事情，但我惊奇的发现居然无法设置之前那些常用控件属性及样式来搞，只有主题控件能搞定。我们常用的三板斧只有Theme一招有效了。
通过度娘大多讲的都是通过自定义来实现的，自定义除了每种子控件都要重写，感觉与自己写个布局差别不大了。
通过Theme来设置样式
- 在styles.xml里定义样式
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<style name="CustomWindowTitleText" >
<item name="android:textSize">20dip</item>
<item name="android:textColor">#FFffffff</item>
<item name="android:paddingLeft">10dp</item>
</style>
<style name="customCheckBox" parent="@android:style/Widget.CompoundButton.CheckBox">
<item name="android:button">@drawable/selector_checkbox</item>
</style>
<style name="Default.NoTitleBar" parent="@android:style/Theme.Light.NoTitleBar">
<item name="android:textColorPrimaryInverse">@android:color/black</item>
<!--<item name="android:windowBackground">@color/window_bg</item>-->
<item name="android:windowContentOverlay">@null</item>
<item name="android:windowTitleSize">42.0dip</item>
<item name="android:windowTitleStyle">@style/CustomWindowTitleText</item>
<item name="android:checkboxStyle">@style/customCheckBox</item>
</style>
<style name="CustomWindowTitleBackground">
<item name="android:background">#222222</item>
</style>
<!--这里是指定给PreferenceActivity的样式-->
<style name="setStyle" parent="@style/Default.NoTitleBar">
<item name="android:windowBackground">@drawable/wbg</item> <!-- 窗体背景 -->
<item name="android:windowTitleBackgroundStyle">@style/CustomWindowTitleBackground</item> <!-- 窗体标题背景风格-->
<item name="android:windowTitleSize">36dp</item> <!--窗体标题栏高度-->
<!-- item name="android:listViewStyle" preference是一个LISTVIEW，这里设置该风格-->
<item name="android:textColorPrimary">#ff0000</item> <!-- preference一级文本颜色-->
<item name="android:textColorSecondary">#00ff00</item> <!--preference二级文本颜色-->
</style>
</resources>
其中用到的setStyle是继承了Default.NoTitleBar,主要是为了在其它地方也可以使用，当然你也可以把属性都在写一起。
- 在AndroidManifest.xml里指定样式android:theme
<activity android:name=".MainActivity"
android:theme="@style/setStyle">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
看下效果 （请原谅我的配色）
默认的效果
设置主题后的效果
各位，是不是很容易呢。
那下面放大招了
除了上面这种方式，其实我们可以通过指定布局来达到这个效果
通过布局实现样式的更改
通过设置android:layout ,android:widgetLayout
这2个属性通过布局文件来定义视图。
下面看一个CheckBoxReference的实现
- 新建两个布局文件
preference_item.xml ,自由指定样式及布局吧，但请保持id与系统保持一致（CheckBoxReference对应的路径为frameworks/base/core/res/res/layout/preference_widget_checkbox.xml ，其它的自己找相应的就可以了）。
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/selector_item"
android:gravity="center_vertical"
android:minHeight="?android:listPreferredItemHeight"
android:orientation="horizontal" >
<ImageView
android:id="@android:id/icon"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="3dp"
android:scaleType="fitStart"
android:src="@drawable/appstore" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp" >
<TextView
android:id="@android:id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:ellipsize="marquee"
android:fadingEdge="horizontal"
android:singleLine="true"
android:text="title"
android:textColor="#4d4d4d"
android:textSize="18.0sp" />
<TextView
android:id="@android:id/summary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="15dp"
android:layout_toRightOf="@android:id/title"
android:layout_toLeftOf="@android:id/widget_frame"
android:maxLines="2"
android:text="summary"
android:textColor="#AAAAAA"
android:textSize="14sp" />
<LinearLayout
android:id="@android:id/widget_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="4dp"
android:layout_centerVertical="true"
android:gravity="center_vertical"
android:orientation="vertical" >
</LinearLayout>
</RelativeLayout>
</LinearLayout>
checkbox_preference_widget.xml 用于设置checkbox
<?xml version="1.0" encoding="UTF-8"?>
<!-- 这里放上系统的id -->
<CheckBox xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:button="@drawable/selector_checkbox"
android:clickable="false"
android:focusable="false"/>
- 给CheckBoxReference指定这两个属性，layout是布局文件（通用的），widgetLayout就是用于指定CheckBox的
<CheckBoxPreference
android:layout="@layout/preference_item"
android:icon="@mipmap/ic_launcher"
android:key="parent_checkbox_preference"
android:summary="选定后子控件可操作"
android:title="父选择控件"android:widgetLayout="@layout/checkbox_preference_widget" />
就这两步，样式妥妥的了。
网上常用的自定义这里就不讲了，需要的可以谷哥。
本篇示例源码请移步github
网友评论