Plasma/Active/Development/ActiveHIG/Scrolling: Difference between revisions

From KDE Community Wiki
(First version)
 
(Added code section)
 
Line 10: Line 10:


== Code ==
== Code ==
Use this to get a scrolling area that applies the principles above.
The component will automatically display a scroll indicator on Plasma Active and a scrollbar on Plasma Desktop.


<span style="color:red">Still has to be inserted</span>
<pre>
import org.kde.plasma.extracomponents 0.1 as PlasmaExtras
 
PlasmaExtras.ScrollArea {
 
    //The Flickable can be a ListView or GridView as well
    Flickable {
      //contents
    }
}
</pre>

Latest revision as of 14:58, 4 July 2012

Scrolling

Guidelines

Scrolling on touch UIs always has to apply these principles:

  • It has to be done by flicking
  • It has to be accelerated
  • It has to be "kinetic" (meaning that the scrolling does not immediately stop when the finger is lifted after flicking, but decelerates instead)
  • There are never scrollbars, only a scroll indicator

Code

Use this to get a scrolling area that applies the principles above. The component will automatically display a scroll indicator on Plasma Active and a scrollbar on Plasma Desktop.

import org.kde.plasma.extracomponents 0.1 as PlasmaExtras

PlasmaExtras.ScrollArea {

    //The Flickable can be a ListView or GridView as well
    Flickable {
       //contents
    }
}