Android中颜色选择器和改变字体颜色的实例教程

1.构建一张七彩图:

我们经常看到这种样子的颜色选择器吧..

然后其实右边的亮度选择是:

这样我们的代码就可以进行啦...
 

// 创建七彩图片
 private void init() {
 int[] oc = { 0xffff0000, 0xffffff00, 0xff00ff00, 0xff00ffff,
  0xff0000ff, 0xffff00ff, 0xffff0000 };
 float[] op = { 0, 0.16667f, 0.33333f, 0.5f, 0.66667f, 0.83333f, 1 };
 lineargradient lg = new lineargradient(0, 0, oriwidth, 0, oc, op,
  tilemode.mirror);
 lineargradient lg2 = new lineargradient(0, 0, 0, oriheight, 0x00808080,
  0xff808080, tilemode.mirror);
 oricolor = bitmap.createbitmap(oriwidth, oriheight, config.argb_8888);
 canvas c = new canvas(oricolor);
 paint.setshader(lg);
 c.drawrect(0, 0, oriwidth, oriheight, paint);
 paint.setshader(lg2);
 c.drawrect(0, 0, oriwidth, oriheight, paint);
 }

// 右边的亮度栏
 private void drawabar(canvas c) {
 int x, y;
 x = (roundcolor & 0x00ffffff);
 y = (x | 0xff000000);
 lineargradient lg = new lineargradient(0, 0, layoutwidth, 0, x, y,
  tilemode.mirror);
 // 初始化 x 240 + 6 * 2
 y = oriheight + (gap << 2) - gap + barheight; 
 paint.setcolor(0xffffffff); 
 c.drawbitmap(abk, 0, y, paint);
 paint.setshader(lg);
 c.drawrect(0, y, layoutwidth, y + barheight, paint);
 }

其他屏幕事件什么的就不贴代码啦...

2.colorpicker颜色选择器改变字体颜色实例：

（1）测试界面

（2）调色板对话框

（3）改变字体颜色 

嗯好，来看代码：

package com.xsl.colorpicker; 

import android.app.dialog; 
 
import android.content.context; 
 
import android.graphics.canvas; 
 
import android.graphics.color; 
 
import android.graphics.lineargradient; 
 
import android.graphics.paint; 
 
import android.graphics.rectf; 
 
import android.graphics.shader; 
 
import android.graphics.sweepgradient; 
 
import android.os.bundle; 
 
import android.util.log; 
 
import android.view.motionevent; 
 
import android.view.view; 
 
import android.view.windowmanager; 
 
  
 
public class colorpickerdialog extends dialog { 
 
  private final boolean debug = true; 
 
  private final string tag = "colorpicker"; 
 
    
 
  context context; 
 
  private string title;    //标题 
 
  private int minitialcolor; //初始颜色 
 
  private oncolorchangedlistener mlistener; 
 
  
 
  /** 
 
   * 初始颜色黑色 
 
   * @param context 
 
   * @param title 对话框标题 
 
   * @param listener 回调 
 
   */ 
 
  public colorpickerdialog(context context, string title,  
 
      oncolorchangedlistener listener) { 
 
    this(context, color.black, title, listener); 
 
  } 

  /** 
 
   * 
 
   * @param context 
 
   * @param initialcolor 初始颜色 
 
   * @param title 标题 
 
   * @param listener 回调 
 
   */ 
 
  public colorpickerdialog(context context, int initialcolor,  
 
      string title, oncolorchangedlistener listener) { 
 
    super(context); 
 
    this.context = context; 
 
    mlistener = listener; 
 
    minitialcolor = initialcolor; 
 
    this.title = title; 
 
  } 
 
  
 
  @override 
 
  protected void oncreate(bundle savedinstancestate) { 
 
    super.oncreate(savedinstancestate); 
 
    windowmanager manager = getwindow().getwindowmanager(); 
 
    int height = (int) (manager.getdefaultdisplay().getheight() * 0.38f);    //0.5 
 
    int width = (int) (manager.getdefaultdisplay().getwidth() * 0.5f);     //0.7 
 
    colorpickerview myview = new colorpickerview(context, height, width); 
 
    setcontentview(myview); 
 
    settitle(title); 
 
  } 

  private class colorpickerview extends view { 
 
    private paint mpaint;      //渐变色环画笔 
 
    private paint mcenterpaint;   //中间圆画笔 
 
    private paint mlinepaint;    //分隔线画笔 
 
    private paint mrectpaint;    //渐变方块画笔 
 
      
 
    private shader rectshader;   //渐变方块渐变图像 
 
    private float rectleft;     //渐变方块左x坐标 
 
    private float recttop;     //渐变方块右x坐标 
 
    private float rectright;    //渐变方块上y坐标 
 
