Search code examples
blackberryblackberry-10

Label color based on label value


I have a container with the labels like this... But if the Label value is negative i need to Add Red color otherwise Green color. How can i do it in BB 10 cascades in Qml.

Container {
    leftPadding: 15.0
    rightPadding: 15.0
    layout: StackLayout {
        orientation: LayoutOrientation.LeftToRight
    }
    topPadding: 20.0

    Label {
        id: symbol
        text: ListItemData.Symbol_En

        // Text Style and size etc
        textStyle.base: SystemDefaults.TextStyles.SubtitleText
        textStyle.fontSizeValue: 30.0
        layoutProperties: StackLayoutProperties {
            spaceQuota: 4
        }
        verticalAlignment: VerticalAlignment.Center
        horizontalAlignment: HorizontalAlignment.Center

    }
    Label {
        id: change
        text: ListItemData.PerChange
        textStyle.base: SystemDefaults.TextStyles.SubtitleText
        textStyle.fontSizeValue: 30.0
        layoutProperties: StackLayoutProperties {
            spaceQuota: 2
        }
        verticalAlignment: VerticalAlignment.Center
        horizontalAlignment: HorizontalAlignment.Center

    }
    Label {
        id: ltp
        text: ListItemData.LTP
        textStyle.base: SystemDefaults.TextStyles.SubtitleText
        textStyle.fontSizeValue: 30.0
        layoutProperties: StackLayoutProperties {
            spaceQuota: 1
        }
        verticalAlignment: VerticalAlignment.Center
        horizontalAlignment: HorizontalAlignment.Center

    }
    Label {
        id: highValue
        text: ListItemData.High
        textStyle.base: SystemDefaults.TextStyles.SubtitleText
        textStyle.fontSizeValue: 30.0
        layoutProperties: StackLayoutProperties {
            spaceQuota: 1
        }
        verticalAlignment: VerticalAlignment.Center
        horizontalAlignment: HorizontalAlignment.Center

    }
    Label {
        id: lowValue
        text: ListItemData.Low
        textStyle.base: SystemDefaults.TextStyles.SubtitleText
        textStyle.fontSizeValue: 30.0
        layoutProperties: StackLayoutProperties {
            spaceQuota: 1
        }
        verticalAlignment: VerticalAlignment.Center
        horizontalAlignment: HorizontalAlignment.Center

    }

Solution

  • How about something like this (just the Label in question):

    Label {
            id: highValue
            text: ListItemData.High
            textStyle.color: ListItemData.High.indexOf("-") < 0 ? Color.Green : Color.Red 
            textStyle.base: SystemDefaults.TextStyles.SubtitleText
            textStyle.fontSizeValue: 30.0
            layoutProperties: StackLayoutProperties {
                spaceQuota: 1
            }
            verticalAlignment: VerticalAlignment.Center
            horizontalAlignment: HorizontalAlignment.Center
        }