Replaced self made UI rotation with system's rotation, portrait panels need some...
authorSami Rämö <sami.ramo@ixonos.com>
Tue, 23 Nov 2010 11:01:47 +0000 (13:01 +0200)
committerSami Rämö <sami.ramo@ixonos.com>
Tue, 23 Nov 2010 11:01:47 +0000 (13:01 +0200)
src/engine/engine.cpp
src/qmlui/Main.qml
src/qmlui/Map.qml
src/qmlui/Panel.qml
src/qmlui/PanelSelectorButton.qml
src/qmlui/rotation.cpp [deleted file]
src/qmlui/rotation.h [deleted file]
src/src.pro

index b292819..3a0d18b 100644 (file)
@@ -41,7 +41,6 @@
 #include "situareservice/situareservice.h"
 #include "ui/mainwindow.h"
 #include "qmlui/geomap.h"
-#include "qmlui/rotation.h"
 #include "qmlui/loginlogic.h"
 #include <qdeclarative.h>
 #include <QDeclarativeView>
@@ -223,6 +222,7 @@ SituareEngine::SituareEngine()
     Q_D(SituareEngine);
 
     d->ui = new QDeclarativeView(QApplication::desktop());
+    d->ui->setResizeMode(QDeclarativeView::SizeRootObjectToView);
     d->grabZoomKeys(true);
 #ifdef Q_WS_MAEMO_5
 //    d->ui->setAttribute(Qt::WA_Maemo5AutoOrientation, true);
@@ -230,8 +230,6 @@ SituareEngine::SituareEngine()
 
     d->friendProxyModel.setSourceModel(&d->friendModel);
 
-    Rotation *rotation = new Rotation();
-    d->ui->rootContext()->setContextProperty("deviceRotation", static_cast<QObject *>(rotation));
     d->ui->rootContext()->setContextProperty("facebookAuthenticator", m_facebookAuthenticator);
     d->ui->rootContext()->setContextProperty("routingModel", &d->routeModel);
     d->ui->rootContext()->setContextProperty("friendModel", &d->friendProxyModel);
