Skip to content

Change the looks

Marian Arlt edited this page Oct 31, 2018 · 14 revisions

Customizing the design

The background

One of the most common customizations in any theme is probably the background image. Sugar supports any file format supported by Qt5. This includes but is not limited to JPEG, PNG, GIF, BMP and TIFF. Transparency is fully supported.
When choosing your background make sure to optimize it if your system is on the lower end.

Considerations
  • To achieve a pleasant visual effect in your login screen always prefer detailed close-ups over far distanced shots and cut off on purpose. This will make your brain think there's more to the image than in fact it has to offer and let your device or screen appear bigger than it actually is.

  • Usually your screen will be wider than it is high. Sugar hands one third of the screens width to the interface and two thirds to the background. This results in the background being roughly a square on most wide screens.
    Why is this of interest you say?
    By default Sugar has ScaleImageCropped= set to true. This will make your picture fill proportionally into the mentioned two thirds of your screens width and crop everything off that results out of bounds. So in most cases using a landscape oriented image the excess will get cut off equally on its sides and a portrait oriented image will get cut off equally on its top and bottom.
    As a result a good rule of thumb is to have your area of interest be roughly a square in the center of the image.

  • On the contrary if you change ScaleImageCropped= to false the picture will make sure to fit itself into your screen even if this means that there may be white space left over. Using a landscape oriented image this will mean whitespace on top and bottom and vice versa if using a portrait oriented image it will result in extra whitespace on the sides. This will visually throw off the design of the theme with most image material with one exception:

Exploiting illustrations

If you had a real nice illustration that is in itself a closed form (like any of these)

Clone this wiki locally