مقادیر رنگ را می توان در فرمت HSV یا RGB یا با استفاده از نام رنگ ارائه کرد.
Hue-Saturation-Value
ساده ترین راه برای تعریف یک رنگ، عددی بین 0-360 است که رنگ را در مدل رنگی-اشباع-مقدار (HSV) تعریف می کند.
استفاده از HSV با اشباع و مقدار ثابت برای همه رنگهای بلوک به شما امکان میدهد یک رنگ بلوک را انتخاب کنید و در عین حال اطمینان حاصل کنید که همه بلوکها یک پالت منسجم را به اشتراک میگذارند.
اشباع و مقادیر را می توان برای هر برنامه با فراخوانی توابع زیر تنظیم کرد:
Blockly.utils.colour.setHsvSaturation(0.45) // 0 (inclusive) to 1 (exclusive), defaulting to 0.45
Blockly.utils.colour.setHsvValue(0.65) // 0 (inclusive) to 1 (exclusive), defaulting to 0.65
چندین انتخاب کننده رنگ فضای رنگ HSV را ارائه می دهند، مانند انتخابگر HSV . ثابت های اشباع و مقدار Blockly را وارد کنید (پیش فرض ها به ترتیب 45٪ و 65٪ هستند)، سپس رنگ را به رنگ انتخابی بکشید. از این عدد رنگ به عنوان مقدار colour
استفاده کنید.
RGB
استفاده از فضای رنگی HSV به شدت توصیه میشود، اما Blockly از رنگهایی که بهعنوان رشتههای هگزا دسیمال #RRGGBB
مشخص شدهاند، پشتیبانی میکند. در حالی که این میتواند هماهنگی با سایر رنگهای برنامه (مانند استایلها در CSS) و برنامههای طراحی (مثلا فتوشاپ) را تسهیل کند، این یک خطر طراحی است که در صورت عدم انتخاب دقیق میتواند منجر به بلوکهای ناهماهنگ شود.
مگر اینکه منابع طراحی بصری اختصاصی داشته باشید، کار با محدودیت های فضای رنگی HSV توصیه می شود. اگر میخواهید همه رنگها را دوباره تعریف کنید، منابع Google Material Design را در مورد رنگ در نظر بگیرید.
نام رنگ ها
همچنین می توانید رنگ ها را با استفاده از نام رنگ های تعریف شده توسط W3C مشخص کنید.
مراجع رنگ
اغلب، چندین بلوک رنگ یکسانی دارند و متمرکز کردن تعاریف رنگ، مدیریت رنگها و افزودن بلوکهای جدید با رنگ صحیح را ساده میکند. رنگهای بلوک و دستههای جعبه ابزار میتوانند از نشانههای محلیسازی برای انجام این کار استفاده کنند.
Blockly شامل نه ثابت رنگ در جدول رشتهای است که مربوط به دستههای جعبه ابزار است، به علاوه یک رنگ متمایز برای متغیرهای پویا:
'%{BKY_LOGIC_HUE}'
'%{BKY_LOOPS_HUE}'
'%{BKY_MATH_HUE}'
'%{BKY_TEXTS_HUE}'
'%{BKY_LISTS_HUE}'
'%{BKY_COLOUR_HUE}'
'%{BKY_VARIABLES_HUE}'
'%{BKY_VARIABLES_DYNAMIC_HUE}'
'%{BKY_PROCEDURES_HUE}'
این مقادیر رشته را می توان هم در تعاریف JSON و هم block.setColour(..)
استفاده کرد.
شما می توانید ثابت های رنگ خود را با اضافه کردن به Blockly.Msg
اضافه کنید:
// Define the colour
Blockly.Msg['EVERYTHING_HUE'] = '42';
// Use in a block or block definition:
block.setColour('%{BKY_EVERYTHING_HUE}');
ممکن است ذخیره رنگ ها در جدول رشته محلی سازی غیرعادی به نظر برسد، اما با توجه به اینکه نماد JSON قبلاً از مراجع پشتیبانی می کند، راحت است. همچنین اجازه می دهد تا رنگ ها در صورت نیاز بومی سازی شوند .