Active Topics



Thread Tools
Markkyboy's Avatar
Posts: 310 | Thanked: 427 times | Joined on Oct 2012 @ Costa Blanca, España
Originally Posted by velox View Post
Try something like:

I have not tested it in any way, just quickly written it down, so I may have missed something or it may not be correct syntax (I may or may not have even added errors on purpose to help you learn – just kidding). More or less interesting points are:
  • there is a new property with an integer type, this should fix the negative comparisons
  • You had a gap (no colours between -1 and 4) between where you switched to "<=" – it's easier to just stick with ">=" and make an else for everything that does not match.

Keep in mind:
Long lists of if/else almost always are a sign that something could be better thought out.
Thank you velox, your code appears to work

I formatted your code exactly as you've posted and it appears to work. I think I may need to change some of the colours, like dark red and red are barely distinguishable.

I wholly agree with your comments about if/else being a sign that improvement is required. I am now looking into it......always learning along the way, mainly how NOT to do it!

Thanks, your input is appreciated.
| Openrepos | T.J.C. |

Don't just sit there standing around, pick up a shovel and sweep up!

The Following User Says Thank You to Markkyboy For This Useful Post:
pichlo's Avatar
Posts: 5,525 | Thanked: 17,164 times | Joined on Sep 2012 @ UK
Originally Posted by velox View Post
Try something like:
That's what I said,

Originally Posted by pichlo View Post
convert temperatureHighLabel.text to a number and work with that.

I would go a step further and use the HSL colour scheme. Equate the temperature range to the range 0-1, with guards to prevent a wraparound if temperature goes higher or lower.

Something like this, totally untested but hopefully should give you an idea:
Rectangle {
    id: colorTemperature
    width: 100; height: 140
    radius: 12
    property int tempMin: -20
    property int tempMax: 40
    property int temperatureInt: {
        return max(tempMin, min(tempMax, parseInt(temperatureHighLabel.text)));
    property real scale: 0.9
    anchors.centerIn: temperatureHighLabel
    color: Qt.hsla((scale * (tempMax - temperatureInt)) / (tempMax - tempMin),
                   1,  // full saturation, feel free to experiment
                   1,  // full lightness, feel free to experiment
                   1); // no transparency, feel free to experiment
What's the point of 'scale'? The colours go the full circle, i.e. 1 is the same colour as 0, i.e. red. Purple is somewhere around 0.8 or 0.9. So I am mapping the maximum temperature to 0 (red) and minimum to 'scale' instead of 1.
In particle accelerators atoms are indeed not only touching each others. But banging together in a massive explosive orgasm.
-- nieldk in a TMO post

Last edited by pichlo; 2018-09-04 at 16:10.

The Following 4 Users Say Thank You to pichlo For This Useful Post:
Posts: 37 | Thanked: 250 times | Joined on Jan 2017 @ Portugal
Hi Markkyboy, here is another aproach:

Rectangle {
        id: teste
        width: 15*mm
        height: 15*mm
        x: 50*mm
        y: 50*mm
        color: getTemperature()
        MouseArea {
            anchors.fill: parent
            onClicked: Math.random()

    ListModel {
          id: colorTemperature

    property real currentTemperature: 16
    property real minTemperature: -20
    property real maxTemperature: 40

    function getTemperature() {
        //normalized temperature [0-1]
        var normalized01Temperature = normalizeTemp(currentTemperature, minTemperature, maxTemperature)
        //normalize temperature to [0 - number of temperatures in listmodel]
        var colorT = normalized01Temperature * colorTemperature.count
        var index = Math.floor(colorT) // get the index of listmodel
        return colorTemperature.get(index).cTemp;

    function normalizeTemp(temp, minTemp, maxTemp) {
        return (temp-minTemp)/(maxTemp-minTemp);

    function setArrayOfTEmperatures() {
        colorTemperature.append({"cTemp": "red"})
        colorTemperature.append({"cTemp": "#f7c200"})
        colorTemperature.append({"cTemp": "blue"})
        colorTemperature.append({"cTemp": "yellow"})
Save as much colors as you want in a listmodel, normalize the temperature interval to match the index of the list model. Maybe more complex to grasp than the if else, but like he previous solution from Pichlo, you can easily change the min max interval without having to rewrite the if else, and it is much less error prone.

The Following 4 Users Say Thank You to john_god For This Useful Post:
velox's Avatar
Posts: 334 | Thanked: 1,134 times | Joined on Dec 2009
@pichlo: Yup, you identified the main problem spot on, I just had the time to write a quick fix. I've edited my previous reply.

@all: Nice thinking, guys. I really enjoy seeing people chime in with own ideas, even for a seemingly minor problem.

HSL is a great way to get changing color values almost automatically, on the other hand the model is a great way to implement previously defined values.

If john_gods approach isn't complicated enough, one could even add interpolation between the predefined values to it with some minor additional computations. For hex strings, one could easily use something like

edit: perhaps the interpolation one works a bit less cumbersome without a model, but "directly" from an array.
slumber: sensors enabled sleep timer for SFOS (translations/input/… appreciated if you've got some spare time)
talefish: directory based audiobook player for SFOS
nofono: ofono restart for SFOS
list of i486/noarch packages on openrepos (jolla tablet)

The Following 4 Users Say Thank You to velox For This Useful Post:

Thread Tools

Forum Jump

All times are GMT. The time now is 21:33.