2

How can I set the Background (picture or color) of The Page{} element in ubuntu touch?

Thank You,

Boaz

1 Answer 1

2

As far as I know, you can't directly set the color of a page, unless you created a rectangle to fill the background of the page. However, if you want to set the color of the MainView, you can do it as follows:

MainView {
    backgroundColor: "<COLOR_HERE>"
}

There are also two other properties, headerColor, and footerColor, that allow you to create a gradient from the top to the bottom.

This won't work perfectly, since it changes the font colors, and the while the font color looks good on the background, it looks bad in popups where the background is white. I'm sure this will get fixed soon!

To set a picture, you can do something like this:

MainView {
    Image {
        anchors.fill: parent
        source: "/path/to/picture"
    }
}

I'd recommend still setting the background color of the MainView so the font colors look good on top of the picture.

If you want to do change the background color/picture for a page, you can do it as follows (I haven't tried this, but it should work):

Page {
    Image {
        anchors.fill: parent
        source: "/path/to/picture"
    }
}

Page {
    Rectangle {
        anchors.fill: parent
        color: "<COLOR_HERE>"
    }
}

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .