Как изменить цвет текста метки в контроллере сегмента?

Question

Я хочу установить разные цвета текста метки в каждой строке SegmentControl программно .

Пожалуйста, проверьте мой исх.код.

var arrColors = [
    {"color":"white"},
    {"color":"orange"},
    {"color":"blue"},
    {"color":"yellow"},
    {"color":"gray"}
]; 
this.view.segCont.widgetDataMap = {lblColorName: "color"};
this.view.segCont.setData(arrColors);    

Я хочу сделать что-то вроде прикрепленного изображения.

Заранее спасибо !!

Answer 1

Я получил решение от kony команды.

1) Создайте другой skin для другого цвета label. См. Изображение ниже:

2) Установите условие согласно вашему требуемому цвету label.

var arrColors = [
    {"color": "white"},
    {"color": "orange"},
    {"color": "blue"},
    {"color": "yellow"},
    {"color": "gray"}
];

for (i = 0; i < arrColors.length; i++) {
    if (arrColors[i].color === "orange") {
        arrColors[i].color = {
            "skin": "sknLblOrange"
        };
    } else {
        arrColors[i].color = {
            "skin": "sknLblGreen"
        };
    }
}

this.view.segCont.widgetDataMap = {
    lblColor: "color"
};
this.view.segCont.setData(arrColors);

Надеюсь, это поможет вам.Happy Coding:)

Answer 2

Это хорошо, если ваши данные конечны и статичны, или если массив данных всегда имеет одинаковую длину, как в меню.

Однако, если ваши данные являются динамическими, вам следует рассмотреть это решение:

var arrColors = [
    {"skin": "whiteRowSkin"},
    {"skin": "orangeRowSkin"},
    {"skin": "blueRowSkin"},
    {"skin": "yellowRowSkin"},
    {"skin": "grayRowSkin"}
];

this.view.segCont.widgetDataMap = {
    lblColor: "color"
    // plus any other properties you need for this data.
};

// Lets assume this getData function fetches your dynamic data from a service.
var segData = getData();

for (var i = 0; i < segData.length; i++) {
    var colorIndex = i % arrColors.length;
    segData[i].color = arrColors[colorIndex];
};

this.view.segCont.setData(segData);

Ключом выше является оператор Модуль / Остаток %, который позволяет динамически определять, какой из цветов / обложек в массиве обложек соответствует каждой строке данных, даже если размер массив данных варьируется.

Примечание: Это устраняет тот факт, что данные могут быть матричными, если вы используете сегменты сегментов.