码迷,mamicode.com
首页 > 系统相关 > 详细

如何在Ubuntu QML应用中实现一个垂直的Slider

时间:2015-04-28 14:14:56      阅读:187      评论:0      收藏:0      [点我收藏+]

标签:

我们在使用Ubuntu SDK中的Slider的时候,我们发现,它没有orientation的属性尽管在Qt官方网站的slider是有这个属性的。在默认的情况下,这个Slider是水平的。那么我们该如实现这个呢?


我们的任何一个QML Item都有一个属性叫做rotation。我们可以通过这个属性来得到一个旋转90度的水平Slider。这样我们就可以用如下的代码来实现了:


import QtQuick 2.0
import Ubuntu.Components 1.1

/*!
    \brief MainView with a Label and Button elements.
*/

MainView {
    // objectName for functional testing purposes (autopilot-qt5)
    objectName: "mainView"

    // Note! applicationName needs to match the "name" field of the click manifest
    applicationName: "slider.liu-xiao-guo"

    /*
     This property enables the application to change orientation
     when the device is rotated. The default is false.
    */
    //automaticOrientation: true

    // Removes the old toolbar and enables new features of the new header.
    useDeprecatedToolbar: false

    width: units.gu(50)
    height: units.gu(75)

    Page {
        title: i18n.tr("Slider")

        Slider {
            x:parent.width/2 - width/2
            y:parent.height/2 - height/2
            function formatValue(v) { return v.toFixed(2) }
            minimumValue: -3.14
            maximumValue: 3.14
//            rotation: 90
            value: 0.0
            live: true
        }

        Slider {
            x:parent.width/2 - width/2
            y:parent.height/2 - height/2
            function formatValue(v) { return v.toFixed(2) }
            minimumValue: -3.14
            maximumValue: 3.14
//            rotation: 90
//            orientation: Qt.Horizontal
            value: 0.0
            live: true
        }
    }
}

这里创建了连个Slider,一个是是水平的(默认情况下的),另外一个是垂直的(旋转90度的)。显示的结果如下:


技术分享


如何在Ubuntu QML应用中实现一个垂直的Slider

标签:

原文地址:http://blog.csdn.net/ubuntutouch/article/details/45333939

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!