A vertical level indicator More...
The VerticalLevelIndicator type provides a vertical component that can be styled with a background image and an overlay image. The component is used to show a single data point value between a min and a max value.
Here is a simple VerticalLevelIndicator:
import QtQuick 1.1 import "components" VerticalLevelIndicator { id: level_indicator___vertical1 width: 28 height: 161 value: 0 minValue: 0 maxValue: 18 increment: 9 imageBase: "images/level.png" imageOverlay: "images/level_overlay.png" startPosition: "bottom" showHint: true hintFontFamily: "Arial" hintFontPixelSize: 14 hintFontColor: "#000000" onValueChanged: { console.debug(value); } }
The source for the components overlay image. This image will be transposed over the base image in increments.
The increment in pixels the overlay image is to cover the base image is determined by the value and the min and max values. In the above example, the base image is 190 pixels in width. The min value is 0 and the max value is 10. That will provide an increment of 19 pixels per unit of value.