Σελίδες

Saturday 30 March 2019

Latte and an Indicators tale

https://phabricator.kde.org/source/latte-dock/


Following Latte Colors tale,  today I am going to introduce you another major feature that Latte git version supported the last month, Online Indicators. From early development days of upcoming v0.9 it was obvious that some users did not like my Latte indicator and its behavior 😟 .


classic Latte indicator

On the other hand I like it so much that I dont want to change even one single of bit of it. I am not the person that believes that he knows what is the best for all and for that reason I believe a lot in choice and user options (with sanity of course).

The dream was pretty simple, the users should be able to install/create their own indicators and this should be pretty simple and straight forward.


“Lets have different Indicators installable online”


- youtube presentation -


What we had to improve before even trying to create dynamic indicators?

The Latte Indicator was not following the plasma design decisions around the concept and that could create visual issues with applets popups e.g. plasma popups were hiding the indicator underneath etc.


The plasma applets design currently works like this:
  1. Indicators are drawn from applets and they use all the applet available space
  2. Contents in plasma applets are always thickness-centered
  3. any applet paddings etc. are applet's responsibility to provide 

so instead of Latte Indicator and Latte in general to reinvent the wheel, it was made the decision to follow the plasma current decisions in a way to cooperate beautifully.


Step 1: Improve Latte Indicator

First thing to do was of course to update all Latte codebase and its Indicator to follow the previous design decisions. The popup issue was finally gone!😁 I was really excited for moving forward with this feature!
latte indicator aligned perfectly
with plasma popup


Step 2: Abstract Latte indicator and support Plasma style

After step 1 completed, next step was to abstract Latte indicator enough in order to support the Plasma style. That was really important because if that failed any dreams concerning dynamic indicators would not be possible.

Breeze Dark theme in Plasma style with all new
latte shorcut badge

Step 3: Provide margins that have meaning with the new design

Next step, improve margins and provide a generic solution for most indicators styles. The following were introduced:


Items
  • Length Margin: how far the items (tasks or applets) will be with each other
  • Thickness Margin: how far the items will be from the thickness related edges (top and bottom  in the horizontal layout example). Take note that at all cases the items will be always centered.

Indicators
  • Length Padding: indicators need to show visuals at the length axis that are not hidden by their belonging item above. This option can be used to increase the indicator length without increasing the item size.
items margins
indicator length padding


Step 4: A new indicator style to go forward

When I first show the Latte shortcut badges with plasma-styled tasks I was sure that we must reach the finish line. In order to do that, all internal indicators styles (Latte and Plasma) should be abstracted more at their own packages and Latte should play fine with this. A new external indicator style was needed in order to prove the new technology and move forward the features provided. The best candidate for this was the Unity indicator.

Unity indicator in Breeze Dark style


Step 5: Be more serious and provide this to everyone to create and enjoy

Having all indicators at their own packages opened the doors to go online. Lets install/test new indicators and give the kde developers an easy way to create! 😃

indicator styles from kde store

Developers Information

In the future I will probably need to create a wiki page in order for developers to find their way in. Nonetheless things are pretty simple already. The Latte/Indicator packages follow exactly the qml-only plasma plasmoids schema. Meaning that if you know how to create small qml plasma applets then you are already ready to go.


Hints:
  • There are no limitations, whatever qml provides (animations, fanciness etc.) your indicator can also provide
  • Just like plasma applets are providing a plasmoid object, in the same style Latte provides an indicator object for  tasks/applets/latte information, information provided...
  • Indicators can support at the same time a back layer and a front layer. The back layer in drawn below the icons and the front layer above the icons. This is known in indicators with level.isBackground and level.isForeground properties. You can see how this is handled from unity indicator...
  • Indicators can have their own configuration ui that is embedded in the Latte Effects page. e.g. unity config ui...
  • Indicators can have their own defined settings just like plasma applets e.g. unity config xml file... which can be accessed through indicator.configuration object
  • Indicator packages can be installed/updated/removed with kpackagetool5 just like all kde styled packages


Examples:


What is needed in my system?
  • Latte git version


Epilogue

That is all for now, I hope you enjoy these new feature, personally I love it and I am really look forward for your creations!


Donations

You can find Latte at Liberapay if you want to support,     Donate using Liberapay


or you can split your donation between my active projects in kde store.