    private float rectbottom;    //渐变方块下y坐标 
 
      
 
    private final int[] mcirclecolors;   //渐变色环颜色 
 
    private final int[] mrectcolors;    //渐变方块颜色 
 
      
 
    private int mheight;          //view高 
 
    private int mwidth;           //view宽 
 
    private float r;            //色环半径(paint中部) 
 
    private float centerradius;       //中心圆半径 
 
      
 
    private boolean downincircle = true;  //按在渐变环上 
 
    private boolean downinrect;       //按在渐变方块上 
 
    private boolean highlightcenter;    //高亮 
 
    private boolean highlightcenterlittle; //微亮 
 
      
 
    public colorpickerview(context context, int height, int width) { 
 
      super(context); 
 
      this.mheight = height - 36; 
 
      this.mwidth = width; 
 
      setminimumheight(height - 36); 
 
      setminimumwidth(width); 
 
        
 
      //渐变色环参数 
 
      mcirclecolors = new int[] {0xffff0000, 0xffff00ff, 0xff0000ff,  
 
          0xff00ffff, 0xff00ff00,0xffffff00, 0xffff0000}; 
 
      shader s = new sweepgradient(0, 0, mcirclecolors, null); 
 
      mpaint = new paint(paint.anti_alias_flag); 
 
      mpaint.setshader(s); 
 
      mpaint.setstyle(paint.style.stroke); 
 
      mpaint.setstrokewidth(50); 
 
      r = width / 2 * 0.7f - mpaint.getstrokewidth() * 0.5f; 
 
        
 
      //中心圆参数 
 
      mcenterpaint = new paint(paint.anti_alias_flag); 
 
      mcenterpaint.setcolor(minitialcolor); 
 
      mcenterpaint.setstrokewidth(5); 
 
      centerradius = (r - mpaint.getstrokewidth() / 2 ) * 0.7f; 
 
        
 
      //边框参数 
 
      mlinepaint = new paint(paint.anti_alias_flag); 
 
      mlinepaint.setcolor(color.parsecolor("#72a1d1")); 
 
      mlinepaint.setstrokewidth(4); 
 
        
 
      //黑白渐变参数 
 
      mrectcolors = new int[]{0xff000000, mcenterpaint.getcolor(), 0xffffffff}; 
 
      mrectpaint = new paint(paint.anti_alias_flag); 
 
      mrectpaint.setstrokewidth(5); 
 
      rectleft = -r - mpaint.getstrokewidth() * 0.5f; 
 
      recttop = r + mpaint.getstrokewidth() * 0.5f +  
 
          mlinepaint.getstrokemiter() * 0.5f + 15; 
 
      rectright = r + mpaint.getstrokewidth() * 0.5f; 
 
      rectbottom = recttop + 50; 
 
    } 

  
   

 
    @override 
 
    protected void ondraw(canvas canvas) { 
 
      //移动中心 
 
      canvas.translate(mwidth / 2, mheight / 2 - 50); 
 
      //画中心圆 
 
      canvas.drawcircle(0, 0, centerradius, mcenterpaint); 
 
        
 
      //是否显示中心圆外的小圆环 
 
      if (highlightcenter || highlightcenterlittle) { 
 
        int c = mcenterpaint.getcolor(); 
 
        mcenterpaint.setstyle(paint.style.stroke); 
 
        if(highlightcenter) { 
 
          mcenterpaint.setalpha(0xff); 
 
        }else if(highlightcenterlittle) { 
 
          mcenterpaint.setalpha(0x90); 
 
        } 
 
        canvas.drawcircle(0, 0,  
 
            centerradius + mcenterpaint.getstrokewidth(), mcenterpaint); 
 
          
 
        mcenterpaint.setstyle(paint.style.fill); 
 
        mcenterpaint.setcolor(c); 
 
      } 

  

      //画色环 
 
      canvas.drawoval(new rectf(-r, -r, r, r), mpaint); 
 
      //画黑白渐变块 
 
      if(downincircle) { 
 
        mrectcolors[1] = mcenterpaint.getcolor(); 
 
      } 
 
      rectshader = new lineargradient(rectleft, 0, rectright, 0, mrectcolors, null, shader.tilemode.mirror); 
 
      mrectpaint.setshader(rectshader); 
 
      canvas.drawrect(rectleft, recttop, rectright, rectbottom, mrectpaint); 
 
      float offset = mlinepaint.getstrokewidth() / 2; 
 
      canvas.drawline(rectleft - offset, recttop - offset * 2,  
 
          rectleft - offset, rectbottom + offset * 2, mlinepaint);//左 
 
      canvas.drawline(rectleft - offset * 2, recttop - offset,  
 
          rectright + offset * 2, recttop - offset, mlinepaint);//上 
 
      canvas.drawline(rectright + offset, recttop - offset * 2,  
 
          rectright + offset, rectbottom + offset * 2, mlinepaint);//右 
 
      canvas.drawline(rectleft - offset * 2, rectbottom + offset,  
 
          rectright + offset * 2, rectbottom + offset, mlinepaint);//下 
 
      super.ondraw(canvas); 
 
    } 
 
      
 
