实现了一个可以滚动的文字控件

RollTextStyle.qml

import QtQuick 2.4
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
import QtQuick.Controls 1.3
import QtQuick.Controls.Private 1.0
 
Style{
    id:rollTextStyle
    property RollText control: __control
 
    property Component rollText:Text {
        id:rt
        text: control.text
        property bool rollFlag :true
        property bool rollStart: false
        PropertyAnimation on x{
            id:leftRoll
            to:parent.x-rollfunc()
            duration: 2000
            easing.type: Easing.Linear
        }
        PropertyAnimation on x{
            id:rightRoll
            to:parent.x+rollfunc()
            duration: 2000
            easing.type: Easing.Linear
        }
        Timer{
            interval: 2000
            running: true
            repeat: true
            onTriggered: {
                if(control.running === true && rt.rollFlag === true)
                {
                    rt.rollFlag = false
                    rightRoll.start()
                }
                else if(control.running === true && rt.rollFlag === false)
                {
                    rt.rollFlag = true
                    leftRoll.start()
                }
            }
        }
        function rollfunc(){
            if(rt.rollStart === false)
            {
 
                rt.rollStart = true
                return 50
            }
            else
            {
                return 100
            }
        }
    }
 
    property Component panel: Item {
        implicitWidth: rollLoader.implicitWidth
        implicitHeight: rollLoader.implicitHeight
        Loader{
            id:rollLoader
            sourceComponent: rollText
            anchors.fill: parent
            width: 160
            height: 40
        }
    }
}
 
 


RollText.qml

import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Controls.Private 1.0
 
Control{
    id:rollText
    implicitWidth: 160
    implicitHeight: 40
    property string text:qsTr("test")
    property bool running: false
 
    style:Settings.styleComponent(Settings.style, "RollText.qml", rollText)
}
 



这个控件可以实现一个Text向左向右移动

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值