index 800e5c9..fc085df 100644 (file)
@@ -1,32 +1,47 @@
 import Qt 4.7
 
 Rectangle {
+    id: root
     SystemPalette { id: palette }
 
-    width: 800
-    height: 480 - 56
-    color: "black"
-    id: root
+    color: palette.window
 
-    Map { id: map; x: 0; y: 0; width: panel.x + 1; height: parent.height }
+    onHeightChanged: {
+        console.log("root height changed, height: " + height + ", width: " + width)
+    }
+
+    onStateChanged: {
+        console.log("root state changed, state: " + state)
+    }
+
+    Map {
+        id: map;
+        anchors { left: parent.left; right: panel.left; top: parent.top; bottom: parent.bottom }
+    }
 
     Panel {
         id: panel
         x: panelSelectorButtonsBar.x
-        y: parent.y
-        width: (parent.width - profile.width ) / 2
+        anchors.top: parent.top
+        width: (parent.width - panelSelectorButtonsBar.width ) / 2
     }
 
     Rectangle {
         id: panelSelectorButtonsBar
         color: "gray"
-        anchors { top: parent.top; bottom: parent.bottom; right: parent.right }
-        width: parent.height / 4 + panelSelectorButtons.anchors.leftMargin
+        anchors { bottom: parent.bottom; right: parent.right }
+        width: root.height / 4
+        height: root.height
 
-        Column {
+        onHeightChanged: { console.log("panelSelectorButtonsBar, h:" + height) }
+        onWidthChanged: { console.log("panelSelectorButtonsBar, w:" + width) }
+
+        Grid {
             id: panelSelectorButtons
             anchors { fill: parent; leftMargin: 1 }
             spacing: 2
+            rows: 4
+            columns: 1
 
             PanelSelectorButton {
                 id: profile
@@ -61,4 +76,40 @@ Rectangle {
     LoginWidget {
         id: loginDialog
     }
+
+    states: [
+        State {
+            name: "portrait"
+            when: height > width
+            AnchorChanges {
+                target: map
+                anchors.right: right
+                anchors.bottom: panelSelectorButtonsBar.top
+            }
+            AnchorChanges {
+                target: panel
+                anchors.left: root.left
+                anchors.right: root.right
+            }
+            PropertyChanges {
+                target: panelSelectorButtonsBar
+                width: root.width
+                height: root.width / 4
+            }
+            PropertyChanges {
+                target: panelSelectorButtons
+                columns: 4
+                rows: 1
+            }
+
+        }
+    ]
+    transitions: [
+        Transition {
+            from: ""
+            to: "portrait"
+            reversible: true
+        }
+    ]
+
 }
index 8d9fbc2..0649df6 100644 (file)
@@ -1,9 +1,8 @@
 import Qt 4.7
 import MapPlugin 1.0
 
-Item {
+Rectangle {
     id: mapRect
-    state: deviceRotation.orientation
     clip: true
 
     property alias centerLatitude: map.centerLatitude
@@ -43,231 +42,200 @@ Item {
         }
     }
 
-    Rectangle {
-        id: mapContents
-        color: palette.window
-        transformOrigin: "Center"
-        x: 0
-        y: 0
-        height: parent.height
-        width: parent.width
-        anchors.centerIn: parent
+    color: palette.window
 
-        GeoMap {
-            id: map
-            anchors.fill: parent
-            mapType: "StreetMap"
-            zoomLevel: 5.0
-        }
+    GeoMap {
+        id: map
+        anchors.fill: parent
+        mapType: "StreetMap"
+        zoomLevel: 5.0
+    }
 
-        Rectangle {
-            color: "#222222"
-            width: logo.width + 20
-            height: logo.height + 20
-            x: -10
-            y: -10
-            radius: 10
-            Image {
-                id: logo
-                source: "qrc:/res/ixonos_logo.png"
-                anchors.centerIn: parent
-                anchors.horizontalCenterOffset: 3
-                anchors.verticalCenterOffset: 5
-            }
+    Rectangle {
+        color: "#222222"
+        width: logo.width + 20
+        height: logo.height + 20
+        x: -10
+        y: -10
+        radius: 10
+        Image {
+            id: logo
+            source: "qrc:/res/ixonos_logo.png"
+            anchors.centerIn: parent
+            anchors.horizontalCenterOffset: 3
+            anchors.verticalCenterOffset: 5
         }
+    }
 
-        MouseArea {
-            property int prevMouseX: 0
-            property int prevMouseY: 0
-            anchors.fill: map
-            onPressed: {
+    MouseArea {
+        property int prevMouseX: 0
+        property int prevMouseY: 0
+        anchors.fill: map
+        onPressed: {
+            prevMouseX = mouse.x
+            prevMouseY = mouse.y;
+        }
+        onMousePositionChanged: {
+            if (mouse.buttons & Qt.LeftButton) {
+                var diffX = mouse.x - prevMouseX
+                var diffY = mouse.y - prevMouseY
+                map.pan(-diffX, -diffY)
                 prevMouseX = mouse.x
-                prevMouseY = mouse.y;
-            }
-            onMousePositionChanged: {
-                if (mouse.buttons & Qt.LeftButton) {
-                    var diffX = mouse.x - prevMouseX
-                    var diffY = mouse.y - prevMouseY
-                    map.pan(-diffX, -diffY)
-                    prevMouseX = mouse.x
-                    prevMouseY = mouse.y
-                }
-            }
-            onClicked: {
-                map.onClicked(mouseX, mouseY)
+                prevMouseY = mouse.y
             }
         }
-
-        Keys.onPressed: {
-            if (event.key == Qt.Key_F7)
-                map.zoomIn()
-            else if (event.key == Qt.Key_F8)
-                map.zoomOut()
+        onClicked: {
+            map.onClicked(mouseX, mouseY)
         }
+    }
 
-        Image {
-            id: sight
-            x: parent.width/2 - width/2
-            y: parent.height/2 - height/2
-            opacity: 1.0
-            source: "qrc:/res/sight.png"
-        }
+    Keys.onPressed: {
+        if (event.key == Qt.Key_F7)
+            map.zoomIn()
+        else if (event.key == Qt.Key_F8)
+            map.zoomOut()
+    }
 
-        Rectangle {
-            id: gpsDistance
-            x: 5
-            y: parent.height - height - 5
-            width: zoomIn.width
-            height: zoomIn.height / 2
-            radius: 10
-            opacity: 1
-            color: palette.button
-            border.color: palette.highlight
-            border.width: 3
+    Image {
+        id: sight
+        x: parent.width/2 - width/2
+        y: parent.height/2 - height/2
+        opacity: 1.0
+        source: "qrc:/res/sight.png"
+    }
 
-            Text {
-                anchors.fill: parent
-                verticalAlignment: "AlignVCenter"
-                horizontalAlignment: "AlignHCenter"
-                text: map.distanceToGpsLocationText
-                color: palette.text
-                font.pixelSize: height / 3
-            }
+    Rectangle {
+        id: gpsDistance
+        x: 5
+        y: parent.height - height - 5
+        width: zoomIn.width
+        height: zoomIn.height / 2
+        radius: 10
+        opacity: 1
+        color: palette.button
+        border.color: palette.highlight
+        border.width: 3
+
+        Text {
+            anchors.fill: parent
+            verticalAlignment: "AlignVCenter"
+            horizontalAlignment: "AlignHCenter"
+            text: map.distanceToGpsLocationText
+            color: palette.text
+            font.pixelSize: height / 3
         }
+    }
 
-        Rectangle {
-            id: gpsLocation
-            x: 5
-            y: parent.height - height - gpsDistance.height - 10
-            width: zoomIn.width
-            height: zoomIn.height
-            radius: 10
-            opacity: 1
-            color: palette.button
-            border.color: palette.highlight
-            border.width: 3
+    Rectangle {
+        id: gpsLocation
+        x: 5
+        y: parent.height - height - gpsDistance.height - 10
+        width: zoomIn.width
+        height: zoomIn.height
+        radius: 10
+        opacity: 1
+        color: palette.button
+        border.color: palette.highlight
+        border.width: 3
 
-            Image {
-                source: "qrc:/res/gps_position.png"
-                anchors.verticalCenter: parent.verticalCenter
-                anchors.horizontalCenter: parent.horizontalCenter
-            }
+        Image {
+            source: "qrc:/res/gps_position.png"
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.horizontalCenter: parent.horizontalCenter
+        }
 
-            Image {
-                 source: "qrc:/res/gps_position_dir.png"
-                 anchors.verticalCenter: parent.verticalCenter
-                 anchors.horizontalCenter: parent.horizontalCenter
-                 rotation: map.angleToGpsLocation
-                 opacity: map.distanceToGpsLocation < 1.0 ? 0.0 : 1.0
-            }
+        Image {
+             source: "qrc:/res/gps_position_dir.png"
+             anchors.verticalCenter: parent.verticalCenter
+             anchors.horizontalCenter: parent.horizontalCenter
+             rotation: map.angleToGpsLocation
+             opacity: map.distanceToGpsLocation < 1.0 ? 0.0 : 1.0
+        }
 
-            MouseArea {
-                id: mouseArea3
-                anchors.fill: parent
-                onClicked: ParallelAnimation {
-                    PropertyAnimation {
-                        target: map
-                        property: "centerLatitude"
-                        from: map.centerLatitude
-                        to: map.gpsLocationLatitude
-                        duration: 500
-                        easing.type: Easing.InOutCubic
-                    }
-                    PropertyAnimation {
-                        target: map
-                        property: "centerLongitude"
-                        from: map.centerLongitude
-                        to: map.gpsLocationLongitude
-                        duration: 500
-                        easing.type: Easing.InOutCubic
-                    }
+        MouseArea {
+            id: mouseArea3
+            anchors.fill: parent
+            onClicked: ParallelAnimation {
+                PropertyAnimation {
+                    target: map
+                    property: "centerLatitude"
+                    from: map.centerLatitude
+                    to: map.gpsLocationLatitude
+                    duration: 500
+                    easing.type: Easing.InOutCubic
                 }
-            }
-            states: [
-                State {
-                    name: "active"
-                    when: mouseArea3.pressed
-                    PropertyChanges {
-                        target: gpsLocation
-                        opacity: 1.0
-                    }
+                PropertyAnimation {
+                    target: map
+                    property: "centerLongitude"
+                    from: map.centerLongitude
+                    to: map.gpsLocationLongitude
+                    duration: 500
+                    easing.type: Easing.InOutCubic
                 }
-            ]
+            }
         }
-
-        Image {
-            id: zoomIn
-            x: 5
-            y: 33
-            opacity: 1.0
-            source: "qrc:/res/zoom_in.png"
-
-            MouseArea {
-                id: mouseArea1
-                anchors.fill: parent
-                onClicked: {
-                   map.zoomIn()
+        states: [
+            State {
+                name: "active"
+                when: mouseArea3.pressed
+                PropertyChanges {
+                    target: gpsLocation
+                    opacity: 1.0
                 }
             }
+        ]
+    }
 
-            states: [
-                State {
-                    name: "active"
-                    when: mouseArea1.pressed
-                    PropertyChanges {
-                        target: zoomIn
-                        opacity: 1.0
-                    }
-                }
-            ]
-        }
+    Image {
+        id: zoomIn
+        x: 5
+        y: 33
+        opacity: 1.0
+        source: "qrc:/res/zoom_in.png"
 
-        Image {
-            id: zoomOut
-            x: 5
-            y: zoomIn.y + zoomIn.height + 5
-            opacity: 1.0
-            source: "qrc:/res/zoom_out.png"
+        MouseArea {
+            id: mouseArea1
+            anchors.fill: parent
+            onClicked: {
+               map.zoomIn()
+            }
+        }
 
-            MouseArea {
-                id: mouseArea2
-                anchors.fill: parent
-                onClicked: {
-                    map.zoomOut()
+        states: [
+            State {
+                name: "active"
+                when: mouseArea1.pressed
+                PropertyChanges {
+                    target: zoomIn
+                    opacity: 1.0
                 }
             }
-            states: [
-                State {
-                    name: "active"
-                    when: mouseArea2.pressed
-                    PropertyChanges {
-                        target: zoomOut
-                        opacity: 1.0
-                    }
-                }
-            ]
-        }
+        ]
     }
 
+    Image {
+        id: zoomOut
+        x: 5
+        y: zoomIn.y + zoomIn.height + 5
+        opacity: 1.0
+        source: "qrc:/res/zoom_out.png"
 
-    states: [
-        State {
-            name: "potrait"
-            PropertyChanges {
-                target: mapContents
-                rotation: -90
-                height: parent.width
-                width: parent.height
+        MouseArea {
+            id: mouseArea2
+            anchors.fill: parent
+            onClicked: {
+                map.zoomOut()
             }
         }
-    ]
-
-    transitions: [
-        Transition {
-            from: ""
-            to: "potrait"
-            NumberAnimation { properties: "rotation,heigth,width"; duration: 200 }
-            reversible: true
-        }
-    ]
+        states: [
+            State {
+                name: "active"
+                when: mouseArea2.pressed
+                PropertyChanges {
+                    target: zoomOut
+                    opacity: 1.0
+                }
+            }
+        ]
+    }
 }
index b25ebbd..e6d7f78 100644 (file)
@@ -20,69 +20,38 @@ Rectangle {
         }
     }
 
-    Item {
-        id: contentsArea
-        state: deviceRotation.orientation
-        anchors.centerIn: parent
-        x: 0
-        y: 0
-        height: panel.height
-        width: panel.width
+    Flipable {
+        id: flipable
+        anchors.fill: parent
+        property bool flipped: false
 
-        Flipable {
-            id: flipable
-            anchors.fill: parent
-            property bool flipped: false
-
-            front: Loader {
-                id: frontLoader
-                anchors { fill: parent; leftMargin: 5; rightMargin: 5 }
-            }
-
-            back: Loader {
-                id: backLoader
-                anchors { fill: parent; leftMargin: 5; rightMargin: 5 }
-            }
-
-            transform: Rotation {
-                id: rotation
-                origin.x: flipable.width / 2;
-                origin.y: flipable.height / 2
-                axis { x: 0; y: 1; z: 0 }
-                angle: 0
-            }
+        front: Loader {
+            id: frontLoader
+            anchors { fill: parent; leftMargin: 5; rightMargin: 5 }
+        }
 
-            states: State {
-                name: "orthogonal"
-                PropertyChanges { target: rotation; angle: 180 }
-                when: flipable.flipped
-            }
+        back: Loader {
+            id: backLoader
+            anchors { fill: parent; leftMargin: 5; rightMargin: 5 }
+        }
 
-            transitions: Transition {
-                NumberAnimation { target: rotation; properties: "angle"; duration: 300 }
-            }
+        transform: Rotation {
+            id: rotation
+            origin.x: flipable.width / 2;
+            origin.y: flipable.height / 2
+            axis { x: 0; y: 1; z: 0 }
+            angle: 0
         }
 
-        states: [
-            State {
-                name: "potrait"
-                PropertyChanges {
-                    target: contentsArea
-                    rotation: -90
-                    height: panel.width
-                    width: panel.height
-                }
-            }
-        ]
+        states: State {
+            name: "orthogonal"
+            PropertyChanges { target: rotation; angle: 180 }
+            when: flipable.flipped
+        }
 
-        transitions: [
-            Transition {
-                from: ""
-                to: "potrait"
-                NumberAnimation { properties: "rotation,heigth,width"; duration: 200 }
-                reversible: true
-            }
-        ]
+        transitions: Transition {
+            NumberAnimation { target: rotation; properties: "angle"; duration: 300 }
+        }
     }
 
     states: [
index 74afd6a..32bdc59 100644 (file)
@@ -9,7 +9,7 @@ Rectangle {
 
     signal buttonClicked()
     color: "#222222"
-    width: parent.width
+    width: Math.min(parent.width, parent.height)
     height: width
 
     MouseArea {
@@ -18,60 +18,33 @@ Rectangle {
         onClicked: buttonClicked()
     }
 
-    Item {
-        id: rotatingContents
-        state: border.autoRotationEnabled ? deviceRotation.orientation : ""
-        height: parent.height > parent.width ? parent.width : parent.height
-        width: parent.height > parent.width ? parent.width : parent.height
+    Image {
+        id: image
+        smooth: true
         anchors.centerIn: parent
-
-        Image {
-            id: image
-            smooth: true
-            anchors.centerIn: parent
-            anchors.verticalCenterOffset: -6
-            width: sourceSize.width
-            height: sourceSize.height
-        }
-
-        Text {
-            id: text
-            color: "#aaaaaa"
-            font.pixelSize: 18
-            smooth: true
-            anchors.bottom: parent.bottom
-            anchors.bottomMargin: 8
-            anchors.horizontalCenter: parent.horizontalCenter
-        }
-
-        states: [
-            State {
-                name: "highlight"
-                when: mouseArea.pressed
-                PropertyChanges {
-                    target: button
-                    color: palette.highlight
-                }
-            },
-            State {
-                name: "potrait"
-                when: button.autoRotationEnabled && deviceRotation.orientation == "potrait"
-                PropertyChanges {
-                    target: rotatingContents
-                    rotation: -90
-                }
-            }
-        ]
-
-        transitions: [
-            Transition {
-                from: ""
-                to: "potrait"
-                NumberAnimation { properties: "rotation"; duration: 200 }
-                reversible: true
-            }
-        ]
+        anchors.verticalCenterOffset: -6
+        width: sourceSize.width
+        height: sourceSize.height
     }
 
+    Text {
+        id: text
+        color: "#aaaaaa"
+        font.pixelSize: 18
+        smooth: true
+        anchors.bottom: parent.bottom
+        anchors.bottomMargin: 8
+        anchors.horizontalCenter: parent.horizontalCenter
+    }
 
+    states: [
+        State {
+            name: "highlight"
+            when: mouseArea.pressed
+            PropertyChanges {
+                target: button
+                color: palette.highlight
+            }
+        }
+    ]
 }
diff --git a/src/qmlui/rotation.cpp b/src/qmlui/rotation.cpp
deleted file mode 100644 (file)
index 3970ae5..0000000
+++ /dev/null
@@ -1,53 +0,0 @@
-#include "rotation.h"
-#include <QOrientationReading>
-#include <QOrientationSensor>
-#include <QTimer>
-
-QTM_USE_NAMESPACE
-
-Rotation::Rotation(QObject *parent) :
-    QObject(parent)
-{
-    startReading();
-}
-
-void Rotation::onReadingChanged()
-{
-    if (m_sensor) {
-        switch (m_sensor->reading()->orientation()) {
-        case QOrientationReading::TopUp:
-        case QOrientationReading::TopDown:
-            if( m_orientation == "potrait") {
-                m_orientation = "";
-                emit orientationChanged();
-            }
-            break;
-        case QOrientationReading::LeftUp:
-        case QOrientationReading::RightUp:
-            if (m_orientation == "") {
-                m_orientation = "potrait";
-                emit orientationChanged();
-            }
-            break;
-        default:
-            break;
-        }
-
-        delete m_sensor;
-        m_sensor = 0;
-
-        QTimer::singleShot(1000, this, SLOT(startReading()));
-    }
-}
-
-const QString& Rotation::orientation() const
-{
-    return m_orientation;
-}
-
-void Rotation::startReading()
-{
-    m_sensor = new QOrientationSensor(this);
-    connect(m_sensor, SIGNAL(readingChanged()), this, SLOT(onReadingChanged()));
-    m_sensor->start();
-}
diff --git a/src/qmlui/rotation.h b/src/qmlui/rotation.h
deleted file mode 100644 (file)
index 9b17b4b..0000000
+++ /dev/null
@@ -1,34 +0,0 @@
-#ifndef ROTATION_H
-#define ROTATION_H
-
-#include <QObject>
-
-namespace QtMobility {
-class QOrientationSensor;
-}
-using QtMobility::QOrientationSensor;
-
-class Rotation : public QObject
-{
-    Q_OBJECT
-
-    Q_PROPERTY(QString orientation READ orientation NOTIFY orientationChanged)
-
-public:
-    explicit Rotation(QObject *parent = 0);
-
-    const QString& orientation() const;
-
-signals:
-    void orientationChanged();
-
-public slots:
-    void onReadingChanged();
-    void startReading();
-
-private:
-    QOrientationSensor *m_sensor;
-    QString m_orientation;
-};
-
-#endif // ROTATION_H
index 1b7c3ed..f6a35a1 100644 (file)
@@ -89,7 +89,6 @@ SOURCES += main.cpp \
     ui/listitemcontextbuttonbar.cpp \
     qmlui/geomap.cpp \
     qmlui/loginlogic.cpp \
-    qmlui/rotation.cpp \
     routing/routemodel.cpp \
     engine/updatelocation.cpp \
     user/friendmodel.cpp \
@@ -183,7 +182,6 @@ HEADERS += application.h \
     ui/listitemcontextbuttonbar.h \
     qmlui/geomap.h \
     qmlui/loginlogic.h \
-    qmlui/rotation.h \
     routing/routemodel.h \
     engine/updatelocation.h \
     user/friendmodel.h \