تنسيقات الألوان

يمكن تقديم قيم الألوان بتنسيق HSV أو RGB أو باستخدام اسم لون.

درجة اللون والتشبّع والقيمة

إنّ أبسط طريقة لتحديد لون معيّن هي استخدام رقم يتراوح بين 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) وتطبيقات التصميم (مثل Photoshop)، فإنّ ذلك يشكّل خطرًا على التصميم قد يؤدي إلى استخدام مكوّنات غير متناسقة إذا لم يتم اختيارها بعناية.

ننصحك بالعمل ضمن قيود مساحة اللون HSV ما لم تكن لديك موارد مخصّصة للتصميم المرئي. إذا كنت تحاول إعادة تعريف جميع الألوان بهذه الطريقة، ننصحك بالاطّلاع على موارد Material Design من Google حول الألوان.

أسماء الألوان

يمكنك أيضًا تحديد الألوان باستخدام أسماء الألوان التي حدّدتها مجموعة مشاريع 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 يتيح استخدام المراجع. ويسمح أيضًا بترجمة الألوان، إذا لزم الأمر.