授權轉載?|?Scratch格物堂?scratchGeWuTang

原文作者 |?小阿斌

原文標題 |?從數據類型到計算思維

標簽：難度初級；教程；顏色；色彩模式；

---

本文主要介紹Scratch使用的兩種色彩模式及關于顏色積木的正確使用方式。

---

01

顏色模式

顏色的實質是一種光波。它的存在是因為有三個實體：光線、被觀察的對象以及觀察者。人眼是把顏色當作由被觀察對象吸收或者反射不同波長的光波形成的。

顏色模式，是將某種顏色表現為數字形式的模型，或者說是一種記錄圖像顏色的方式。分為：RGB模式、CMYK模式、HSB模式、Lab顏色模式、位圖模式、灰度模式、索引顏色模式、雙色調模式和多通道模式。

在這里僅介紹Scratch中涉及的兩種色彩模式。

RGB顏色模式

雖然可見光的波長有一定的范圍，但我們在處理顏色時并不需要將每一種波長的顏色都單獨表示。因為自然界中所有的顏色都可以用紅、綠、藍(RGB)這三種顏色波長的不同強度組合而得，這就是人們常說的三基色原理。因此，這三種光常被人們稱為三基色或三原色。有時候我們亦稱這三種基色為添加色(Additive Colors)，這是因為當我們把不同光的波長加到一起的時候，得到的將會是更加明亮的顏色。把三種基色交互重疊，就產生了次混合色：青(Cyan)、洋紅(Magenta)、黃(Yellow)。這同時也引出了互補色(Complement Colors)的概念。基色和次混合色是彼此的互補色，即彼此之間最不一樣的顏色。例如青色由藍色和綠色構成，而紅色是缺少的一種顏色，因此青色和紅色構成了彼此的互補色。在數字視頻中，對RGB三基色各進行8位編碼就構成了大約1677萬種顏色，這就是我們常說的真彩色。順便提一句，電視機和計算機的監視器都是基于RGB顏色模式來創建其顏色的。

ARGB

ARGB是一種色彩模式，也就是RGB色彩模式附加上Alpha（透明度）通道，常見于32位位圖的存儲結構。

HSB顏色模式（HSV、HSL）

從心理學的角度來看，顏色有三個要素：色澤(Hue)、飽和度(Saturation)和亮度(Brightness)。HSB顏色模式便是基于人對顏色的心理感受的一種顏色模式。它是由RGB三基色轉換為Lab模式，再在Lab模式的基礎上考慮了人對顏色的心理感受這一因素而轉換成的。因此這種顏色模式比較符合人的視覺感受，讓人覺得更加直觀一些。它可由底與底對接的兩個圓錐體立體模型來表示，其中軸向表示亮度，自上而下由白變黑；徑向表示色飽和度，自內向外逐漸變高；而圓周方向，則表示色調的變化，形成色環。

AHSB

類似于ARGB，同樣是在HSB原色彩模式的基礎上加入透明度屬性。

---

02

HSB模式使用方法

Scratch2.0

在Scratch2.0中，對于HSB顏色模式的應用主要體現在以下兩對積木（【將畫筆顏色增加()】和【將畫筆亮度增加()】積木同理，略）

按照HSB模式將畫筆顏色設定為指定數值，范圍是【0-200】(閉區間)，組成一個完整的色相環，顏色200與顏色0相同（因此也可以說范圍是【0-199】）。常見的數值：?0 代表 紅、?70 代表 綠、?130 代表 藍、?170 代表品紅。

按照HSB模式將畫筆亮度設定為指定數值，范圍是【0-100】(閉區間)，50為初始值，也即純粹色。亮度為0時，顏色趨近于黑，亮度為100時，趨近于白。

總結

Scratch2.0中對于HSB模式的支持較弱，只能改變顏色和亮度，無法改變飽和度，只能說是閹割版的HSB模式——HB。但是【將畫筆顏色設定為()】積木的使用頻率還是非常高的，在使用RGB模式相對比較麻煩的情況下，用這種方法較為便捷。

Scratch3.0

在Scratch3.0中，大大加強了對于HSB模式的支持，體現在幾種顏色積木功能的增強和繪圖編輯器的UI優化。

可以根據HSB模式在Scratch2.0設置畫筆顏色和亮度的基礎上完善了飽和度設置，并在正式版中加入了Scratch3.0Beta版中沒有的透明度設置功能，這使得Scratch3.0支持AHSB模式！(要是3.0列表內容的更新有這么給力就好了)

另外需要注意的是，在Scratch3.0的這個積木中，顏色的設置范圍為【0-100】，不同于2.0的【0-200】，這也是一個常見的在3.0編輯器中打開原先2.0的項目，項目效果與原先不同甚至出BUG的原因。

????

3.0對于HSB模式的強力支持還體現在【將筆的顏色設為()】(取色器)積木上，在2.0中，這個積木的作用僅僅只能用來獲取編輯器中指定位置的顏色（或是另一種較麻煩的使用方法，下文將會提到），但是在3.0中，可以用這個積木很方便將畫筆顏色設置為我們期望的顏色，分別拖動滑桿設置顏色、飽和度和亮度數值即可，且變化是實時的，非常直觀。同時這個積木還保留了原來的取色功能，雖然UI有所優化（高亮舞臺），但因此取色范圍也局限在舞臺，而不是原先的整個編輯器界面。

另外繪圖編輯器中的填充顏色功能也采用了類似的優化

總結

無論是顏色積木的功能還是繪圖編輯器中的填充功能，總之Scratch3.0的HSB模式功能十分強大。

---

03

RGB模式的使用方法

公式

可以利用公式分別控制R，G和B的值來混合RGB顏色。代碼如下

其中使用的是【將筆的顏色設為()】(取色器)積木，如此才能正確使用RGB模式設置顏色。

R、G、B每個變量的范圍要設置為1-255（滑桿模式），且僅支持整數

事實上，Scratch也支持ARGB模式，即加入透明度alpha通道，代碼如下

來看一個利用此公式制作的案例

十六進制碼

在計算機中，RGB顏色通常以十六進制表示法編寫，Scratch也不例外。使用十六個不同的數字（0-9，然后是AF）。前兩位數字表示從0（00）到255（FF）的紅色數量。后兩位數字表示從0（00）到255（FF）的綠色量。第三個兩位數表示從0（00）到255（FF）的藍色量。例如，紅色為100％紅色，0％藍色和0％綠色。因此，十六進制值將＃FF?00?00（FF，00，00），其中FF是最大的2位十六進制數（因此顏色包含最多的紅色）。這也稱為24位RGB，因為這種表示法有24位，每個十六進制數字有4位。以下代碼可用于使用十六進制格式顏色：

需要在變量前通過【連接()和()】積木加上“0x”，告訴編輯器，這是一串十六進制數字。顏色對應的十六進制碼可以通過一些在線工具查詢獲得（無需輸入“#”），如：

http://tool.oschina.net/commons?type=3&tdsourcetag=s_pctim_aiomsg

通過這種方法，可以十分精確地將畫筆顏色設置為我們想要的顏色。

順帶提一句：

可以看出，【將筆的顏色設為()】(取色器)積木本身就是用十六進制來設置的。

總結

Scratch無論是2.0還是3.0，對于RGB模式的支持都比較隱晦，但是還是十分有用的

聲明：本文章由網友投稿作為教育分享用途，如有侵權原作者可通過郵件及時和我們聯系刪除