diff options
Diffstat (limited to 'examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml')
-rw-r--r-- | examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml | 174 |
1 files changed, 97 insertions, 77 deletions
diff --git a/examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml b/examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml index 466ea8b97..33109bd34 100644 --- a/examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml +++ b/examples/multimedia/video/qmlvideo/qml/qmlvideo/FileBrowser.qml @@ -40,6 +40,9 @@ Rectangle { property string folder + property int itemHeight: Math.min(parent.width, parent.height) / 15 + property int buttonHeight: Math.min(parent.width, parent.height) / 12 + signal fileSelected(string file) function selectFile(file) { @@ -66,12 +69,12 @@ Rectangle { Rectangle { id: root - color: "white" + color: "black" property bool showFocusHighlight: false property variant folders: folders1 property variant view: view1 property alias folder: folders1.folder - property color textColor: "black" + property color textColor: "white" FolderListModel { id: folders1 @@ -103,34 +106,39 @@ Rectangle { fileBrowser.selectFile(path) } width: root.width - height: 52 + height: folderImage.height color: "transparent" Rectangle { - id: highlight; visible: false + id: highlight + visible: false anchors.fill: parent - color: palette.highlight - gradient: Gradient { - GradientStop { id: t1; position: 0.0; color: palette.highlight } - GradientStop { id: t2; position: 1.0; color: Qt.lighter(palette.highlight) } - } + anchors.leftMargin: 5 + anchors.rightMargin: 5 + color: "#212121" } Item { - width: 48; height: 48 + id: folderImage + width: itemHeight + height: itemHeight Image { + id: folderPicture source: "qrc:/folder.png" - anchors.centerIn: parent + width: itemHeight * 0.9 + height: itemHeight * 0.9 + anchors.left: parent.left + anchors.margins: 5 visible: folders.isFolder(index) } } Text { id: nameText - anchors.fill: parent; verticalAlignment: Text.AlignVCenter + anchors.fill: parent; + verticalAlignment: Text.AlignVCenter text: fileName - anchors.leftMargin: 54 - font.pixelSize: 32 + anchors.leftMargin: itemHeight + 10 color: (wrapper.ListView.isCurrentItem && root.showFocusHighlight) ? palette.highlightedText : textColor elide: Text.ElideRight } @@ -142,7 +150,7 @@ Rectangle { root.showFocusHighlight = false; wrapper.ListView.view.currentIndex = index; } - onClicked: { if (folders == wrapper.ListView.view.model) launch() } + onClicked: { if (folders === wrapper.ListView.view.model) launch() } } states: [ @@ -160,17 +168,12 @@ Rectangle { id: view1 anchors.top: titleBar.bottom anchors.bottom: cancelButton.top - x: 0 width: parent.width model: folders1 delegate: folderDelegate highlight: Rectangle { - color: palette.highlight + color: "#212121" visible: root.showFocusHighlight && view1.count != 0 - gradient: Gradient { - GradientStop { id: t1; position: 0.0; color: palette.highlight } - GradientStop { id: t2; position: 1.0; color: Qt.lighter(palette.highlight) } - } width: view1.currentItem == null ? 0 : view1.currentItem.width } highlightMoveVelocity: 1000 @@ -215,12 +218,8 @@ Rectangle { model: folders2 delegate: folderDelegate highlight: Rectangle { - color: palette.highlight + color: "#212121" visible: root.showFocusHighlight && view2.count != 0 - gradient: Gradient { - GradientStop { id: t1; position: 0.0; color: palette.highlight } - GradientStop { id: t2; position: 1.0; color: Qt.lighter(palette.highlight) } - } width: view1.currentItem == null ? 0 : view1.currentItem.width } highlightMoveVelocity: 1000 @@ -254,19 +253,29 @@ Rectangle { } Rectangle { - id: cancelButton - width: 100 - height: titleBar.height - 7 + width: parent.width + height: buttonHeight + 10 + anchors.bottom: parent.bottom color: "black" - anchors { bottom: parent.bottom; horizontalCenter: parent.horizontalCenter } + } + + Rectangle { + id: cancelButton + width: parent.width + height: buttonHeight + color: "#212121" + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.right: parent.right + anchors.margins: 5 + radius: buttonHeight / 15 Text { - anchors { fill: parent; margins: 4 } + anchors.fill: parent text: "Cancel" color: "white" horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter - font.pixelSize: 20 } MouseArea { @@ -277,55 +286,66 @@ Rectangle { Keys.onPressed: { root.keyPressed(event.key); - if (event.key == Qt.Key_Return || event.key == Qt.Key_Select || event.key == Qt.Key_Right) { + if (event.key === Qt.Key_Return || event.key === Qt.Key_Select || event.key === Qt.Key_Right) { view.currentItem.launch(); event.accepted = true; - } else if (event.key == Qt.Key_Left) { + } else if (event.key === Qt.Key_Left) { up(); } } - BorderImage { - source: "qrc:/titlebar.sci"; - width: parent.width; - height: 52 - y: -7 + + Rectangle { id: titleBar + width: parent.width + height: buttonHeight + 10 + anchors.top: parent.top + color: "black" Rectangle { - id: upButton - width: 48 - height: titleBar.height - 7 - color: "transparent" - Image { anchors.centerIn: parent; source: "qrc:/up.png" } - MouseArea { id: upRegion; anchors.centerIn: parent - width: 56 - height: 56 - onClicked: up() - } - states: [ - State { - name: "pressed" - when: upRegion.pressed - PropertyChanges { target: upButton; color: palette.highlight } - } - ] - } + width: parent.width; + height: buttonHeight + color: "#212121" + anchors.margins: 5 + anchors.top: parent.top + anchors.left: parent.left + anchors.right: parent.right + radius: buttonHeight / 15 - Rectangle { - color: "gray" - x: 48 - width: 1 - height: 44 - } + Rectangle { + id: upButton + width: buttonHeight + height: buttonHeight + color: "transparent" + Image { + width: itemHeight + height: itemHeight + anchors.centerIn: parent + source: "qrc:/up.png" + } + MouseArea { id: upRegion; anchors.centerIn: parent + width: buttonHeight + height: buttonHeight + onClicked: up() + } + states: [ + State { + name: "pressed" + when: upRegion.pressed + PropertyChanges { target: upButton; color: palette.highlight } + } + ] + } - Text { - anchors.left: upButton.right; anchors.right: parent.right; height: parent.height - anchors.leftMargin: 4; anchors.rightMargin: 4 - text: folders.folder - color: "white" - elide: Text.ElideLeft; horizontalAlignment: Text.AlignRight; verticalAlignment: Text.AlignVCenter - font.pixelSize: 32 + Text { + anchors.left: upButton.right; anchors.right: parent.right; height: parent.height + anchors.leftMargin: 5; anchors.rightMargin: 5 + text: folders.folder + color: "white" + elide: Text.ElideLeft; + horizontalAlignment: Text.AlignLeft; + verticalAlignment: Text.AlignVCenter + } } } @@ -366,14 +386,14 @@ Rectangle { function keyPressed(key) { switch (key) { - case Qt.Key_Up: - case Qt.Key_Down: - case Qt.Key_Left: - case Qt.Key_Right: - root.showFocusHighlight = true; + case Qt.Key_Up: + case Qt.Key_Down: + case Qt.Key_Left: + case Qt.Key_Right: + root.showFocusHighlight = true; break; - default: - // do nothing + default: + // do nothing break; } } |