QML 自定义Slider

QML 自定义Slider

此博客始创于：http://blog.csdn.net/lys211

转载请注明出处

写这个时参考了众多代码，现在把qml 里slider的样式修改的代码贴到这里备份。

效果图：

代码贴这里一份：

import QtQuick 2.4

import QtQuick.Controls 1.3

import QtQuick.Controls.Styles 1.2

import QtGraphicalEffects 1.0

import QtQml 2.2

Rectangle {
 

    width: 500

    height: 500//color: "#25b1e8"

    Slider {
 

        id: sliderHorizontal1

        x: 21

        y: 33

        width: 458

        height: 22

        value:0.1

        tickmarksEnabled: true

    }

    Slider {
 

        id: sliderHorizontal2

        x: 21

        y: 87

        width: 458

        height: 22

        value:0.3

        tickmarksEnabled: true

        //stepSize: 0.1;

        style:SliderStyle{
 

            groove:Rectangle{
 

                implicitHeight: 8;

                implicitWidth: sliderHorizontal2.width;

                color: "#25b1e8";

                radius: 8;

            }

            handle: Rectangle{
 

                anchors.centerIn: parent;

                color: control.pressed ? "green":"#25b1e8";

                radius: 6;

                width: 24;

                height: 24;

            }

        }

    }

    Slider {
 

        id: sliderHorizontal3

        x: 21

        y: 144