From 669262fa107a2c43534a2e51a058fad2121143b2 Mon Sep 17 00:00:00 2001 From: Mohammed Sameer Date: Fri, 2 Aug 2013 07:55:05 +0300 Subject: [PATCH] Reworked CameraToolBar --- qml/CameraToolBar.js | 130 ++++++++++++++++++------------ qml/CameraToolBar.qml | 135 ++++++++++++++++++++------------ qml/CameraToolBarTools.qml | 38 +++++++++ qml/FlashButton.qml | 16 ++-- qml/ImageColorFilterButton.qml | 22 ++++-- qml/ImageEvCompButton.qml | 7 +- qml/ImageIsoButton.qml | 19 +++-- qml/ImageOverlay.qml | 31 +++++--- qml/ImageSceneButton.qml | 22 ++++-- qml/ImageWhiteBalanceButton.qml | 19 +++-- qml/MainPage.qml | 1 - qml/PostCaptureView.qml | 19 +++-- qml/VideoColorFilterButton.qml | 22 ++++-- qml/VideoEvCompButton.qml | 7 +- qml/VideoOverlay.qml | 29 ++++--- qml/VideoPlayerPage.qml | 10 ++- qml/VideoSceneButton.qml | 10 ++- qml/VideoWhiteBalanceButton.qml | 19 +++-- qml/qml.qrc | 1 + 19 files changed, 360 insertions(+), 197 deletions(-) create mode 100644 qml/CameraToolBarTools.qml diff --git a/qml/CameraToolBar.js b/qml/CameraToolBar.js index 8ecb835..36b716b 100644 --- a/qml/CameraToolBar.js +++ b/qml/CameraToolBar.js @@ -22,79 +22,111 @@ var stack = new Array(); -function push(items) { +function __push(tools) { if (stack.length >= 1) { hide(stack[stack.length - 1]); } - stack.push(items); + var container = createContainer(tools); + stack.push(container); - layout(); + return container; } -function pop() { - var items = stack[stack.length - 1]; - hide(items); - stack.pop(); - layout(); +function push(tools) { + var container = __push(tools); + return container.tools; } -function hide(items) { - var len = items.length; +function pop() { + if (stack.length == 0) { + return null; + } + + var container = stack.pop(); + hide(container); + destroyContainer(container); - for (var x = 0; x < len; x++) { - var item = items[x]; - item.visible = false; + if (stack.length == 0) { + return null; } + + container = stack[stack.length - 1]; + show(container); + + return container.tools; } -function show(items) { - var len = items.length; +function show(container) { + container.tools.width = dock.width; + container.tools.height = dock.height; + container.tools.visible = true; +} - var width = 0; - for (var x = 0; x < len; x++) { - width += items[x].width; - } +function hide(container) { + container.tools.visible = false; +} - var totalWidth = tools.width - width; - if (tools.hideBack) { - len -= 1; - } else { - totalWidth -= tools.menuWidth; - } +function createContainer(tools) { + var container = toolsContainer.createObject(dock); + container.tools = tools; + container.owner = tools.parent; + container.tools.parent = dock; - var spacing = totalWidth / len; + return container; +} - for (var x = 0; x < items.length; x++) { - var child = items[x]; +function destroyContainer(container) { + container.tools.parent = container.owner; + container.tools = null; + container.owner = null; + container.destroy(); +} - if (x != 0) { - var prev = items[x - 1]; - child.x = prev.x + prev.width + spacing; - } else if (tools.hideBack) { - child.x = 0; - } else { - child.x = spacing + 80; - } +function pushAndShow(tools) { + var container = __push(tools); + show(container); + return container.tools; +} - child.parent = tools; - child.visible = true; - child.y = 0; +function clear() { + while (stack.length > 0) { + pop(); } } -function layout() { - if (stack.length == 0) { - return; - } +function isEmpty() { + return stack.length == 0 ? true : false; +} + +function showLast() { + show(stack[stack.length - 1]) +} + +function hideLast() { + hide(stack[stack.length - 1]) +} - var items = stack[stack.length - 1]; - var len = items.length; +function calculateChildrenWidth(children) { + var totalWidth = 0; - if (!tools.expanded) { - hide(items); + for (var x = 0; x < children.length; x++) { + if (children[x].visible) { + totalWidth += children[x].width; + } } - else if (tools.width == tools.targetWidth) { - show(items); + + return totalWidth; +} + +function countVisibleChildren(children) { + var total = 0; + + for (var x = 0; x < children.length; x++) { + if (children[x].visible) { + ++total; + } } + + return total; } diff --git a/qml/CameraToolBar.qml b/qml/CameraToolBar.qml index 52b50ee..b53039b 100644 --- a/qml/CameraToolBar.qml +++ b/qml/CameraToolBar.qml @@ -24,78 +24,63 @@ import QtQuick 2.0 import "CameraToolBar.js" as Layout Rectangle { - id: tools - property bool expanded: false - property list items - property int targetWidth: parent.width - (2 * anchors.leftMargin) - property alias menuWidth: menu.width + id: toolBar + + property bool expanded: true + property real targetWidth: parent.width - anchors.leftMargin - anchors.rightMargin property bool manualBack: false property bool hideBack: false signal clicked - height: menu.height - width: expanded ? targetWidth : menu.width - color: expanded ? "black" : width == menu.width ? "transparent" : "black" - border.color: expanded ? "gray" : width == menu.width ? "transparent" : "gray" - radius: 20 + property CameraToolBarTools tools + property CameraToolBarTools __currentTools - Behavior on width { - PropertyAnimation { duration: 100 } + function push(tools) { + if (expanded) { + __currentTools = Layout.pushAndShow(tools) + } + else { + __currentTools = Layout.push(tools) + } } - CameraToolIcon { - property bool __isMenu: true - visible: !parent.hideBack - id: menu - anchors.verticalCenter: parent.verticalCenter - iconId: cameraTheme.cameraToolBarMenuIcon - onClicked: { - if (tools.manualBack) { - tools.clicked() - return - } - - if (!expanded) { - expanded = true - } else if (Layout.stack.length == 1) { - expanded = false - } else { - Layout.pop() - } - } + function pop() { + __currentTools = Layout.pop(); + } - anchors.left: parent.left - rotation: 180 + onToolsChanged: { + push(tools) } onExpandedChanged: { - if (tools.expanded) { - tools.push(tools.items) - } else { - tools.pop() + if (Layout.isEmpty()) { + return } - } - - onWidthChanged: Layout.layout() - onTargetWidthChanged: Layout.layout() - function push(items) { - return Layout.push(items) + if (expanded) { + Layout.showLast() + } + else { + Layout.hideLast() + } } - function pop() { - return Layout.pop() - } + Component.onDestruction: Layout.clear() + + width: expanded ? targetWidth : menu.width + height: menu.height + color: "black" + border.color: "gray" + radius: 20 - state: "collapsed" states: [ State { name: "expanded" - when: tools.expanded + when: expanded }, State { name: "collapsed" - when: !tools.expanded + when: !expanded } ] @@ -109,7 +94,7 @@ Rectangle { target: menu from: 0 to: 180 - duration: 500 + duration: 250 } }, Transition { @@ -120,8 +105,54 @@ Rectangle { target: menu from: 180 to: 360 - duration: 500 + duration: 250 } } ] + + Behavior on width { + PropertyAnimation { duration: 100 } + } + + CameraToolIcon { + visible: !parent.hideBack + id: menu + anchors.verticalCenter: parent.verticalCenter + iconId: cameraTheme.cameraToolBarMenuIcon + anchors.left: parent.left + anchors.top: parent.top + anchors.bottom: parent.bottom + + onClicked: { + if (parent.manualBack) { + parent.clicked() + } else if (!parent.expanded) { + parent.expanded = true + } else if (Layout.stack.length == 1) { + expanded = false + } else { + __currentTools = Layout.pop() + } + } + } + + Rectangle { + id: dock + property real menuWidth: parent.hideBack ? 0 : menu.width + property real leftMargin: (parent.width - __currentTools.childrenWidth - menuWidth) / __currentTools.childrenLen + color: "transparent" + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.right: parent.right + anchors.left: parent.hideBack ? parent.left : menu.right + anchors.leftMargin: parent.hideBack ? 0 : leftMargin + } + + Component { + id: toolsContainer + Item { + property Item tools + property Item owner + } + } } diff --git a/qml/CameraToolBarTools.qml b/qml/CameraToolBarTools.qml new file mode 100644 index 0000000..f6437bb --- /dev/null +++ b/qml/CameraToolBarTools.qml @@ -0,0 +1,38 @@ +// -*- qml -*- + +/*! + * This file is part of CameraPlus. + * + * Copyright (C) 2012-2013 Mohammed Sameer + * + * This library is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 2.1 of the License, or (at your option) any later version. + * + * This library is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public + * License along with this library; if not, write to the Free Software + * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA + */ + +import QtQuick 2.0 +import "CameraToolBar.js" as Layout + +Row { + visible: false + anchors.fill: parent + layoutDirection: Qt.LeftToRight + // We are explicitly setting a width here to prevent the item from dynamically + // calculating it based on spacing. + // If we don't do so then we get a binding loop problem between spacing and width + // the value doesn't affect anything else as CameraToolBar will fix it before it shows us + width: 0 + property real childrenWidth: Layout.calculateChildrenWidth(children) + property int childrenLen: Layout.countVisibleChildren(children) + spacing: (width - childrenWidth) / (childrenLen - 1) +} diff --git a/qml/FlashButton.qml b/qml/FlashButton.qml index a70c42e..8c504ec 100644 --- a/qml/FlashButton.qml +++ b/qml/FlashButton.qml @@ -29,31 +29,35 @@ CameraToolIcon { iconId: Data.flashIcon(settings.imageFlashMode) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("Flash") verticalAlignment: Text.AlignVCenter - }, + } + CheckButton { iconId: Data.flashIcon(Flash.Auto) onClicked: settings.imageFlashMode = Flash.Auto checked: settings.imageFlashMode == Flash.Auto - }, + } + CheckButton { iconId: Data.flashIcon(Flash.On) onClicked: settings.imageFlashMode = Flash.On checked: settings.imageFlashMode == Flash.On - }, + } + CheckButton { iconId: Data.flashIcon(Flash.Off) onClicked: settings.imageFlashMode = Flash.Off checked: settings.imageFlashMode == Flash.Off - }, + } + CheckButton { iconId: Data.flashIcon(Flash.RedEye) onClicked: settings.imageFlashMode = Flash.RedEye checked: settings.imageFlashMode == Flash.RedEye } - ] + } } diff --git a/qml/ImageColorFilterButton.qml b/qml/ImageColorFilterButton.qml index 49ba5fe..1013319 100644 --- a/qml/ImageColorFilterButton.qml +++ b/qml/ImageColorFilterButton.qml @@ -28,41 +28,47 @@ CameraToolIcon { id: button iconId: Data.cfIcon(settings.imageColorFilter) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("Filter") verticalAlignment: Text.AlignVCenter - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Normal) onClicked: settings.imageColorFilter = ColorTone.Normal checked: settings.imageColorFilter == ColorTone.Normal - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.GrayScale) onClicked: settings.imageColorFilter = ColorTone.GrayScale checked: settings.imageColorFilter == ColorTone.GrayScale - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Sepia) onClicked: settings.imageColorFilter = ColorTone.Sepia checked: settings.imageColorFilter == ColorTone.Sepia - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Vivid) onClicked: settings.imageColorFilter = ColorTone.Vivid checked: settings.imageColorFilter == ColorTone.Vivid - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Negative) onClicked: settings.imageColorFilter = ColorTone.Negative checked: settings.imageColorFilter == ColorTone.Negative - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Solarize) onClicked: settings.imageColorFilter = ColorTone.Solarize checked: settings.imageColorFilter == ColorTone.Solarize } - ] + } } diff --git a/qml/ImageEvCompButton.qml b/qml/ImageEvCompButton.qml index 0f6ba56..5fb254e 100644 --- a/qml/ImageEvCompButton.qml +++ b/qml/ImageEvCompButton.qml @@ -35,12 +35,13 @@ CameraToolIcon { text: settings.imageEvComp == 0 ? "" : settings.imageEvComp.toFixed(1) } - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("EV") verticalAlignment: Text.AlignVCenter - }, + } + CameraSlider { id: slider width: 500 @@ -53,5 +54,5 @@ CameraToolIcon { onValueChanged: settings.imageEvComp = value.toFixed(1) Component.onCompleted: { slider.value = settings.imageEvComp.toFixed(1) } } - ] + } } diff --git a/qml/ImageIsoButton.qml b/qml/ImageIsoButton.qml index 3c34a62..0c79075 100644 --- a/qml/ImageIsoButton.qml +++ b/qml/ImageIsoButton.qml @@ -29,12 +29,13 @@ CameraToolIcon { iconId: Data.isoIcon(settings.imageIso) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("ISO") verticalAlignment: Text.AlignVCenter - }, + } + CameraButton { property int value: 0 onClicked: settings.imageIso = value @@ -42,7 +43,8 @@ CameraToolIcon { width: 100 checked: settings.imageIso == value anchors.verticalCenter: parent ? parent.verticalCenter : undefined - }, + } + CameraButton { property int value: 100 onClicked: settings.imageIso = value @@ -50,7 +52,8 @@ CameraToolIcon { width: 100 checked: settings.imageIso == value anchors.verticalCenter: parent ? parent.verticalCenter : undefined - }, + } + CameraButton { property int value: 200 onClicked: settings.imageIso = value @@ -58,7 +61,8 @@ CameraToolIcon { width: 100 checked: settings.imageIso == value anchors.verticalCenter: parent ? parent.verticalCenter : undefined - }, + } + CameraButton { property int value: 400 onClicked: settings.imageIso = value @@ -66,7 +70,8 @@ CameraToolIcon { width: 100 checked: settings.imageIso == value anchors.verticalCenter: parent ? parent.verticalCenter : undefined - }, + } + CameraButton { property int value: 800 onClicked: settings.imageIso = value @@ -75,5 +80,5 @@ CameraToolIcon { checked: settings.imageIso == value anchors.verticalCenter: parent ? parent.verticalCenter : undefined } - ] + } } diff --git a/qml/ImageOverlay.qml b/qml/ImageOverlay.qml index fe01b37..377bd19 100644 --- a/qml/ImageOverlay.qml +++ b/qml/ImageOverlay.qml @@ -126,26 +126,31 @@ Item { visible: controlsVisible expanded: settings.showToolBar onExpandedChanged: settings.showToolBar = expanded - items: [ + tools: CameraToolBarTools { FlashButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + ImageSceneButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + ImageEvCompButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + ImageWhiteBalanceButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + ImageColorFilterButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + ImageIsoButton { - onClicked: toolBar.push(items) + onClicked: toolBar.push(tools) } - ] + } } Rectangle { diff --git a/qml/ImageSceneButton.qml b/qml/ImageSceneButton.qml index 7321a0c..92c41fc 100644 --- a/qml/ImageSceneButton.qml +++ b/qml/ImageSceneButton.qml @@ -29,41 +29,47 @@ CameraToolIcon { iconId: Data.ismIcon(settings.imageSceneMode) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("Scene") verticalAlignment: Text.AlignVCenter - }, + } + CheckButton { iconId: Data.ismIcon(Scene.Auto) onClicked: settings.imageSceneMode = Scene.Auto checked: settings.imageSceneMode == Scene.Auto - }, + } + CheckButton { iconId: Data.ismIcon(Scene.Closeup) onClicked: settings.imageSceneMode = Scene.Closeup checked: settings.imageSceneMode == Scene.Closeup - }, + } + CheckButton { iconId: Data.ismIcon(Scene.Landscape) onClicked: settings.imageSceneMode = Scene.Landscape checked: settings.imageSceneMode == Scene.Landscape - }, + } + CheckButton { iconId: Data.ismIcon(Scene.Portrait) onClicked: settings.imageSceneMode = Scene.Portrait checked: settings.imageSceneMode == Scene.Portrait - }, + } + CheckButton { iconId: Data.ismIcon(Scene.Night) onClicked: settings.imageSceneMode = Scene.Night checked: settings.imageSceneMode == Scene.Night - }, + } + CheckButton { iconId: Data.ismIcon(Scene.Sport) onClicked: settings.imageSceneMode = Scene.Sport checked: settings.imageSceneMode == Scene.Sport } - ] + } } diff --git a/qml/ImageWhiteBalanceButton.qml b/qml/ImageWhiteBalanceButton.qml index e02228c..8c98279 100644 --- a/qml/ImageWhiteBalanceButton.qml +++ b/qml/ImageWhiteBalanceButton.qml @@ -29,36 +29,41 @@ CameraToolIcon { iconId: Data.wbIcon(settings.imageWhiteBalance) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("WB") verticalAlignment: Text.AlignVCenter - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Auto) onClicked: settings.imageWhiteBalance = WhiteBalance.Auto checked: settings.imageWhiteBalance == WhiteBalance.Auto - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Sunset) onClicked: settings.imageWhiteBalance = WhiteBalance.Sunset checked: settings.imageWhiteBalance == WhiteBalance.Sunset - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Cloudy) onClicked: settings.imageWhiteBalance = WhiteBalance.Cloudy checked: settings.imageWhiteBalance == WhiteBalance.Cloudy - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Flourescent) onClicked: settings.imageWhiteBalance = WhiteBalance.Flourescent checked: settings.imageWhiteBalance == WhiteBalance.Flourescent - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Tungsten) onClicked: settings.imageWhiteBalance = WhiteBalance.Tungsten checked: settings.imageWhiteBalance == WhiteBalance.Tungsten } - ] + } } diff --git a/qml/MainPage.qml b/qml/MainPage.qml index 93bb516..5598c0b 100644 --- a/qml/MainPage.qml +++ b/qml/MainPage.qml @@ -26,7 +26,6 @@ import CameraPlus 1.0 // TODO: flash not ready (battery low or flash not ready message) // TODO: rotate post capture image -// TODO: hide items for CameraToolBar // TODO: front camera CameraPage { diff --git a/qml/PostCaptureView.qml b/qml/PostCaptureView.qml index 603798b..b3d6062 100644 --- a/qml/PostCaptureView.qml +++ b/qml/PostCaptureView.qml @@ -24,7 +24,11 @@ import QtQuick 2.0 import CameraPlus 1.0 import QtCamera 1.0 +// TODO: qrc:/qml/PostCaptureView.qml:104:5: QML CameraToolBar: Binding loop detected for property "height" +// TODO: hide toolbar as soon as we start playback Item { + id: postCaptureView + property Camera camera: null property bool pressed: view.currentItem ? view.currentItem.playing : false property int policyMode: view.currentItem && view.currentItem.playing ? @@ -107,6 +111,8 @@ Item { anchors.bottomMargin: show ? 20 : -1 * (height + 20) anchors.left: parent.left anchors.leftMargin: 20 + anchors.right: parent.right + anchors.rightMargin: 20 opacity: 0.8 property bool show: deleteDialog.isOpen || deleteDialog.isOpening || @@ -117,28 +123,31 @@ Item { PropertyAnimation { duration: 200; } } - items: [ + tools: CameraToolBarTools { CameraToolIcon { iconId: !available ? cameraTheme.favoriteDisabledIconId : view.currentItem.itemData.favorite ? cameraTheme.favoriteMarkIconId : cameraTheme.favoriteUnmarkIconId onClicked: { addOrRemoveFavorite() restartTimer() } - }, + } + CameraToolIcon { iconId: available ? cameraTheme.shareEnabledIconId : cameraTheme.shareDisabledIconId onClicked: { shareCurrentItem() restartTimer() } - }, + } + CameraToolIcon { iconId: available ? cameraTheme.deleteEnabledIconId : cameraTheme.deleteDisabledIconId onClicked: { deleteCurrentItem() restartTimer() } - }, + } + CameraToolIcon { iconId: cameraTheme.menuIconId onClicked: { @@ -146,7 +155,7 @@ Item { restartTimer() } } - ] + } } CameraQueryDialog { diff --git a/qml/VideoColorFilterButton.qml b/qml/VideoColorFilterButton.qml index bd13b5f..284caaa 100644 --- a/qml/VideoColorFilterButton.qml +++ b/qml/VideoColorFilterButton.qml @@ -29,41 +29,47 @@ CameraToolIcon { iconId: Data.cfIcon(settings.videoColorFilter) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("Filter") verticalAlignment: Text.AlignVCenter - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Normal) onClicked: settings.videoColorFilter = ColorTone.Normal checked: settings.videoColorFilter == ColorTone.Normal - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.GrayScale) onClicked: settings.videoColorFilter = ColorTone.GrayScale checked: settings.videoColorFilter == ColorTone.GrayScale - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Sepia) onClicked: settings.videoColorFilter = ColorTone.Sepia checked: settings.videoColorFilter == ColorTone.Sepia - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Vivid) onClicked: settings.videoColorFilter = ColorTone.Vivid checked: settings.videoColorFilter == ColorTone.Vivid - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Negative) onClicked: settings.videoColorFilter = ColorTone.Negative checked: settings.videoColorFilter == ColorTone.Negative - }, + } + CheckButton { iconId: Data.cfIcon(ColorTone.Solarize) onClicked: settings.videoColorFilter = ColorTone.Solarize checked: settings.videoColorFilter == ColorTone.Solarize } - ] + } } diff --git a/qml/VideoEvCompButton.qml b/qml/VideoEvCompButton.qml index 50cdaeb..d2ab04e 100644 --- a/qml/VideoEvCompButton.qml +++ b/qml/VideoEvCompButton.qml @@ -35,12 +35,13 @@ CameraToolIcon { text: settings.videoEvComp == 0 ? "" : settings.videoEvComp.toFixed(1) } - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("EV") verticalAlignment: Text.AlignVCenter - }, + } + CameraSlider { id: slider width: 500 @@ -53,5 +54,5 @@ CameraToolIcon { onValueChanged: settings.videoEvComp = value.toFixed(1) Component.onCompleted: { slider.value = settings.videoEvComp.toFixed(1) } } - ] + } } diff --git a/qml/VideoOverlay.qml b/qml/VideoOverlay.qml index b8274e9..c66c60f 100644 --- a/qml/VideoOverlay.qml +++ b/qml/VideoOverlay.qml @@ -102,26 +102,31 @@ Item { expanded: settings.showToolBar onExpandedChanged: settings.showToolBar = expanded; - items: [ + tools: CameraToolBarTools { VideoTorchButton { camera: cam - }, + } + VideoSceneButton { -// TODO: hide when recording - onClicked: toolBar.push(items) - }, + visible: !overlay.recording + onClicked: toolBar.push(tools) + } + VideoEvCompButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + VideoWhiteBalanceButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + VideoColorFilterButton { - onClicked: toolBar.push(items) - }, + onClicked: toolBar.push(tools) + } + VideoMuteButton { } - ] + } } Rectangle { diff --git a/qml/VideoPlayerPage.qml b/qml/VideoPlayerPage.qml index 41d947f..8235b82 100644 --- a/qml/VideoPlayerPage.qml +++ b/qml/VideoPlayerPage.qml @@ -103,11 +103,12 @@ Item { PropertyAnimation { duration: 200; } } - items: [ + tools: CameraToolBarTools { CameraToolIcon { iconId: cameraTheme.videoStopIconId onClicked: video.stop() - }, + } + CameraSlider { id: slider height: toolBar.height @@ -128,7 +129,8 @@ Item { hideTimer.restart() } - }, + } + CameraToolIcon { id: control iconId: video.state != VideoPlayer.StatePaused ? cameraTheme.videoPauseIconId : cameraTheme.videoPlayIconId @@ -137,6 +139,6 @@ Item { hideTimer.restart() } } - ] + } } } diff --git a/qml/VideoSceneButton.qml b/qml/VideoSceneButton.qml index d3b63b7..119be51 100644 --- a/qml/VideoSceneButton.qml +++ b/qml/VideoSceneButton.qml @@ -29,21 +29,23 @@ CameraToolIcon { iconId: Data.vsmIcon(settings.videoSceneMode) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("Scene") verticalAlignment: Text.AlignVCenter - }, + } + CheckButton { iconId: Data.vsmIcon(Scene.Auto) onClicked: settings.videoSceneMode = Scene.Auto checked: settings.videoSceneMode == Scene.Auto - }, + } + CheckButton { iconId: Data.vsmIcon(Scene.Night) onClicked: settings.videoSceneMode = Scene.Night checked: settings.videoSceneMode == Scene.Night } - ] + } } diff --git a/qml/VideoWhiteBalanceButton.qml b/qml/VideoWhiteBalanceButton.qml index d7c49e4..a8003e4 100644 --- a/qml/VideoWhiteBalanceButton.qml +++ b/qml/VideoWhiteBalanceButton.qml @@ -29,36 +29,41 @@ CameraToolIcon { iconId: Data.wbIcon(settings.videoWhiteBalance) - property list items: [ + property CameraToolBarTools tools: CameraToolBarTools { CameraLabel { height: parent ? parent.height : 0 text: qsTr("WB") verticalAlignment: Text.AlignVCenter - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Auto) onClicked: settings.videoWhiteBalance = WhiteBalance.Auto checked: settings.videoWhiteBalance == WhiteBalance.Auto - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Sunset) onClicked: settings.videoWhiteBalance = WhiteBalance.Sunset checked: settings.videoWhiteBalance == WhiteBalance.Sunset - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Cloudy) onClicked: settings.videoWhiteBalance = WhiteBalance.Cloudy checked: settings.videoWhiteBalance == WhiteBalance.Cloudy - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Flourescent) onClicked: settings.videoWhiteBalance = WhiteBalance.Flourescent checked: settings.videoWhiteBalance == WhiteBalance.Flourescent - }, + } + CheckButton { iconId: Data.wbIcon(WhiteBalance.Tungsten) onClicked: settings.videoWhiteBalance = WhiteBalance.Tungsten checked: settings.videoWhiteBalance == WhiteBalance.Tungsten } - ] + } } diff --git a/qml/qml.qrc b/qml/qml.qrc index 9645bef..7bf24d2 100644 --- a/qml/qml.qrc +++ b/qml/qml.qrc @@ -4,6 +4,7 @@ CameraSettings.qml CameraToolBar.js CameraToolBar.qml + CameraToolBarTools.qml CameraView.qml CaptureButton.qml CheckButton.qml -- 2.25.1