    @override 
 
    public boolean ontouchevent(motionevent event) { 
 
      float x = event.getx() - mwidth / 2; 
 
      float y = event.gety() - mheight / 2 + 50; 
 
      boolean incircle = incolorcircle(x, y,  
 
          r + mpaint.getstrokewidth() / 2, r - mpaint.getstrokewidth() / 2); 
 
      boolean incenter = incenter(x, y, centerradius); 
 
      boolean inrect = inrect(x, y); 
 
        
 
      switch (event.getaction()) { 
 
        case motionevent.action_down: 
 
          downincircle = incircle; 
 
          downinrect = inrect; 
 
          highlightcenter = incenter; 
 
        case motionevent.action_move: 
 
          if(downincircle && incircle) {//down按在渐变色环内, 且move也在渐变色环内 
 
            float angle = (float) math.atan2(y, x); 
 
            float unit = (float) (angle / (2 * math.pi)); 
 
            if (unit < 0) { 
 
              unit += 1; 
 
            } 
 
            mcenterpaint.setcolor(interpcirclecolor(mcirclecolors, unit)); 
 
            if(debug) log.v(tag, "色环内, 坐标: " + x + "," + y); 
 
          }else if(downinrect && inrect) {//down在渐变方块内, 且move也在渐变方块内 
 
            mcenterpaint.setcolor(interprectcolor(mrectcolors, x)); 
 
          } 
 
          if(debug) log.v(tag, "[move] 高亮: " + highlightcenter + "微亮: " + highlightcenterlittle + " 中心: " + incenter); 
 
          if((highlightcenter && incenter) || (highlightcenterlittle && incenter)) {//点击中心圆, 当前移动在中心圆 
 
            highlightcenter = true; 
 
            highlightcenterlittle = false; 
 
          } else if(highlightcenter || highlightcenterlittle) {//点击在中心圆, 当前移出中心圆 
 
            highlightcenter = false; 
 
            highlightcenterlittle = true; 
 
          } else { 
 
            highlightcenter = false; 
 
            highlightcenterlittle = false; 
 
          } 
 
          invalidate(); 
 
          break; 
 
        case motionevent.action_up: 
 
          if(highlightcenter && incenter) {//点击在中心圆, 且当前启动在中心圆 
 
            if(mlistener != null) { 
 
              mlistener.colorchanged(mcenterpaint.getcolor()); 
 
              colorpickerdialog.this.dismiss(); 
 
            } 
 
          } 
 
          if(downincircle) { 
 
            downincircle = false; 
 
          } 
 
          if(downinrect) { 
 
            downinrect = false; 
 
          } 
 
          if(highlightcenter) { 
 
            highlightcenter = false; 
 
          } 
 
          if(highlightcenterlittle) { 
 
            highlightcenterlittle = false; 
 
          } 
 
          invalidate(); 
 
          break; 
 
      } 
 
      return true; 
 
    } 
 
  
 
    @override 
 
    protected void onmeasure(int widthmeasurespec, int heightmeasurespec) { 
 
      super.onmeasure(mwidth, mheight); 
 
    } 

    /** 
 
     * 坐标是否在色环上 
 
     * @param x 坐标 
 
     * @param y 坐标 
 
     * @param outradius 色环外半径 
 
     * @param inradius 色环内半径 
 
     * @return 
 
     */ 
 
    private boolean incolorcircle(float x, float y, float outradius, float inradius) { 
 
      double outcircle = math.pi * outradius * outradius; 
 
      double incircle = math.pi * inradius * inradius; 
 
      double fingercircle = math.pi * (x * x + y * y); 
 
      if(fingercircle < outcircle && fingercircle > incircle) { 
 
        return true; 
 
      }else { 
 
        return false; 
 
      } 
 
    } 

    /** 
 
     * 坐标是否在中心圆上 
 
     * @param x 坐标 
 
     * @param y 坐标 
 
     * @param centerradius 圆半径 
 
     * @return 
 
     */ 
 
    private boolean incenter(float x, float y, float centerradius) { 
 
      double centercircle = math.pi * centerradius * centerradius; 
 
      double fingercircle = math.pi * (x * x + y * y); 
 
      if(fingercircle < centercircle) { 
 
        return true; 
 
      }else { 
 
        return false; 
 
      } 
 
    } 

    /** 
 
     * 坐标是否在渐变色中 
 
     * @param x 
 
     * @param y 
 
     * @return 
 
     */ 
 
