İçeriğe geç

Bileşen Kullanma

Eklentinizde bileşen sistemini etkinleştirmek 2 aşamada gerçekleşir.

  1. Bileşen kullanıcı arayüzünü etkinleştirme
  2. Kullanıcının seçtiği bileşenlerden renk değerlerini alma

Bileşen kullanıcı arayüzünü etkinleştirmenin ilk adımı, SignalRGB için cihaz kanallarını tanımlamaktır. Burada örnek olarak Corsair Node Pro’yu kullanacağız. Kanallarımızın nasıl göründüğünü özetleyen bir dizi oluşturarak başlayın, ardından herhangi bir şey çizmeye başlamadan önce oluşturulmaları için bunları başlatma fonksiyonunda SignalRGB’nin arka ucuna gönderin.

const DeviceMaxLedLimit = 204;
// Kanal Adı, LED Sınırı
var ChannelArray = [
["Channel 1", 204],
["Channel 2", 204],
]
function SetupChannels(){
device.SetLedLimit(DeviceMaxLedLimit);
for(let i = 0; i < ChannelArray.length; i++){
device.addChannel(ChannelArray[i][0],ChannelArray[i][1]);
}
}

Yukarıdaki kodda kanallarımız için 2D dizi oluşturduğumuzu görüyorsunuz; her giriş kanalın adı ve ardından LED sınırıdır. SetupChannels() içinde toplam LED sınırını ayarlayacak, ardından dizimizin her girişi için device.addChannel’ı iteratif olarak çağıracağız.

İsterseniz bu döngü dizi olmadan doğrudan da çalıştırılabilir.

function SetupChannels(){
device.SetLedLimit(204);
device.addChannel("Channel 1",204);
device.addChannel("Channel 2",204);
}

Cihaz başlatmayı tamamlamak için Initialize içinde SetupChannels fonksiyonunu çağırın.

export function Initialize()
{
SetupChannels()
}

Dosya değişikliklerini kaydedin; kanallarınız cihaz sayfasında görünecektir. Ardından seçili bileşenlerden renk değerlerini almayı inceleyeceğiz.

Kanalları kurduktan sonra renklerini almamız gerekecek — kanal adlarını bir diziye kaydetmenin işe yaradığı yer burasıdır.

Genel fikir şudur:

Her kanal için -> Kanaldaki her Bileşen için -> getColors()

Bu işlevin tamamı sizin için device.channel().getColors() fonksiyonuna dahil edilmiştir. Corsair Node Pro renk verilerini tek seferde bir kanal gönderir, bu nedenle verileri kolaylaştırmak için ‘ayrı’ tutmak isteyeceğiz.

Burada bir ekstra parça fark edeceksiniz: Kanalın LedCount() değerini kontrol ediyoruz ve 0 döndürürse kullanıcı için kanalları nabız atıyoruz. Bu, kanalları ayarlamaları gerektiğini bilmeleri için güzel bir göstergedir.

Aşağıda normal bir kullanım durumu, sabit kodlanmış ve kanal nabız kontrolleri olmadan kod örnekleri bulunmaktadır.

function SendChannel(Channel)
{
let ChannelLedCount = device.channel(ChannelArray[Channel][0]).LedCount();
let ColorData = []
if(device.getLedCount() == 0){
ChannelLedCount = 80;
let pulseColor = device.getChannelPulseColor(ChannelArray[Channel][0], ChannelLedCount);
ColorData = device.createColorArray(pulseColor, ChannelLedCount, "Seperate");
}else{
ColorData = device.channel(ChannelArray[Channel][0]).getColors("Seperate");
}
let RedChannelData = ColorData[0]
let GreenChannelData = ColorData[1]
let BlueChannelData = ColorData[2]
//...
}
function SendChannel1()
{
let ChannelLedCount = device.channel("Channel 1").LedCount();
let ColorData = []
if(device.getLedCount() == 0){
ChannelLedCount = 80;
let pulseColor = device.getChannelPulseColor("Channel 1", ChannelLedCount);
ColorData = device.createColorArray(pulseColor, ChannelLedCount, "Seperate");
}else{
ColorData = device.channel("Channel 1").getColors("Seperate");
}
let RedChannelData = ColorData[0]
let GreenChannelData = ColorData[1]
let BlueChannelData = ColorData[2]
//...
}
SendChannel(Channel)
{
let ColorData = []
ColorData = device.channel(ChannelArray[Channel][0]).getColors("Seperate");
let RedChannelData = ColorData[0]
let GreenChannelData = ColorData[1]
let BlueChannelData = ColorData[2]
//...
}

Son olarak bu fonksiyonu render döngüsünde çağırmak isteyeceğiz. SendChannel fonksiyonunun alt kısmı, renk dizilerini paketlere dönüştürüp cihaza gönderme kodunu içerir. Bu cihaza özgü olacak ve kendiniz tersine mühendislik yapmanız gerekecek!

export function Render()
{
SendChannel(0);
device.pause(1);
SendChannel(1);
device.pause(1);
SubmitLightingColors();
}

Bazı cihazlar tuhaf davranır ve kalıbı bozar ya da belki eklentinizde yeni bir şey yapmaya çalışıyorsunuzdur ve bireysel bileşenlerle etkileşim kurmanız gerekir. Bu durumlarda device.channel().getColors() kullanamayız ve bunun yerine bireysel bileşenler arasında kendimiz döngü yapmamız gerekir.

Bunun için tüm bileşen kimliklerini almak üzere device.channel().getComponentNames() kullanacağız, ardından bireysel renk dizileri almak için device.channel().getComponentColors() kullanarak bunlar arasında yineleme yapacağız.

Aşağıdaki örnek yalnızca bireysel dizileri birbirine bağlar, ancak bunlarla arada istediğiniz her şeyi yapabilirsiniz.

let components = device.channel("Channel 1").getComponentNames();
for(let i = 0; i < components.length;i++){
let ComponentColors = device.channel("Channel 1").getComponentColors(components[i]);
RGBData = RGBData.concat(ComponentColors)
}

Eklentinizde gerçekten derinlemesine incelemeniz gerekiyorsa device.channel.getComponent() kullanabilirsiniz.