qml/components/BarButton.qml

   1 import QtQuick 2.0
   2 import Sailfish.Silica 1.0
   3
   4 MouseArea {
   5     id: cycleButton
   6     property alias source: image.source
   7     property alias text: label.text
   8
   9     width: parent.width
  10     height: parent.height / 2
  11
  12     Rectangle {
  13         id: verticalback
  14         anchors.centerIn: parent
  15         width: parent.width
  16         height: parent.height
  17         color: cycleButton.pressed ? Theme.highlightColor : Theme.secondaryHighlightColor
  18     }
  19
  20     Rectangle {
  21         id: horizontalback
  22         anchors.centerIn: parent
  23         width: parent.width
  24         height: parent.height
  25         color: cycleButton.pressed ? Theme.highlightColor : Theme.secondaryHighlightColor
  26     }
  27
  28     Label {
  29         id: label
  30         text: ""
  31         font.pixelSize: Theme.fontSizeLarge
  32         anchors.right: parent.right
  33         anchors.top: parent.top
  34         anchors.topMargin: Theme.paddingMedium
  35         anchors.rightMargin: Theme.horizontalPageMargin
  36         width: parent.width - image.width
  37         horizontalAlignment: Text.AlignRight
  38         wrapMode: Text.WrapAtWordBoundaryOrAnywhere
  39     }
  40
  41     Image {
  42         id: image
  43         source: ""
  44         anchors.left: parent.left
  45         fillMode: Image.PreserveAspectFit
  46         width: parent.height
  47         height: parent.height
  48     }
  49
  50     OpacityRampEffect {
  51         id: verticalBackgroundEffect
  52         slope: 0.5
  53         offset: -1.0
  54         direction: OpacityRamp.TopToBottom
  55         sourceItem: verticalback
  56     }
  57
  58     OpacityRampEffect {
  59         id: horizontalBackgroundEffect
  60         slope: 1.2
  61         offset: -0.7
  62         direction: OpacityRamp.LeftToRight
  63         sourceItem: horizontalback
  64     }
  65
  66     OpacityRampEffect {
  67         id: imageeffect
  68         slope: 1.0
  69         offset: 0.0
  70         direction: OpacityRamp.TopToBottom
  71         sourceItem: image
  72     }
  73 }