X-Git-Url: https://www.flypig.org.uk/git/?p=harbour-pedalo.git;a=blobdiff_plain;f=qml%2Fcomponents%2FBarButton.qml;fp=qml%2Fcomponents%2FBarButton.qml;h=052f2e260cd15859645817e2e490c2eb7e08ef60;hp=0000000000000000000000000000000000000000;hb=b0cf1cc508e82763046f46134347e8a37d7dddd6;hpb=5fc520bad80dccf9bf2e0f16552c9f2605417067

diff --git a/qml/components/BarButton.qml b/qml/components/BarButton.qml
new file mode 100644
index 0000000..052f2e2
--- /dev/null
+++ b/qml/components/BarButton.qml
@@ -0,0 +1,73 @@
+import QtQuick 2.0
+import Sailfish.Silica 1.0
+
+MouseArea {
+    id: cycleButton
+    property alias source: image.source
+    property alias text: label.text
+
+    width: parent.width
+    height: parent.height / 2
+
+    Rectangle {
+        id: verticalback
+        anchors.centerIn: parent
+        width: parent.width
+        height: parent.height
+        color: cycleButton.pressed ? Theme.highlightColor : Theme.secondaryHighlightColor
+    }
+
+    Rectangle {
+        id: horizontalback
+        anchors.centerIn: parent
+        width: parent.width
+        height: parent.height
+        color: cycleButton.pressed ? Theme.highlightColor : Theme.secondaryHighlightColor
+    }
+
+    Label {
+        id: label
+        text: ""
+        font.pixelSize: Theme.fontSizeLarge
+        anchors.right: parent.right
+        anchors.top: parent.top
+        anchors.topMargin: Theme.paddingMedium
+        anchors.rightMargin: Theme.horizontalPageMargin
+        width: parent.width - image.width
+        horizontalAlignment: Text.AlignRight
+        wrapMode: Text.WrapAtWordBoundaryOrAnywhere
+    }
+
+    Image {
+        id: image
+        source: ""
+        anchors.left: parent.left
+        fillMode: Image.PreserveAspectFit
+        width: parent.height
+        height: parent.height
+    }
+
+    OpacityRampEffect {
+        id: verticalBackgroundEffect
+        slope: 0.5
+        offset: -1.0
+        direction: OpacityRamp.TopToBottom
+        sourceItem: verticalback
+    }
+
+    OpacityRampEffect {
+        id: horizontalBackgroundEffect
+        slope: 1.2
+        offset: -0.7
+        direction: OpacityRamp.LeftToRight
+        sourceItem: horizontalback
+    }
+
+    OpacityRampEffect {
+        id: imageeffect
+        slope: 1.0
+        offset: 0.0
+        direction: OpacityRamp.TopToBottom
+        sourceItem: image
+    }
+}