ตัวควบคุมสำหรับผู้ใช้

ตัวควบคุมสำหรับผู้ใช้ในปลั๊กอินอยู่ในรูปของตัวแปรส่วนกลางที่ผู้ใช้ปลายทางสามารถแก้ไขได้ ตัวควบคุมทั้งหมดจะถูก export จากปลั๊กอินผ่าน ControllableParameters() ซึ่งส่งคืนอาร์เรย์ของอ็อบเจกต์การตั้งค่าดังที่แสดงด้านล่าง

export function ControllableParameters(){
    return [
        {"property":"LightingMode", "label":"Lighting Mode", "type":"combobox", "values":["Canvas","Forced"], "default":"Canvas"},
        {"property":"forcedColor", "label":"Forced Color","min":"0","max":"360","type":"color","default":"#009bde"},
        {"property":"SettingControl", "label":"Enable Setting Control","type":"boolean","default":"false"},
        {"property":"dpi1", "label":"DPI","step":"50", "type":"number","min":"200", "max":"18000","default":"800"}
    ];
}

อ็อบเจกต์การตั้งค่าเหล่านี้จะมีพารามิเตอร์พื้นฐานไม่กี่ตัวเสมอ ซึ่งใช้ได้กับตัวควบคุมสำหรับผู้ใช้ทุกตัวในปลั๊กอิน

พารามิเตอร์	ค่า	ชนิด
property	ชื่อของตัวแปรที่คุณต้องการกำหนดให้กับตัวควบคุม	String
label	ป้ายกำกับที่จะแสดงให้ผู้ใช้เห็น	String
type	ประเภทของตัวควบคุม ปัจจุบันตัวเลือกที่ใช้ได้มีดังนี้: boolean, number, hue, color, combobox, and textfield	String
default	ค่าเริ่มต้นของตัวควบคุม	แตกต่างกันไป

แถบเลื่อนตัวเลข

ตัวควบคุมแบบตัวเลขช่วยให้ผู้ใช้เลือกค่าตัวเลขได้โดยใช้แถบเลื่อน

{"property":"dpi1", "label":"DPI","step":"50", "type":"number","min":"200", "max":"18000","default":"800"},

ตัวควบคุมนี้รองรับแอตทริบิวต์ต่อไปนี้:

พารามิเตอร์	ค่า	ชนิด
property	ชื่อของตัวแปรที่คุณต้องการกำหนดให้กับตัวควบคุม	String
label	ป้ายกำกับที่จะแสดงให้ผู้ใช้เห็น	String
type	”number”	String
default	ค่าเริ่มต้นของตัวควบคุม	String, Int
min	ค่าต่ำสุดที่เลือกได้ของแถบเลื่อน แอตทริบิวต์นี้รองรับค่าติดลบ	String, Int
max	ค่าสูงสุดที่เลือกได้ของแถบเลื่อน	String, Int
step	ค่าขั้นที่แถบเลื่อนจะเพิ่มและลดในแต่ละครั้ง	String, Int

สวิตช์บูลีน

ตัวควบคุมแบบบูลีนช่วยให้ผู้ใช้เลือกค่าของตัวแปรบูลีนได้โดยใช้สวิตช์เปิด/ปิด

{"property":"AngleSnap", "label":"Angle Snapping", "type":"boolean", "default":"0"},

ตัวควบคุมนี้รองรับแอตทริบิวต์ต่อไปนี้:

พารามิเตอร์	ค่า	ชนิด
property	ชื่อของตัวแปรที่คุณต้องการกำหนดให้กับตัวควบคุม	String
label	ป้ายกำกับที่จะแสดงให้ผู้ใช้เห็น	String
type	”boolean”	String
default	ค่าเริ่มต้นของสวิตช์ ตั้งค่าเป็น 1 เพื่อให้สถานะเริ่มต้นเป็น “เปิด”	String, Int

แถบเลื่อนเฉดสี

ตัวควบคุมการเลือกเฉดสีช่วยให้ผู้ใช้เลือกองค์ประกอบเฉดสี (hue) ของสีได้ด้วยแถบเลื่อน

ตัวควบคุมนี้รองรับแอตทริบิวต์ต่อไปนี้:

พารามิเตอร์	ค่า	ชนิด
property	ชื่อของตัวแปรที่คุณต้องการกำหนดให้กับตัวควบคุม	String
label	ป้ายกำกับที่จะแสดงให้ผู้ใช้เห็น	String
type	”hue”	String, Int
default	ค่าเริ่มต้นของแถบเลื่อนเฉดสี	String
min	ค่าเฉดสีต่ำสุดที่เลือกได้ ค่านี้ต้องอยู่ระหว่าง 0 ถึง 359	String, Int
max	ค่าเฉดสีสูงสุดที่เลือกได้ ค่านี้ต้องอยู่ระหว่าง 1 ถึง 360	String, Int

