Android中顏色選擇器和改變字體顏色的實例教程
更新時間:2016年04月28日 15:39:17 作者:by2n
這篇文章主要介紹了Android中顏色選擇器和改變字體顏色的實例教程,其中改變字體顏色用到了ColorPicker顏色選擇器,需要的朋友可以參考下
1.構(gòu)建一張七彩圖:
我們經(jīng)??吹竭@種樣子的顏色選擇器吧..
然后其實右邊的亮度選擇是:
這樣我們的代碼就可以進(jìn)行啦...
// 創(chuàng)建七彩圖片 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)調(diào)色板對話框
(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; //標(biāo)題 private int mInitialColor; //初始顏色 private OnColorChangedListener mListener; /** * 初始顏色黑色 * @param context * @param title 對話框標(biāo)題 * @param listener 回調(diào) */ public ColorPickerDialog(Context context, String title, OnColorChangedListener listener) { this(context, Color.BLACK, title, listener); }
/** * * @param context * @param initialColor 初始顏色 * @param title 標(biāo)題 * @param listener 回調(diào) */ 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; //漸變色環(huán)畫筆 private Paint mCenterPaint; //中間圓畫筆 private Paint mLinePaint; //分隔線畫筆 private Paint mRectPaint; //漸變方塊畫筆 private Shader rectShader; //漸變方塊漸變圖像 private float rectLeft; //漸變方塊左x坐標(biāo) private float rectTop; //漸變方塊右x坐標(biāo) private float rectRight; //漸變方塊上y坐標(biāo) private float rectBottom; //漸變方塊下y坐標(biāo) private final int[] mCircleColors; //漸變色環(huán)顏色 private final int[] mRectColors; //漸變方塊顏色 private int mHeight; //View高 private int mWidth; //View寬 private float r; //色環(huán)半徑(paint中部) private float centerRadius; //中心圓半徑 private boolean downInCircle = true; //按在漸變環(huán)上 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); //漸變色環(huán)參數(shù) 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; //中心圓參數(shù) mCenterPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mCenterPaint.setColor(mInitialColor); mCenterPaint.setStrokeWidth(5); centerRadius = (r - mPaint.getStrokeWidth() / 2 ) * 0.7f; //邊框參數(shù) mLinePaint = new Paint(Paint.ANTI_ALIAS_FLAG); mLinePaint.setColor(Color.parseColor("#72A1D1")); mLinePaint.setStrokeWidth(4); //黑白漸變參數(shù) 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); //是否顯示中心圓外的小圓環(huán) 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); }
//畫色環(huán) 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按在漸變色環(huán)內(nèi), 且move也在漸變色環(huán)內(nèi) 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, "色環(huán)內(nèi), 坐標(biāo): " + x + "," + y); }else if(downInRect && inRect) {//down在漸變方塊內(nèi), 且move也在漸變方塊內(nèi) mCenterPaint.setColor(interpRectColor(mRectColors, x)); } if(debug) Log.v(TAG, "[MOVE] 高亮: " + highlightCenter + "微亮: " + highlightCenterLittle + " 中心: " + inCenter); if((highlightCenter && inCenter) || (highlightCenterLittle && inCenter)) {//點(diǎn)擊中心圓, 當(dāng)前移動在中心圓 highlightCenter = true; highlightCenterLittle = false; } else if(highlightCenter || highlightCenterLittle) {//點(diǎn)擊在中心圓, 當(dāng)前移出中心圓 highlightCenter = false; highlightCenterLittle = true; } else { highlightCenter = false; highlightCenterLittle = false; } invalidate(); break; case MotionEvent.ACTION_UP: if(highlightCenter && inCenter) {//點(diǎn)擊在中心圓, 且當(dāng)前啟動在中心圓 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); }
/** * 坐標(biāo)是否在色環(huán)上 * @param x 坐標(biāo) * @param y 坐標(biāo) * @param outRadius 色環(huán)外半徑 * @param inRadius 色環(huán)內(nèi)半徑 * @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; } }
/** * 坐標(biāo)是否在中心圓上 * @param x 坐標(biāo) * @param y 坐標(biāo) * @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; } }
/** * 坐標(biāo)是否在漸變色中 * @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; } }
/** * 獲取圓環(huán)上顏色 * @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)); } }
/** * 回調(diào)接口 */ public interface OnColorChangedListener { /** * 回調(diào)函數(shù) * @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); } }
您可能感興趣的文章:
相關(guān)文章
Android 6.0動態(tài)權(quán)限申請教程
本文主要介紹了Android 6.0動態(tài)權(quán)限申請的教程,具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03詳解Android studio如何導(dǎo)入jar包方法
這篇內(nèi)容主要給大家詳細(xì)說明了如何導(dǎo)入jar包,以及Android studio遇到的各種問題和解決辦法。2017-12-12