顏色選擇器

2021-09-10 19:27:52 字數 3901 閱讀 6656

基於seekbar控制項打造自定義顏色選擇器,可以選擇黑、白、赤、橙、黃、綠、青、藍、紫以及它們之間的顏色,廢話不多說,先上圖

通過設定seekbar的setprogressdrawable方法將顏色值與拖動條繫結,再監聽setonseekbarchangelistener實時獲取顏色值,部分**如下

xml中定義seekbar

<?xml version="1.0" encoding="utf-8"?>

xmlns:android

=""=""

xmlns:tools

=""android:layout_width

="match_parent"

android:layout_height

="match_parent"

android:orientation

="vertical"

tools:context

=".mainactivity"

>

android:id

="@+id/sb_color"

android:layout_width

="match_parent"

android:layout_height

="wrap_content"

android:layout_margin

="15dp"

android:max

="100"

android:maxheight

="3dp"

/>

android:id

="@+id/colorsizepreview"

android:layout_width

="@dimen/color_size_preview_width"

android:layout_height

="@dimen/color_size_preview_height"

/>

android:id

="@+id/tv"

android:layout_width

="wrap_content"

android:layout_height

="wrap_content"

android:text

="選擇的顏色"

android:textsize

="20sp"

/>

linearlayout

>

activity中
public

class

mainactivity

extends

private

void

initview()

@override

public

void

onstarttrackingtouch

(seekbar seekbar)

@override

public

void

onstoptrackingtouch

(seekbar seekbar)})

; shapedrawable.shade***ctory shade***ctory =

newshapedrawable.shade***ctory()

};paintdrawable paint =

newpaintdrawable()

; paint.

setshape

(new

rectshape()

);paint.

setcornerradius(10

);paint.

setshade***ctory

(shade***ctory)

; sb_colorpicker.

setprogressdrawable

(paint);}

}

工具類
public

class

colorpickergradientutil

;//每個顏色的位置

public

static

final

float

pickcolorbar_positions =

newfloat

;private

static

int[

] mcolorarr = pickcolorbar_colors;

private

static

float

mcolorposition = pickcolorbar_positions;

public

colorpickergradientutil

(int

colorarr)

public

colorpickergradientutil()

/** * 獲取某個百分比位置的顏色

* @param radio 取值[0,1]

* @return

*/public

static

intgetcolor

(float radio)

for(

int i =

0; i < mcolorposition.length; i++

) startcolor = mcolorarr[i -1]

; endcolor = mcolorarr[i]

;float arearadio =

getarearadio

(radio,mcolorposition[i-1]

,mcolorposition[i]);

return

getcolorfrom

(startcolor,endcolor,arearadio);}

}return-1

;}private

static

float

getarearadio

(float radio,

float startposition,

float endposition)

/** * 取兩個顏色間的漸變區間 中的某一點的顏色

* @param startcolor

* @param endcolor

* @param radio

* @return

*/private

static

intgetcolorfrom

(int startcolor,

int endcolor,

float radio)

/** * 將十進位制顏色值轉換成十六進製制。

*/public

static string gethexstring

(int value)

return hexstring;

}}

預覽view
public

class

colorsizepreview

extends

view

@override

protected

void

ondraw

(canvas canvas)

/** * 設定view的顏色

* @param color

*/public

void

setpaintcolor

(int color)

Ext顏色選擇器

size medium color red 這個控制項雖然進行了一次bug修復但是還是有問題,在ie下還是不穩定,偶爾會有問題。請謹慎使用!color size 這是老外擴充套件的乙個ext顏色選擇器,非常的好用 效果圖1 效果圖2 color red size medium bug size co...

ANDROID 顏色選擇器

這兩天花了點時間做了乙個android 的 顏色選擇器 看了幾篇文章.其中有乙個是 as3調色盤演算法 裡面有介紹了原理.我們經常看到這種樣子的顏色選擇器吧.我這裡就只是簡單說一下.1構建一張 七彩圖 然後其實右邊的亮度選擇是 這樣我們的 就可以進行啦.建立七彩 private void init ...

ExtJS ExtJS顏色選擇器

在extjs的mordern版本中,缺少顏色選擇器 這裡提供乙個自己封裝的 xtype colorfield 選取面板 繼承的是ext.component 通過xtemplete渲染的顏色面板 constructor config config.tpl config.data 000000 9933...