diff options
Diffstat (limited to 'demo3/vertical/videoplayer/app/VideoPlayer.qml')
| -rw-r--r-- | demo3/vertical/videoplayer/app/VideoPlayer.qml | 244 |
1 files changed, 244 insertions, 0 deletions
diff --git a/demo3/vertical/videoplayer/app/VideoPlayer.qml b/demo3/vertical/videoplayer/app/VideoPlayer.qml new file mode 100644 index 0000000..4fae69d --- /dev/null +++ b/demo3/vertical/videoplayer/app/VideoPlayer.qml @@ -0,0 +1,244 @@ +/* + * Copyright (C) 2018 The Qt Company Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import QtQuick 2.6 +import QtQuick.Layouts 1.1 +import QtQuick.Controls 2.0 +import QtMultimedia 5.6 +import AGL.Demo.Controls 1.0 +import 'api' as API + +ApplicationWindow { + id: root + + API.MediaScanner { + id: scanner + url: bindingAddress + + property var titles: Object + onAdded: { + playlist.addItem(media.path) + titles[media.path] = media.title + } + onRemoved: { + playlist.removeItem(index) + } + } + + MediaPlayer { + id: player + audioRole: MediaPlayer.MusicRole + autoLoad: true + playlist: playlist + function time2str(value) { + return Qt.formatTime(new Date(value), 'mm:ss') + } + onPositionChanged: slider.value = player.position + } + + Playlist { + id: playlist + playbackMode: Playlist.Loop + +// PlaylistItem { source: 'file:///home/root/Videos/Qt_Mashup_DO_NOT_MODIFY.mp4' } +// PlaylistItem { source: 'file:///home/root/Videos/Qt_is_everywhere-071116.mp4' } + } + + ColumnLayout { + anchors.fill: parent + Item { + Layout.fillWidth: true + Layout.fillHeight: true + Layout.preferredHeight: 1080 + clip: true + + VideoOutput { + source: player + anchors.fill: parent + Rectangle { + anchors.fill: parent + color: 'black' + opacity: 0.75 + z: -1 + } + + MouseArea{ + anchors.fill: parent + onClicked:{ + controls.visible = !controls.visible; + } + } + + Item { + id: controls + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + visible: false + height: 240 + z: 100 + + ColumnLayout { + anchors.fill: parent + anchors.margins: 5 + Item { + Layout.fillWidth: true + Layout.fillHeight: true + Row { + spacing: 20 + ToggleButton { + id: random + offImage: './images/AGL_MediaPlayer_Shuffle_Inactive.svg' + onImage: './images/AGL_MediaPlayer_Shuffle_Active.svg' + } + ToggleButton { + id: loop + offImage: './images/AGL_MediaPlayer_Loop_Inactive.svg' + onImage: './images/AGL_MediaPlayer_Loop_Active.svg' + } + } + ColumnLayout { + anchors.fill: parent + Label { + id: title + Layout.alignment: Layout.Center + text: player.metaData.title ? player.metaData.title : '' + horizontalAlignment: Label.AlignHCenter + verticalAlignment: Label.AlignVCenter + } + Label { + id: artist + Layout.alignment: Layout.Center + text: player.metaData.author ? player.metaData.author : '' + horizontalAlignment: Label.AlignHCenter + verticalAlignment: Label.AlignVCenter + font.pixelSize: title.font.pixelSize * 0.6 + } + } + } + Slider { + id: slider + Layout.fillWidth: true + to: player.duration + Label { + id: position + anchors.left: parent.left + anchors.bottom: parent.top + font.pixelSize: 24 + text: player.time2str(player.position) + } + Label { + id: duration + anchors.right: parent.right + anchors.bottom: parent.top + font.pixelSize: 24 + text: player.time2str(player.duration) + } + onPressedChanged: player.seek(value) + } + RowLayout { + Layout.fillHeight: true + Item { Layout.fillWidth: true } + ImageButton { + offImage: './images/AGL_MediaPlayer_BackArrow.svg' + onClicked: playlist.previous() + } + ImageButton { + id: play + offImage: './images/AGL_MediaPlayer_Player_Play.svg' + onClicked: player.play() + states: [ + State { + when: player.playbackState === MediaPlayer.PlayingState + PropertyChanges { + target: play + offImage: './images/AGL_MediaPlayer_Player_Pause.svg' + onClicked: player.pause() + } + } + ] + } + ImageButton { + offImage: './images/AGL_MediaPlayer_ForwardArrow.svg' + onClicked: playlist.next() + } + + Item { Layout.fillWidth: true } + } + } + } + } + } + Item { + id: playlistArea + Layout.fillWidth: true + Layout.fillHeight: true + Layout.preferredHeight: 407 + ListView { + anchors.fill: parent + clip: true + header: Label { + x: 50 + text: 'PLAYLIST' + opacity: 0.5 + } + model: playlist + currentIndex: playlist.currentIndex + + delegate: MouseArea { + id: delegate + width: ListView.view.width + height: ListView.view.height / 4 + RowLayout { + anchors.fill: parent + anchors.leftMargin: 50 + anchors.rightMargin: 50 + ColumnLayout { + Layout.fillWidth: true + Label { + Layout.fillWidth: true + text: scanner.titles[model.source] ? scanner.titles[model.source] : model.source.toString().split('/').reverse()[0] + } + } + Label { + text: player.time2str(model.duration) + color: '#66FF99' + font.pixelSize: 32 + } + } + property var m: model + onClicked: { + playlist.currentIndex = model.index + player.play() + } + } + + highlight: Rectangle { + color: 'white' + opacity: 0.25 + } + } + } + } + + + function changeArea(area) { + if (area === 'normal') { + playlistArea.visible = true; + } else { + playlistArea.visible = false; + } + } +} |