[shorts] If night mode is enabled, the app background is still white

[Victor Thompson]

I think this is due to the new palette in the SDK landing in rc-proposed. The app background is white, which defeats the purpose of night mode. Also, articles are impossible to read for this reason.

[Joey Chan (qqworini)]

I have only MX4 with OTA 9.1, can't reproduce this.

But last week Alan told me that this happened in his rc-proposed. I assume this bug will hit Shorts with incoming OTA 10.

[Stefano Verzegnassi (verzegnassi-stefano)]

MainView now sets the background of the main window, instead of using a QML Rectangle.
Since the BG is not a child item of MainView anymore, the "night mode" shader can't alter the color.

Refs.
- https://bugs.launchpad.net/ubuntu/+source/ubuntu-ui-toolkit/+bug/1439133
- https://code.launchpad.net/~tpeeters/ubuntu-ui-toolkit/fasterWindowColor

[Roman Shchekin (mrqtros)]

Hi, Stef, how should we fix it? And should we?

[Stefano Verzegnassi (verzegnassi-stefano)]

Hey Roman, I can think at three alternatives:

1) Set MainView.backgroundColor according to the nightMode status.

MainView {
    backgroundColor: nightModeEnabled ? "black" : "white"
}

I'm almost sure you'll also have to disable auto-theming (i.e. UITK switches the app theme between Ambiance and SuruDark according to the set background color).

2) Add a QML Rectangle to the MainView, in order to restore the previous code. Anyway, you'll lose the performance boost mentioned in the bug report above.

MainView {
    id: root

    Rectangle {
        anchors.fill: parent
        color: root.backgroundColor
    }
}

3) Don't use a shader on the whole view, but use individual shaders on each QML Image (if required). Set the app theme according to the current mode.

MainView {
    property bool nightModeEnabled: true

    theme.name: nightModeEnabled ? "Ubuntu.Components.Themes.SuruDark" : "Ubuntu.Components.Themes.Ambiance"

    ArticleItem {
        Image {
            [...]

            layer.enabled: nightModeEnabled
            layer.item: NightModeShader {}
        }
    }
}

I'd probably choose 2), which is faster to implement and safer (i.e. less unexpected issues - that's how it used to work until now).
This is something we should fix in DocViewer too, but I'd probably move to a different solution (the first one) in a longer term.

I guess the shader usage (currently it's used only in DocViewer and Shorts) hasn't been considered by the SDK team when they did that change. So yes, we should fix it.
However, it could be worth to ask them which solution they would suggest (and eventually suggest a similar feature for the next UITK release).

[Joey Chan (qqworini)]

Seems option 2 is simple & reasonable :)

[Gregory Opera (gregoryopera)]

These screen-shots were captured whilst I was adding newfeeds to Shorts (I had just removed all of my newsfeeds, with the intention of re-adding them)... As you can see in the various screen-shots, most of the text in the background is difficult or impossible to see whilst "night mode" is enabled.