顏色拾取器color picker (javascript version)

文章目錄

• 216種web safe color的構造方法
• 一些color picker連結：
• Ext JS中的顏色拾取器

顏色拾取器
216種web safe color的構造方法

var cl = ['00','33','66','99','CC','FF'];
    var clist = [];
    for(var r=0; r<cl.length; r++)
      for(var g=0; g<cl.length; g++)
        for(var b=0; b<cl.length; b++)
          clist[clist.length] = cl[r]+cl[g]+cl[b]; 

一些color picker連結：

1．ColorPicker v3.1 by Joe Barta, PageTutor.com
       http://www.pagetutor.com/colorpicker/index.html
       http://www.pagetutor.com/colorpicker/picker2/index.html ColorPicker v2
2. PhotoShop-like JavaScript Color Picker by John Dyer
       連結地址為：http://johndyer.name/post/2007/09/PhotoShop-like-JavaScript-Color-Picker.aspx
這裡有一個例子。 它非常強大，以致於超出了常規網上顏色拾取器的需求。
3. http://www.free-color-picker.com/提供了DHTML和彈出式視窗等216種網路顏色和不同灰階顏色的拾取組件。
可以到這裡下載。
4． Javascript Toolbox提供了兩種實現方法，基於快顯視窗的方法和基於DHTML layer的方法，具體參見：http://www.mattkruse.com/javascript/colorpicker/。
5．BlueShoes公司的ColorPicker組件似乎更酷，它有多個版本，包括類似於photoshop的組件，以及普通的216顏色拾取器，與眾不同的是它採取了多個tab頁面來表達，這裡是一個例子。
6．softComplexg公司的ColorPicker，可以提供web安全調色盤、windows系統和Mac系統調色盤以及灰階調色盤，例子參加Demo。它目前免費。6．BigResource網站有一個網頁，專門列舉了JavaScript版本的Color Picker的多個連結。
Ext JS中的顏色拾取器

對於Ext使用者，可以考慮Collin Miller的port版本，http://code.google.com/p/ext-ux-color/ 。
另外，Ext JS中的顏色拾取器擴充還有：

• rpetrello  的<canvas>實現，見 http://ryanpetrello.com/ext-ux/ColorField/ 。經測試在firefox中顯示顏色選擇圓環，而在IE7上則顯示ext內建的顏色面板Ext.ColorPalette。

• bendy  在ExtJs論壇給出了一個擴充。

• Ext User amon  在ExtJs論壇也給出瞭解決方案，具體見

2.0a: http://ux.theba.hu/colorpicker2/ for Ext2 ，經測試與Ext2.0 alpha相容，而與Ext2.0.2相容性有問題。
1.1.1: http://ux.theba.hu/colorpicker/ for Ext 1.1
        上述Ext JS實現只提供了40種顏色的選取，如果希望選取216個web顏色，可以通過更改Ext.ColorPalette類的colors屬性，它是一個顏色數組，元素為16進位的顏色字串（沒有#）。

 

其他：

http://www.softcomplex.com/products/tigra_color_picker/demo1.html
http://www.softcomplex.com/products/tigra_color_picker/
http://www.codeproject.com/KB/miscctrl/CPicker.aspx

 

Flash版本的顏色拾取器

Color picker component

http://www.sephiroth.it/file_detail.php?id=145

Color picker 2 component for Flash

http://www.sephiroth.it/file_detail.php?id=147

Flex2: Advanced ColorPicker

http://www.sephiroth.it/file_detail.php?id=150