    private boolean inrect(float x, float y) { 
 
      if( x <= rectright && x >=rectleft && y <= rectbottom && y >=recttop) { 
 
        return true; 
 
      } else { 
 
        return false; 
 
      } 
 
    } 

    /** 
 
     * 获取圆环上颜色 
 
     * @param colors 
 
     * @param unit 
 
     * @return 
 
     */ 
 
    private int interpcirclecolor(int colors[], float unit) { 
 
      if (unit <= 0) { 
 
        return colors[0]; 
 
      } 
 
      if (unit >= 1) { 
 
        return colors[colors.length - 1]; 
 
      } 
 
        
 
      float p = unit * (colors.length - 1); 
 
      int i = (int)p; 
 
      p -= i; 
 
  
 
      // now p is just the fractional part [0...1) and i is the index 
 
      int c0 = colors[i]; 
 
      int c1 = colors[i+1]; 
 
      int a = ave(color.alpha(c0), color.alpha(c1), p); 
 
      int r = ave(color.red(c0), color.red(c1), p); 
 
      int g = ave(color.green(c0), color.green(c1), p); 
 
      int b = ave(color.blue(c0), color.blue(c1), p); 
 
        
 
      return color.argb(a, r, g, b); 
 
    } 

    /** 
 
     * 获取渐变块上颜色 
 
     * @param colors 
 
     * @param x 
 
     * @return 
 
     */ 
 
    private int interprectcolor(int colors[], float x) { 
 
      int a, r, g, b, c0, c1; 
 
      float p; 
 
      if (x < 0) { 
 
        c0 = colors[0];  
 
        c1 = colors[1]; 
 
        p = (x + rectright) / rectright; 
 
      } else { 
 
        c0 = colors[1]; 
 
        c1 = colors[2]; 
 
        p = x / rectright; 
 
      } 
 
      a = ave(color.alpha(c0), color.alpha(c1), p); 
 
      r = ave(color.red(c0), color.red(c1), p); 
 
      g = ave(color.green(c0), color.green(c1), p); 
 
      b = ave(color.blue(c0), color.blue(c1), p); 
 
      return color.argb(a, r, g, b); 
 
    } 
 
      
 
    private int ave(int s, int d, float p) { 
 
      return s + math.round(p * (d - s)); 
 
    } 
 
  } 

  /** 
 
   * 回调接口 
   */ 
 
  public interface oncolorchangedlistener { 
 
    /** 
 
     * 回调函数 
 
     * @param color 选中的颜色 
 
     */ 
 
    void colorchanged(int color); 
 
  } 
 
    
 
  public string gettitle() { 
 
    return title; 
 
  } 
 
  
 
  public void settitle(string title) { 
 
    this.title = title; 
 
  } 
 
  
 
  public int getminitialcolor() { 
 
    return minitialcolor; 
 
  } 
 
  
 
  public void setminitialcolor(int minitialcolor) { 
 
    this.minitialcolor = minitialcolor; 
 
  } 
 
  
 
  public oncolorchangedlistener getmlistener() { 
 
    return mlistener; 
 
  } 
 
  
 
  public void setmlistener(oncolorchangedlistener mlistener) { 
 
    this.mlistener = mlistener; 
 
  } 
 
} 

 
测试界面
paintdemoactivity.java

package com.xsl.colorpicker; 
 
import android.app.activity; 
 
import android.content.context; 
 
import android.os.bundle; 
 
import android.view.view; 
 
import android.widget.button; 
 
import android.widget.textview; 
 
public class paintdemoactivity extends activity {   
  context context;   
 
  private button btncolorpicker;   
 
  private textview tvtext;   
 
     
 
  private colorpickerdialog dialog;   
 
  @override  
 
  public void oncreate(bundle savedinstancestate) { 
 
    context = this; 
 
    super.oncreate(savedinstancestate); 
 
    setcontentview(r.layout.main); 
 
    initviews(); 
 
  } 
 
    
 
  /**  
 
   * 初始化ui  
 
   */  
 
  private void initviews() {   
 
    btncolorpicker = (button) findviewbyid(r.id.button1);   
 
    btncolorpicker.setonclicklistener(new view.onclicklistener() {   
 
         
 
      public void onclick(view v) {   
 
        dialog = new colorpickerdialog(context, tvtext.gettextcolors().getdefaultcolor(),   
 
            getresources().getstring(r.string.app_name),   
 
            new colorpickerdialog.oncolorchangedlistener() {   
 
          public void colorchanged(int color) {   
 
            tvtext.settextcolor(color);   
 
          }   
 
        });   
 
        dialog.show(); 
 
      }   
 
    });   


    tvtext = (textview) findviewbyid(r.id.tv);   
 
  }   
 
}