Changeset View
Changeset View
Standalone View
Standalone View
src/controls/GlobalDrawer.qml
| Show First 20 Lines • Show All 65 Lines • ▼ Show 20 Line(s) | |||||
| 66 | OverlayDrawer { | 66 | OverlayDrawer { | ||
| 67 | id: root | 67 | id: root | ||
| 68 | edge: Qt.application.layoutDirection == Qt.RightToLeft ? Qt.RightEdge : Qt.LeftEdge | 68 | edge: Qt.application.layoutDirection == Qt.RightToLeft ? Qt.RightEdge : Qt.LeftEdge | ||
| 69 | 69 | | |||
| 70 | /** | 70 | /** | ||
| 71 | * title: string | 71 | * title: string | ||
| 72 | * A title to be displayed on top of the drawer | 72 | * A title to be displayed on top of the drawer | ||
| 73 | */ | 73 | */ | ||
| 74 | property alias title: heading.text | 74 | property alias title: bannerImage.title | ||
| 75 | 75 | | |||
| 76 | /** | 76 | /** | ||
| 77 | * icon: var | 77 | * icon: var | ||
| 78 | * An icon to be displayed alongside the title. | 78 | * An icon to be displayed alongside the title. | ||
| 79 | * It can be a QIcon, a fdo-compatible icon name, or any url understood by Image | 79 | * It can be a QIcon, a fdo-compatible icon name, or any url understood by Image | ||
| 80 | */ | 80 | */ | ||
| 81 | property alias titleIcon: headingIcon.source | 81 | property alias titleIcon: bannerImage.titleIcon | ||
| 82 | 82 | | |||
| 83 | /** | 83 | /** | ||
| 84 | * bannerImageSource: string | 84 | * bannerImageSource: string | ||
| 85 | * An image to be used as background for the title and icon for | 85 | * An image to be used as background for the title and icon for | ||
| 86 | * a decorative purpose. | 86 | * a decorative purpose. | ||
| 87 | * It accepts any url format supported by Image | 87 | * It accepts any url format supported by Image | ||
| 88 | */ | 88 | */ | ||
| 89 | property alias bannerImageSource: bannerImage.source | 89 | property alias bannerImageSource: bannerImage.source | ||
| ▲ Show 20 Lines • Show All 129 Lines • ▼ Show 20 Line(s) | 217 | Flickable { | |||
| 219 | contentWidth: width | 219 | contentWidth: width | ||
| 220 | contentHeight: mainColumn.Layout.minimumHeight | 220 | contentHeight: mainColumn.Layout.minimumHeight | ||
| 221 | ColumnLayout { | 221 | ColumnLayout { | ||
| 222 | id: mainColumn | 222 | id: mainColumn | ||
| 223 | width: mainFlickable.width | 223 | width: mainFlickable.width | ||
| 224 | spacing: 0 | 224 | spacing: 0 | ||
| 225 | height: Math.max(root.height, Layout.minimumHeight) | 225 | height: Math.max(root.height, Layout.minimumHeight) | ||
| 226 | 226 | | |||
| 227 | Image { | 227 | BannerImage { | ||
| 228 | id: bannerImage | 228 | id: bannerImage | ||
| 229 | 229 | | |||
| 230 | Layout.fillWidth: true | 230 | Layout.fillWidth: true | ||
| 231 | 231 | | |||
| 232 | Layout.preferredWidth: title.implicitWidth | 232 | fillMode: Image.PreserveAspectCrop | ||
| 233 | Layout.preferredHeight: bannerImageSource != "" ? 10 * Units.gridUnit : Layout.minimumHeight | | |||
| 234 | Layout.minimumHeight: title.height > 0 ? title.height + Units.smallSpacing * 2 : 0 | | |||
| 235 | | ||||
| 236 | MouseArea { | 233 | MouseArea { | ||
| 237 | anchors.fill: parent | 234 | anchors.fill: parent | ||
| 238 | onClicked: root.bannerClicked() | 235 | onClicked: root.bannerClicked() | ||
| 239 | } | 236 | } | ||
| 240 | | ||||
| 241 | fillMode: Image.PreserveAspectCrop | | |||
| 242 | asynchronous: true | | |||
| 243 | | ||||
| 244 | anchors { | | |||
| 245 | left: parent.left | | |||
| 246 | right: parent.right | | |||
| 247 | top: parent.top | | |||
| 248 | } | | |||
| 249 | | ||||
| 250 | EdgeShadow { | 237 | EdgeShadow { | ||
| 251 | edge: Qt.BottomEdge | 238 | edge: Qt.BottomEdge | ||
| 252 | visible: bannerImageSource != "" | 239 | visible: bannerImageSource != "" | ||
| 253 | anchors { | 240 | anchors { | ||
| 254 | left: parent.left | 241 | left: parent.left | ||
| 255 | right: parent.right | 242 | right: parent.right | ||
| 256 | bottom: parent.top | 243 | bottom: parent.top | ||
| 257 | } | 244 | } | ||
| 258 | } | 245 | } | ||
| 259 | LinearGradient { | | |||
| 260 | anchors { | | |||
| 261 | left: parent.left | | |||
| 262 | right: parent.right | | |||
| 263 | top: parent.top | | |||
| 264 | } | | |||
| 265 | visible: bannerImageSource != "" && root.title != "" | | |||
| 266 | height: title.height * 1.3 | | |||
| 267 | start: Qt.point(0, 0) | | |||
| 268 | end: Qt.point(0, height) | | |||
| 269 | gradient: Gradient { | | |||
| 270 | GradientStop { | | |||
| 271 | position: 0.0 | | |||
| 272 | color: Qt.rgba(0, 0, 0, 0.8) | | |||
| 273 | } | | |||
| 274 | GradientStop { | | |||
| 275 | position: 1.0 | | |||
| 276 | color: "transparent" | | |||
| 277 | } | | |||
| 278 | } | | |||
| 279 | } | | |||
| 280 | | ||||
| 281 | RowLayout { | | |||
| 282 | id: title | | |||
| 283 | anchors { | | |||
| 284 | left: parent.left | | |||
| 285 | top: parent.top | | |||
| 286 | margins: Units.smallSpacing * 2 | | |||
| 287 | } | | |||
| 288 | Icon { | | |||
| 289 | id: headingIcon | | |||
| 290 | Layout.minimumWidth: Units.iconSizes.large | | |||
| 291 | Layout.minimumHeight: width | | |||
| 292 | visible: valid | | |||
| 293 | isMask: false | | |||
| 294 | //TODO: find a better way to control selective coloring on Android | | |||
| 295 | enabled: !Settings.isMobile | | |||
| 296 | } | | |||
| 297 | Heading { | | |||
| 298 | id: heading | | |||
| 299 | Layout.fillWidth: true | | |||
| 300 | Layout.rightMargin: heading.height | | |||
| 301 | visible: text.length > 0 | | |||
| 302 | level: 1 | | |||
| 303 | color: bannerImageSource != "" ? "white" : Theme.textColor | | |||
| 304 | elide: Text.ElideRight | | |||
| 305 | } | | |||
| 306 | } | | |||
| 307 | } | 246 | } | ||
| 308 | 247 | | |||
| 309 | ColumnLayout { | 248 | ColumnLayout { | ||
| 310 | id: topContent | 249 | id: topContent | ||
| 311 | spacing: 0 | 250 | spacing: 0 | ||
| 312 | Layout.alignment: Qt.AlignHCenter | 251 | Layout.alignment: Qt.AlignHCenter | ||
| 313 | Layout.leftMargin: root.leftPadding | 252 | Layout.leftMargin: root.leftPadding | ||
| 314 | Layout.rightMargin: root.rightPadding | 253 | Layout.rightMargin: root.rightPadding | ||
| ▲ Show 20 Lines • Show All 152 Lines • Show Last 20 Lines | |||||