• 1073阅读
  • 2回复

【开源】零基础接触Qt嵌入式开发 [复制链接]

上一主题 下一主题
离线itlevup
 

开始零基础Qt嵌入式开发系列免费课程之前,先使用qml制作一些动画效果,让大家对枯燥的语言编程产生一丝兴趣。


本期制作了一个简陋的logo动画效果(没有美工支持,先凑合看)。
鼠标点击事件触发动画的两种不同状态。



代码:

import QtQuick 2.2
Rectangle {
    id: root

    width: 400
    height: 200
    color: "lightblue"
    property bool status: false //是否碰撞的状态
    Rectangle {
       id: lBall
       radius: width / 2
       width: 50
       height: 50
       color: status ? "red" : "yellow"
       anchors.verticalCenter: parent.verticalCenter
       x: status ? root.width / 2 - lBall.width
                  : 0
       Text {
           anchors.centerIn: parent
           text: qsTr("I")
       }
       Behavior on x {
           NumberAnimation {
                duration: 500; easing.type: Easing.InOutBack
           }
       }
       Behavior on color {
           ColorAnimation {
                duration: 800
           }
       }
    }
    Rectangle {
       id: rBall
       radius: width / 2
       width: 50
       height: 50
       color: status ? "red" : "yellow"
       anchors.verticalCenter: parent.verticalCenter
       x: status ? root.width / 2
                  : root.width - rBall.width
       Text {
           anchors.centerIn: parent
           text: qsTr("T")
       }
       Behavior on x {
           NumberAnimation {
                duration: 500; easing.type: Easing.InOutBack
           }
       }
       Behavior on color {
           ColorAnimation {duration: 800}
       }
    }
    Text {
       id: logo
       anchors.horizontalCenter: parent.horizontalCenter
       anchors.top: lBall.bottom
       anchors.topMargin: 5
       font.pixelSize: 16
       font.bold: true
       color: "red"
       text: qsTr("职场进阶")
       visible: status
       Behavior on visible {
           NumberAnimation { duration: 800 }
       }
    }
    MouseArea {
       anchors.fill: parent
       onClicked: {
           status = !status
       }
    }
}

同样的动画效果,还有其他的实现方法,如果你对Qml感兴趣,那么动起手来,跟着大咖一起玩转Qml吧!


更多知识分享,免费课程等,请关注公众号。




离线rpaul518

只看该作者 1楼 发表于: 03-08
嵌入式也可以用qml吗?现在在了解阶段,想用qt做嵌入式
fasdfasdfasdfasdfa
离线itlevup

只看该作者 2楼 发表于: 03-08
相当可以
快速回复
限100 字节
 
上一个 下一个