Changed RoutingDelegate to use DelegateBase

diff --git a/src/qmlui/FriendsView.qml b/src/qmlui/FriendsView.qml
index 4b73e47..0a11c89 100644 (file)
--- a/src/qmlui/FriendsView.qml
+++ b/src/qmlui/FriendsView.qml
@@ -7,8 +7,6 @@ ListBase {
         image: imageUrl
         primaryText: name
         details: detailsComponent
-
-
     }
     Component {
         id: detailsComponent

diff --git a/src/qmlui/RoutingDelegate.qml b/src/qmlui/RoutingDelegate.qml
index 94a03c6..270568c 100644 (file)
--- a/src/qmlui/RoutingDelegate.qml
+++ b/src/qmlui/RoutingDelegate.qml
@@ -1,160 +1,35 @@
 import Qt 4.7
 
-Item {
+DelegateBase {
     id: delegate
-
-    width: delegate.ListView.view.width
-    height: childrenRect.height
-
-    Rectangle {
-        id: background
-        anchors {
-            left: parent.left
-            right: parent.right
-            top: parent.top
-            bottom: lengthText.bottom
-            topMargin: 5
-            bottomMargin: -5
-        }
-        gradient: Gradient {
-            GradientStop {
-                position: 0
-                color: "#777777"
-            }
-
-            GradientStop {
-                position: 1
-                color: "#222222"
-            }
-        }
-        border { width: 1; color: "#777777" }
-        radius: 5
-    }
-
-    Image {
-        id: turnImage
-        x: 10
-        y: 4
-        source: {
-            switch(turnType) {
-            case "C": "qrc:/res/images/arrow_turn_continue.png"; break;
-            case "TL": "qrc:/res/images/arrow_turn_left.png"; break;
-            case "TSLL": "qrc:/res/images/arrow_turn_slight_left.png"; break;
-            case "TSHL": "qrc:/res/images/arrow_turn_sharp_left.png"; break;
-            case "TR": "qrc:/res/images/arrow_turn_right.png"; break;
-            case "TSLR": "qrc:/res/images/arrow_turn_slight_right.png"; break;
-            case "TSLL": "qrc:/res/images/arrow_turn_sharp_right.png"; break;
-            case "TU": "qrc:/res/images/arrow_turn_u_turn.png"; break;
-            default: {
+    image: {
+        switch(turnType) {
+        case "C": "qrc:/res/images/arrow_turn_continue.png"; break;
+        case "TL": "qrc:/res/images/arrow_turn_left.png"; break;
+        case "TSLL": "qrc:/res/images/arrow_turn_slight_left.png"; break;
+        case "TSHL": "qrc:/res/images/arrow_turn_sharp_left.png"; break;
+        case "TR": "qrc:/res/images/arrow_turn_right.png"; break;
+        case "TSLR": "qrc:/res/images/arrow_turn_slight_right.png"; break;
+        case "TSLL": "qrc:/res/images/arrow_turn_sharp_right.png"; break;
+        case "TU": "qrc:/res/images/arrow_turn_u_turn.png"; break;
+        default: {
                 if (turnType.length > 4)
                     "qrc:/res/images/arrow_turn_roundabout.png";
                 else
                     "qrc:/res/images/arrow_turn_start.png";
             }
             break;
-            }
         }
     }
-    BorderImage {
-        id: borderImage
-        anchors.fill: turnImage
-        anchors.margins: -8
-        source: "qrc:/res/images/profile_pic_border.png"
-        border.left: 24; border.top: 24
-        border.right: 24; border.bottom: 24
-        horizontalTileMode: BorderImage.Stretch
-        verticalTileMode: BorderImage.Stretch
-    }
-
-    Text {
-        id: instructionText
-        anchors { left: turnImage.right; right: background.right; top: background.top; margins: 5; leftMargin: 10 }
-        text: streetName
-        clip: true;
-        elide: Text.ElideRight
-    }
-
-    Image {
-        id: timeImage
-        source: "qrc:/res/images/clock.png"
-        anchors { left: instructionText.left; top: instructionText.bottom }
-    }
-    Text {
-        id: timeText
-        font.pixelSize: timeImage.height * 0.8
-        anchors { margins: 5; left: timeImage.right; right: parent.right; verticalCenter: timeImage.verticalCenter }
-        text: time
-    }
-
-    Image {
-        id: lengthImage
-        anchors { left: instructionText.left; top: timeImage.bottom }
-        source: "qrc:/res/images/ruler.png"
-    }
-    Text {
-        id: lengthText
-        font.pixelSize: lengthImage.height * 0.8
-        anchors { margins: 5; left: lengthImage.right; right: parent.right; verticalCenter: lengthImage.verticalCenter }
-        text: lengthCaption
-    }
-
-
-//    Rectangle {
-//        id: listItem
-//        width: parent.width
-//        height: col.height + 8
-//        color: "lightsteelblue"
-//        radius: 10
-//        border { color: "black"; width: 2 }
-//        clip: true
-
-//        MouseArea {
-//            anchors.fill: parent
-//            onClicked: listItem.state == 'expanded' ? listItem.state = '' : listItem.state = 'expanded'
-//        }
-
-//        Image {
-//            id: image
-//            source: picture
-//            anchors.top: parent.top
-//            anchors.topMargin: 5
-//            anchors.left: parent.left
-//            anchors.leftMargin: 7
-//        }
-
-//        Column {
-//            id: col
-//            x: image.x + image.width + 7
-//            width: parent.width - x - 7
-//            y: 3
-//            Text { text: '<b>' + instruction + '</b> ' }
-//            Text {
-//                id: msg;
-//                text: message;
-//                font.pixelSize: 16;
-//                clip: true;
-//                elide: Text.ElideRight
-//                anchors.left: parent.left;
-//                anchors.right: parent.right}
-//            }
-
-//        states: [
-//            State {
-//                name: "expanded"
-//                PropertyChanges {
-//                    target: msg
-//                    wrapMode: Text.Wrap
-//                    elide: Text.ElideNone
-//                }
-//            }
-//        ]
-
-//        transitions: [
-//            Transition {
-//                from: ""
-//                to: "expanded"
-//                NumberAnimation { properties: "height"; duration: 100 }
-//                reversible: true
-//            }
-//        ]
+    primaryText: streetName
+    details: Component {
+        id: detailsComponent
+        Item {
+            state: delegate.state
+            height: timeRow.height + lengthRow.height
+            width: parent.width
+            DetailRow { id: timeRow; image: "qrc:/res/images/clock.png"; text: time }
+            DetailRow { id: lengthRow; anchors.top: timeRow.bottom; image: "qrc:/res/images/ruler.png"; text: lengthCaption }
+        }
     }
+}