Home编程语言AndroidAndroid 颜色选择的实现

Android 颜色选择的实现

2012 年 3 月 19 日

<

div id=”content” contentScore=”2117″>在Api Demo里面有一个叫ColorPickerDialog的对话框，该对话框扩展了Dialog 的功能，使其具备颜色选择器的功能。具体可以参考Api Demo源代码，路径为：Android-sdk-windowssamplesandroid-7ApiDemossrccom exampleandroidapisgraphicsColorPickerDialog.java

本功能是基于上述的颜色选择器对话框进行扩展，模仿PreferceActivity 组件的实现方式，新建一个名为ColorPickerPreference 的类使其继承自DialogPreference 并实现其内部功能菜单，如图：

在Api Demo里面的颜色选择器是不具备有黑色和白色的选择的，这里我们虽然使用api Demo 里面的颜色选择器但其内部我们稍稍改造了一下。使其支持黑色和白色的选择，如上图中间的一条颜色条，头部和尾部分别代表黑色和白色。

为了显示的友好性，如果用户选择了颜色应该应该会有一个内容窗口或者一个文本对用户的选择做出相应的预览效果，。我们这里使用了一个TextView 做为颜色的预览效果，我们知道，Preference 的summary 只支持字符串的操作，类似下面的图：

如上图，只支持类型类型为CharSequence和字符所在的资源ID位置，那么我们这里如何使其支持颜色的显示和动态更换颜色呢？

这一切都在神奇的回调函数，onCreateView 里面这个方法先于 onBindView 执行，在里面初始化视图并且返回视图。具体处理见下面代码：

  1. @Override     
  2.     protected View onCreateView(ViewGroup parent) {     
  3.         // TODO Auto-generated method stub     
  4.       
  5.     View view=LayoutInflater.from(getContext()).inflate(     
  6.                 R.layout.preference, null);     
  7.       
  8.         TextView title = (TextView) view.findViewById(R.id.title);     
  9.         title.setText(getTitle());     
  10.       
  11.         summary = (TextView) view.findViewById(R.id.summary);     
  12.         summary.setText(getSummary());     
  13.         SharedPreferences prefs = getPreferenceManager().getSharedPreferences();     
  14.         mInitialColor = prefs.getInt(getKey(), Color.LTGRAY);     
  15.         summary.setTextColor(mInitialColor);      
  16.         return view;     
  17.     }    

上面代码，我们通过LayoutInflater 函数引入一个外部的布局文件，然后设置其title 和summary 并初始其颜色，通过SharedPreferences 类调用保存后的颜色值，布局文件如下：

  1. “1.0” encoding=“UTF-8”?>     
  2. “@+id/LinearLayout01”     
  3.     android:layout_width=“fill_parent” android:layout_height=“fill_parent”     
  4.     xmlns:android=“http://schemas.android.com/apk/res/android”>     
  5.       
  6.       
  7.     “fill_parent”     
  8.         android:gravity=“center” android:layout_height=“fill_parent”>     
  9.         “@+id/title” android:layout_width=“wrap_content”     
  10.             android:layout_marginLeft=“15dp” android:textAppearance=“?android:attr/textAppearanceLarge”     
  11.             android:layout_height=“wrap_content”>     
  12.         “@drawable/ic_dialog_menu_generic”     
  13.             android:layout_marginRight=“15dp” android:layout_alignParentRight=“true”     
  14.             android:layout_width=“wrap_content” android:layout_height=“wrap_content”>     
  15.         “@+id/summary” android:layout_below=“@id/title”     
  16.             android:layout_marginLeft=“15dp” android:layout_width=“wrap_content”     
  17.             android:layout_height=“wrap_content”>     
  18.       
  19.          
  20.     

实始化对话框的回调函数里面我们为其添加一个ColorPickerDialog 本身的颜色改变的事件监听并为其初始化颜色值，代码如下：

  1. @Override     
  2.     protected void onPrepareDialogBuilder(Builder builder) {     
  3.         super.onPrepareDialogBuilder(builder);     
  4.       
  5.         OnColorChangedListener l = new OnColorChangedListener() {     
  6.             public void colorChanged(int color) {     
  7.                 mCurrentColor = color;     
  8.                 onDialogClosed(true);     
  9.                 getDialog().dismiss();     
  10.             }     
  11.         };      
  12.       
  13.         LinearLayout layout = new LinearLayout(getContext());     
  14.         layout.setPadding(20, 20, 20, 20);     
  15.         layout.setOrientation(LinearLayout.VERTICAL);     
  16.         mCPView = new ColorPickerView(getContext(), l, mInitialColor);     
  17.       
  18.         LinearLayout.LayoutParams params1 = new LinearLayout.LayoutParams(     
  19.                 LinearLayout.LayoutParams.WRAP_CONTENT,     
  20.                 LinearLayout.LayoutParams.WRAP_CONTENT);     
  21.         params1.gravity = Gravity.CENTER;     
  22.         mCPView.setLayoutParams(params1);     
  23.         layout.addView(this.mCPView);     
  24.         layout.setId(android.R.id.widget_frame);     
  25.         builder.setView(layout);     
  26.     }    

当对话框关闭时，即选择完颜色后，我们就要马上回去更新文本的颜色和将颜色值保存到键值里面，代码如下：

  1. @Override     
  2.     protected void onDialogClosed(boolean positiveResult) {     
  3.         if (positiveResult) {     
  4.             mCurrentColor = mCPView.getColor();     
  5.             summary.setTextColor(mCurrentColor);     
  6.             SharedPreferences.Editor editor = getEditor();     
  7.             editor.putInt(getKey(), mCurrentColor);     
  8.             editor.commit();     
  9.             callChangeListener(new Integer(mCurrentColor));     
  10.         }     
  11.     }    

通过重写，onDialogClosed 回调函数，到这一步整个的封装就己结束，在XML可以通过如下使用

  2.             android:key=“colorpiker” android:persistent=“true” android:summary=“@string/app_name”     
  3.             android:di

Related Posts

About The Author

bjmayor

程序员，码农，php,python,ios,android,go，产品经理，创业。