如何在QML中使用multitouch

原创 2015年07月08日 11:09:13

在Qt QML中,它可以利用multitouch来做一些我们想做的事情。在今天的文章中,我们将介绍如何使用multitouch来做一些我们想做的事。


其实,在QML中利用多点触控是非常容易的一件事。我们下面直接来展示我们的例程来给大家讲解一下:


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: "multitouchtest.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(60)
    height: units.gu(85)

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

        MultiPointTouchArea {
            anchors.fill: parent
            touchPoints: [
                TouchPoint { id: point1 },
                TouchPoint { id: point2 },
                TouchPoint { id: point3 },
                TouchPoint { id: point4 }
            ]
        }

        Image {
            width: parent.width/5
            height: parent.height/5
            source: "images/image1.jpg"
            x: point1.x
            y: point1.y
        }

        Image {
            width: parent.width/5
            height: parent.height/5
            source: "images/image2.jpg"
            x: point2.x
            y: point2.y
        }

        Image {
            width: parent.width/5
            height: parent.height/5
            source: "images/image3.jpg"
            x: point3.x
            y: point3.y
        }

        Image {
            width: parent.width/5
            height: parent.height/5
            source: "images/image4.jpg"
            x: point4.x
            y: point4.y
        }

    }
}


如上面的介绍的那样,我们定义了一个“MultiPointTouchArea”。我们在Image中,绑定它们的坐标和TouchPoint在一起。这样,TouchPoint的坐标变化时,Image可以随时移动。 在它的里面,我们同时定义了4个TouchPoint。当我们只有一个手指触屏时,我们可以看见只有image1.jpg可以随着我们的手指移动:


  


当我们同时两个手指触屏时,我们可以看到同时可以有两个图片image1.jpg及image2.jpg来同时移动我们的画面:



同时3个手指触屏时,我们可以看到3个照片同时出现在屏幕上,并随我们的手指移动:




整个项目的源码在:https://github.com/liu-xiao-guo/multitouchtest


版权声明:本文为博主原创文章,未经博主允许不得转载。

QML中的state 状态

QML中的状态其实很好理解,任何事物在某一事件都是有一个状态的。 比如你看到的一个窗口,这个时候里面的文字和图片正处于某个状态中。比如一个超链接,你点击了,发现颜色变了,你按了Ctrl+A,整个窗体...

QML图像、状态和动画--QML动画

QML中,可以在对象的属性值上应用动画对象来随着时间逐渐改变它们从而创建动画。动画对象可以从一组内建的动画元素进行创建,可以用来为多种类型的属性值产生动画。动画还可以通过不同的方式进行运用,这依赖于它...

qml中使用Canvas绘制饼状图

  • 2017年08月09日 21:16
  • 2KB
  • 下载

Android开发之多点触摸(Multitouch)

如果您对开发多点触摸程序感兴趣的话,那么本文将是一个很好的开始,android应用程序开发中,多点触摸不是那么遥不可及,实现起来也很简单,本例只需要两个类就能实现多点触摸。 首先来看看我们的视图类M...

QML我们如何与C++一起使用.wps

  • 2017年11月29日 04:29
  • 148KB
  • 下载

说说 MultiTouch 那点事

最近在做一个 小应用, 涉及到的跟以前接触的 不太一样。 这次是  onTouchEvent 和 OnGestureListener接口的 结合, 本身继承SurfaceView... 拿出来跟...
  • tao0001
  • tao0001
  • 2013年01月08日 13:50
  • 272

QML自我创建使用

  • 2016年06月21日 17:56
  • 65KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:如何在QML中使用multitouch
举报原因:
原因补充:

(最多只允许输入30个字)