How to use QShake to detect and manage phone shaking

Comments

Hamishwillee - Can we add platform tags?

The source code appears to use no native APIs - so this should have the MeeGo and Symbian categories added too - correct?

I like the concept - a shake is another type of input mechanism. I wonder if its worth differentiating left-right or up-down type shakes?

hamishwillee 05:08, 23 March 2012 (EET)

Galazzo - Features added

Hi Hamish

I added Meego and Symbian categories, simply I had no possibility to test on Nokia N950 Meego device until today.

You had a very good idea, so i implemented also possibility to detect shaking based on direction not only left/right, but also push/pull. Now I think there are all properties to allow users to work with shaking detection.

Thanks, this is the kind of support I need to improve the project.

Everybody else has ideas to improve this but also other projects is welcomed.

galazzo 17:32, 23 March 2012 (EET)

Log in or Join to leave comments.

01 Apr
2012

This article explains how to use QShake, a utility class that help you to detect and manage phone shaking. The "shake gesture" can be used for many purposes - for example shake controlled shuffling of gallery or songs, a dice game, or "shaking" files to receive or send them (perhaps using shake direction to determine whether files are pushed or pulled).

Article Metadata

---

Code Example

Source file: QShake (project)

Installation file: QShakeSample.sis

---

Tested with

Devices(s): Nokia C7-00, Nokia N8, Nokia N950

---

Compatibility

Platform(s): Symbian^3 and later, Qt 4.7 and later, Meego

---

Article

Keywords: QAccelerometer, QAccelerometerReading, QAccelerometerFilter, phone shake,

Created: galazzo (22 Mar 2012)

Last edited: hamishwillee (11 Oct 2012)

Using QShake

1. Download source code from here
2. Include QShake directory into your project

Using QVibra

For instructions on how to use QVibra please refer to How to use QVibra to enable vibration in QML.

.pro

        include(./QShake/qshake.pri)

main.cpp

#include <QtGui/QApplication>
#include "qmlapplicationviewer.h"
 
#include <QtDeclarative>
#include "qshake/qshake.h"
#ifdef QVIBRA
#include "QVibra/qvibra.h"
#endif
 
Q_DECL_EXPORT int main(int argc, char *argv[])
{
    QScopedPointer<QApplication> app(createApplication(argc, argv));
 
    qmlRegisterType<QShake>("QShake", 1, 0, "Shake");
#ifdef QVIBRA
    qmlRegisterType<QVibra>("Vibra", 1, 0, "Vibra");
#endif
    QmlApplicationViewer viewer;
    viewer.setMainQmlFile(QLatin1String("qml/QShakeSample/main.qml"));
    viewer.showExpanded();
 
    return app->exec();
}

QML

import QtQuick 1.1
import com.nokia.symbian 1.1
import QShake 1.0
import Vibra 1.0
 
Page {
    id: mainPage
    property string romanticPhrase: ""
    FontLoader { id: appFont; source: "font/andyb.ttf" }
 
    property variant sentences: [
        ,"Love can conquer distance, but you have to want it and be willing to wait."
        ,"True love is saying everything with one look and not one word."
    ]
 
    Image {
         width: parent.width
         height: parent.height         
         fillMode: Image.TileHorizontally
         smooth: true
         source: "images/sfondo-pagina.png"
 
         Column {           
             Row {
                 Rectangle {
                     width: 180
                     height: 320
                     id:male
                     Image  {
                         width: 180
                         height: 232
                         smooth: true
                         source: "images/button-profile-lui.png"
                     }
 
                     MouseArea {
                         anchors.fill: parent
                         onClicked: window.pageStack.push(Qt.resolvedUrl("ProfileMale.qml"))
                     }
                 }
 
                 Rectangle {
                     width: 180
                     height: 320
                     id:female
                     Image  {
                         height: 232
                         smooth: true
                         source: "images/button-profile-lei.png"
                     }
 
                     MouseArea {
                         anchors.fill: parent
                         onClicked: window.pageStack.push(Qt.resolvedUrl("ProfileFemale.qml"))
                     }
                 }
            }
 
            Rectangle {
 
                 width: 180
                 height: 320
                 Image  {
                     id: image1
                     x: 0
                     y: -90
                     width: 360
                     smooth: true
                     source: "images/sfondo-status.png"
 
                     Image {
                         id:tempo
                         x: 29
                         y: 125
                         width: 128
                         anchors.horizontalCenterOffset: -87
                         anchors.horizontalCenter: parent.horizontalCenter
                         source: "images/tempo/0.png"
                     }
 
                     Text {
                         id: tip
                         x: 210
                         y: 94
                         width: 139
                         height: 257
                         color: "#ffffff"
                         text: qsTr("")
                         wrapMode: Text.WrapAtWordBoundaryOrAnywhere
                         font.italic: true
                         font.pixelSize: 22
                         font.family: appFont.name
                     }
                 }
             }         
         }
     }
 
    Vibra {
       id:vibra
    }
 
    Shake {
        id:shake
        sensitivity: Shake.Medium
        direction: Shake.All
        onShake: {
            if( shaked ){
                vibra.start(800,100)
                romanticPhrase = changePhrase();
                animation.start();
            }
        }
    }
 
    function changePhrase(){
        var now = new Date();
        var seed = now.getSeconds();
        var num = (Math.floor(100*Math.random(seed)))%30;
        console.log(num)
        return sentences[num+1];
    }
 
    SequentialAnimation {
        id: animation
        running: false
        NumberAnimation { target: tip; property: "opacity"; to: 0.0; duration: 600}
        PropertyAction { target:tip; property: "text"; value: romanticPhrase }
        NumberAnimation { target: tip; property: "opacity"; to: 1.0; duration: 600}
    }
 
    Component.onCompleted: shake.start();
}

Sensitivity

There are three possible integer values to set sensitivity:

• High = 40
• Medium = 30
• Low = 20

Anyway you can set your preferred value, for example:

Shake {
        id:shake
        sensitivity: 36
}

Direction

You can also force direction detection

Shake {
       id:shake
       direction: Shake.PushPull
}

Possible values are:

• All
• LeftRight
• UpDown
• PushPull

The sensitivity (difference) between Shake.Medium and Shake.High is reduced for values other than All.

Remember that it's a forcing. It works well on Symbian devices, but if you shake too vigorously it is not possible to guarantee the correct direction detection.

I also noticed that there is a small difference between Symbian and Meego devices regarding sensitivity and direction, so it may be you need to change some values.

Sample

• Self-signed QShakeSample.sis can be downloaded for testing.

Featured Sample

• A real application AppLove can be downloaded.
• Shake your phone to discover a new romantic phrase