ตัวเลือกสี

ตัวควบคุมสีช่วยให้ผู้ใช้เลือกสีได้โดยใช้วงล้อเฉดสี แถบเลื่อนความอิ่มตัว และแถบเลื่อนความสว่าง ไอคอนประแจจะเปิดจานสีขั้นสูงเพิ่มเติมสำหรับการเลือก

{"property":"forcedColor", "label":"Forced Color","min":"0","max":"360","type":"color","default":"#009bde"},

ตัวควบคุมนี้รองรับแอตทริบิวต์ต่อไปนี้:

พารามิเตอร์	ค่า	ชนิด
property	ชื่อของตัวแปรที่คุณต้องการกำหนดให้กับตัวควบคุม	String
label	ป้ายกำกับที่จะแสดงให้ผู้ใช้เห็น	String
type	”color”	String
default	ค่าเริ่มต้นของตัวเลือกสี ต้องระบุเป็นค่าฐานสิบหกในรูปแบบ #RRGGBB	String
min	ค่าเฉดสีต่ำสุดที่เลือกได้ ค่านี้ต้องอยู่ระหว่าง 0 ถึง 359	Int
max	ค่าเฉดสีสูงสุดที่เลือกได้ ค่านี้ต้องอยู่ระหว่าง 1 ถึง 360	Int

คอมโบบ็อกซ์

ตัวควบคุมคอมโบบ็อกซ์ช่วยให้ผู้ใช้เลือกจากเมนูดรอปดาวน์ของค่าที่กำหนดไว้ล่วงหน้า

{"property":"SleepModeTime", "label":"Sleep After x Minutes", "type":"combobox", "values":[5,10,15,30,60], "default":10},

ตัวควบคุมนี้รองรับแอตทริบิวต์ต่อไปนี้:

พารามิเตอร์	ค่า	ชนิด
property	ชื่อของตัวแปรที่คุณต้องการกำหนดให้กับตัวควบคุม	String
label	ป้ายกำกับที่จะแสดงให้ผู้ใช้เห็น	String
type	”combobox”	String
default	ค่าเริ่มต้นของคอมโบบ็อกซ์ ค่านี้ต้องอยู่ในอาร์เรย์ values	String, Int
values	อาร์เรย์ของค่าสำหรับเมนูดรอปดาวน์ ชนิดที่ใช้ได้คือสตริงและจำนวนเต็ม	[String, Int]

ช่องข้อความ

ตัวควบคุมช่องข้อความช่วยให้ผู้ใช้ป้อนข้อความได้อย่างอิสระ พร้อมตัวกรอง RegEx ซึ่งเป็นตัวเลือก

{"property":"textBox", "label":"Text Field", "type":"textfield", "default":"3"},

ตัวควบคุมนี้รองรับแอตทริบิวต์ต่อไปนี้:

พารามิเตอร์	ค่า	ชนิด
property	ชื่อของตัวแปรที่คุณต้องการกำหนดให้กับตัวควบคุม	String
label	ป้ายกำกับที่จะแสดงให้ผู้ใช้เห็น	String
type	”textfield”	String
default	ค่าเริ่มต้นของช่องข้อความ	String, Int
filter	ตัวกรอง RegEx (ไม่บังคับ) เพื่อจำกัดอินพุตของผู้ใช้	RegEx String

คอลแบ็ก on*Changed

ทุกครั้งที่ผู้ใช้เปลี่ยนตัวควบคุม SignalRGB จะเรียกฟังก์ชัน on[property]Changed() ที่สอดคล้องกันก่อนการเรียก Render() ครั้งถัดไป ชื่อฟังก์ชันต้องตรงกับชื่อ property จาก ControllableParameters() ทุกประการ โดยมีคำนำหน้า on และคำต่อท้าย Changed และคำนึงถึงตัวพิมพ์เล็กใหญ่

// ControllableParameters entry:
{"property":"dpi1", "label":"DPI", "step":"50", "type":"number", "min":"200", "max":"18000", "default":"800"},

// Corresponding callback:
export function ondpi1Changed() {
    setDpi(dpi1);
}

คอลแบ็กในตัว

คอลแบ็กเหล่านี้ใช้งานได้โดยไม่ต้องมีรายการ ControllableParameters ที่สอดคล้องกัน:

ฟังก์ชัน	คำอธิบาย
onBrightnessChanged()	ถูกเรียกเมื่อผู้ใช้เลื่อนแถบเลื่อนความสว่างหลักของอุปกรณ์