More work on image settings page. Now color filter and white balance are fine
authorMohammed Sameer <msameer@foolab.org>
Thu, 6 Sep 2012 11:29:29 +0000 (14:29 +0300)
committerMohammed Sameer <msameer@foolab.org>
Thu, 6 Sep 2012 11:29:29 +0000 (14:29 +0300)
qml/ColorToneButton.qml [deleted file]
qml/ImageColorFilterPage.qml [new file with mode: 0644]
qml/ImageSettingsPage.qml
qml/ImageWhiteBalancePage.qml [new file with mode: 0644]
qml/SectionHeader.qml [new file with mode: 0644]
qml/WhiteBalanceButton.qml [deleted file]

diff --git a/qml/ColorToneButton.qml b/qml/ColorToneButton.qml
deleted file mode 100644 (file)
index b917153..0000000
+++ /dev/null
@@ -1,94 +0,0 @@
-// -*- qml -*-
-import QtQuick 1.1
-import com.nokia.meego 1.1
-import QtCamera 1.0
-
-
-Selector {
-        id: button
-
-        property alias value: ct.value
-
-        timerConstraints: true // Never trigger
-
-        iconSource: ctIcon(ct.value);
-
-        title: qsTr("Color filter");
-
-        ColorTone {
-                id: ct
-                camera: cam
-                // TODO: hardcoding
-                value: ColorTone.Normal
-        }
-
-        function ctIcon(val) {
-                var x = row.children.length;
-                var i = 0;
-                for (i = 0; i < x; i++) {
-                        if (row.children[i].value == val) {
-                                return row.children[i].normalIcon;
-                        }
-                }
-        }
-
-        widget: Row {
-                id: row
-                height: button.checked ? 64 : 0
-                width: button.checked ? (children.length * height) +  (children.length - 1) * spacing : 0
-                spacing: 10
-
-                Behavior on width {
-                        // TODO: seems animation is not working
-                        PropertyAnimation { duration: 250; }
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-no-filter"
-                        checkedIcon: "image://theme/icon-m-camera-no-filter-selected"
-                        controller: ct
-                        value: ColorTone.Normal
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-filter-black-white"
-                        checkedIcon: "image://theme/icon-m-camera-filter-black-white-selected"
-                        controller: ct
-                        value: ColorTone.GrayScale
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-filter-sepia"
-                        checkedIcon: "image://theme/icon-m-camera-filter-sepia-selected"
-                        controller: ct
-                        value: ColorTone.Sepia
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-filter-vivid"
-                        checkedIcon: "image://theme/icon-m-camera-filter-vivid-selected"
-                        controller: ct
-                        value: ColorTone.Vivid
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-filter-negative"
-                        checkedIcon: "image://theme/icon-m-camera-filter-negative-selected"
-                        controller: ct
-                        value: ColorTone.Negative
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-filter-solarize"
-                        checkedIcon: "image://theme/icon-m-camera-filter-solarize-selected"
-                        controller: ct
-                        value: ColorTone.Solarize
-                        doClose: false
-                }
-        }
-}
diff --git a/qml/ImageColorFilterPage.qml b/qml/ImageColorFilterPage.qml
new file mode 100644 (file)
index 0000000..bfcd338
--- /dev/null
@@ -0,0 +1,103 @@
+// -*- qml -*-
+import QtQuick 1.1
+import com.nokia.meego 1.1
+import QtCamera 1.0
+
+Page {
+        id: page
+        property Camera cam: null
+
+        Rectangle {
+                color: "black"
+                width: parent.width
+                height: row.height + title.height + 30
+                anchors.bottom: toolBar.top
+                opacity: 0.5
+
+                SectionHeader {
+                        id: title
+                        anchors.top: parent.top
+                        anchors.topMargin: 10
+                        text: qsTr("Color filter");
+                }
+
+                Row {
+                        id: row
+                        anchors.left: parent.left
+                        anchors.right: parent.right
+                        anchors.leftMargin: 20
+                        anchors.rightMargin: 20
+                        anchors.top: title.bottom
+                        anchors.topMargin: 10
+
+                        IconButton {
+                                width: parent.width / 6
+                                normalIcon: "image://theme/icon-m-camera-no-filter"
+                                checkedIcon: "image://theme/icon-m-camera-no-filter-selected"
+                                value: ColorTone.Normal
+                                savedValue: settings.imageColorFilter
+                                onClicked: settings.imageColorFilter = value;
+                                text: qsTr("Off");
+                        }
+
+                        IconButton {
+                                width: parent.width / 6
+                                normalIcon: "image://theme/icon-m-camera-filter-black-white"
+                                checkedIcon: "image://theme/icon-m-camera-filter-black-white-selected"
+                                value: ColorTone.GrayScale
+                                savedValue: settings.imageColorFilter
+                                onClicked: settings.imageColorFilter = value;
+                                text: qsTr("Black & white");
+                        }
+
+                        IconButton {
+                                width: parent.width / 6
+                                normalIcon: "image://theme/icon-m-camera-filter-sepia"
+                                checkedIcon: "image://theme/icon-m-camera-filter-sepia-selected"
+                                value: ColorTone.Sepia
+                                savedValue: settings.imageColorFilter
+                                onClicked: settings.imageColorFilter = value;
+                                text: qsTr("Sepia");
+                        }
+
+                        IconButton {
+                                width: parent.width / 6
+                                normalIcon: "image://theme/icon-m-camera-filter-vivid"
+                                checkedIcon: "image://theme/icon-m-camera-filter-vivid-selected"
+                                value: ColorTone.Vivid
+                                savedValue: settings.imageColorFilter
+                                onClicked: settings.imageColorFilter = value;
+                                text: qsTr("Vivid");
+                        }
+
+                        IconButton {
+                                width: parent.width / 6
+                                normalIcon: "image://theme/icon-m-camera-filter-negative"
+                                checkedIcon: "image://theme/icon-m-camera-filter-negative-selected"
+                                value: ColorTone.Negative
+                                savedValue: settings.imageColorFilter
+                                onClicked: settings.imageColorFilter = value;
+                                text: qsTr("Negative");
+                        }
+
+                        IconButton {
+                                width: parent.width / 6
+                                normalIcon: "image://theme/icon-m-camera-filter-solarize"
+                                checkedIcon: "image://theme/icon-m-camera-filter-solarize-selected"
+                                value: ColorTone.Solarize
+                                savedValue: settings.imageColorFilter
+                                onClicked: settings.imageColorFilter = value;
+                                text: qsTr("Solarize");
+                        }
+                }
+        }
+
+        ToolBar {
+                id: toolBar
+                anchors.bottom: parent.bottom
+                tools: ToolBarLayout {
+                        id: layout
+                        ToolIcon { iconId: "icon-m-toolbar-back"; onClicked: pageStack.pop(); }
+                }
+        }
+}
index 0392a81..efa425a 100644 (file)
@@ -5,42 +5,96 @@ import QtCamera 1.0
 
 Page {
         id: page
+        property Camera cam: null
 
-        // TODO:
+        property variant __wb: [
+        [WhiteBalance.Auto, qsTr("Automatic"), "icon-m-camera-whitebalance-auto-selected"],
+        [WhiteBalance.Sunset, qsTr("Sunny"), "icon-m-camera-whitebalance-sunny-selected"],
+        [WhiteBalance.Cloudy, qsTr("Cloudy"), "icon-m-camera-whitebalance-cloudy-selected"],        [WhiteBalance.Flourescent, qsTr("Flourescent"), "icon-m-camera-whitebalance-fluorescent-selected"],
+        [WhiteBalance.Tungsten, qsTr("Tungsten"), "icon-m-camera-whitebalance-tungsten-selected"],
+        ]
+
+        property variant __cf: [
+        [ColorTone.Normal, qsTr("Off"), "icon-m-camera-no-filter-selected"],
+        [ColorTone.GrayScale, qsTr("Black & white"), "icon-m-camera-filter-black-white-selected"],
+        [ColorTone.Sepia, qsTr("Sepia"), "icon-m-camera-filter-sepia-selected"],
+        [ColorTone.Vivid, qsTr("Vivid"), "icon-m-camera-filter-vivid-selected"],
+        [ColorTone.Negative, qsTr("Negative"), "icon-m-camera-filter-negative-selected"],
+        [ColorTone.Solarize, qsTr("Solarize"), "icon-m-camera-filter-solarize-selected"]
+        ]
+
+        function filterData(val, data, item) {
+                var x = 0;
+                var i = data.length;
+                for (x = 0; x < i; x++) {
+                        if (data[x][0] == val) {
+                                return data[x][item];
+                        }
+                }
+        }
+
+        function wbIcon(wb) {
+                return filterData(wb, __wb, 2);
+        }
+
+        function wbName(wb) {
+                return filterData(wb, __wb, 1);
+        }
+
+        function cfIcon(cf) {
+                return filterData(cf, __cf, 2);
+        }
+
+        function cfName(cf) {
+                return filterData(cf, __cf, 1);
+        }
+
+        Rectangle {
+                color: "black"
+                anchors.fill: parent
+        }
 
         Flickable {
-                id: flick
                 anchors.top: parent.top
                 anchors.left: parent.left
                 anchors.right: parent.right
                 anchors.bottom: toolBar.top
 
-                WhiteBalanceButton {
-                        id: wb
-                        anchors.top: parent.top
-                        anchors.left: parent.left
-                        anchors.topMargin: 20
-                        anchors.leftMargin: 20
-                }
+                Column {
+                        width: parent.width
 
-                ColorToneButton {
-                        id: ct
-                        anchors.top: wb.bottom
-                        anchors.left: parent.left
-                        anchors.topMargin: 20
-                        anchors.leftMargin: 20
+                        Label {
+                                // TODO:
+                                text: qsTr("Image settings");
+                        }
+
+                        Row {
+                                width: parent.width
+
+                                ListItem {
+                                        id: wb
+                                        width: parent.width / 2
+                                        title: qsTr("White balance");
+                                        subtitle: wbName(settings.imageWhiteBalance);
+                                        iconId: wbIcon(settings.imageWhiteBalance);
+                                        onClicked: openFile("ImageWhiteBalancePage.qml");
+                                }
+
+                                ListItem {
+                                        id: cf
+                                        width: parent.width / 2
+                                        title: qsTr("Color filter");
+                                        subtitle: cfName(settings.imageColorFilter);
+                                        iconId: cfIcon(settings.imageColorFilter);
+                                        onClicked: openFile("ImageColorFilterPage.qml");
+                                }
+                        }
                 }
         }
 
         ToolBar {
                 id: toolBar
                 anchors.bottom: parent.bottom
-                // TODO: transparent ?
-//                height: layout.height
-//                platformStyle: ToolBarStyle {
-//                        background: ""
-//                }
-
                 tools: ToolBarLayout {
                         id: layout
                         ToolIcon { iconId: "icon-m-toolbar-back"; onClicked: pageStack.pop(); }
diff --git a/qml/ImageWhiteBalancePage.qml b/qml/ImageWhiteBalancePage.qml
new file mode 100644 (file)
index 0000000..c026b99
--- /dev/null
@@ -0,0 +1,94 @@
+// -*- qml -*-
+import QtQuick 1.1
+import com.nokia.meego 1.1
+import QtCamera 1.0
+
+Page {
+        id: page
+        property Camera cam: null
+
+        Rectangle {
+                color: "black"
+                width: parent.width
+                height: row.height + title.height + 30
+                anchors.bottom: toolBar.top
+                opacity: 0.5
+
+                SectionHeader {
+                        id: title
+                        anchors.top: parent.top
+                        anchors.topMargin: 10
+                        text: qsTr("White balance");
+                }
+
+                Row {
+                        id: row
+                        anchors.left: parent.left
+                        anchors.right: parent.right
+                        anchors.leftMargin: 20
+                        anchors.rightMargin: 20
+                        anchors.top: title.bottom
+                        anchors.topMargin: 10
+
+
+                        IconButton {
+                                width: parent.width / 5
+                                normalIcon: "image://theme/icon-m-camera-whitebalance-auto"
+                                checkedIcon: "image://theme/icon-m-camera-whitebalance-auto-selected"
+                                value: WhiteBalance.Auto
+                                savedValue: settings.imageWhiteBalance
+                                onClicked: settings.imageWhiteBalance = value;
+                                text: qsTr("Automatic");
+                        }
+
+                        IconButton {
+                                width: parent.width / 5
+                                normalIcon: "image://theme/icon-m-camera-whitebalance-sunny"
+                                checkedIcon: "image://theme/icon-m-camera-whitebalance-sunny-selected"
+                                value: WhiteBalance.Sunset
+                                savedValue: settings.imageWhiteBalance
+                                onClicked: settings.imageWhiteBalance = value;
+                                text: qsTr("Sunset");
+                        }
+
+                        IconButton {
+                                width: parent.width / 5
+                                normalIcon: "image://theme/icon-m-camera-whitebalance-cloudy"
+                                checkedIcon: "image://theme/icon-m-camera-whitebalance-cloudy-selected"
+                                value: WhiteBalance.Cloudy
+                                savedValue: settings.imageWhiteBalance
+                                onClicked: settings.imageWhiteBalance = value;
+                                text: qsTr("Cloudy");
+                        }
+
+                        IconButton {
+                                width: parent.width / 5
+                                normalIcon: "image://theme/icon-m-camera-whitebalance-fluorescent"
+                                checkedIcon: "image://theme/icon-m-camera-whitebalance-fluorescent-selected"
+                                value: WhiteBalance.Flourescent
+                                savedValue: settings.imageWhiteBalance
+                                onClicked: settings.imageWhiteBalance = value;
+                                text: qsTr("Flourescent");
+                        }
+
+                        IconButton {
+                                width: parent.width / 5
+                                normalIcon: "image://theme/icon-m-camera-whitebalance-tungsten"
+                                checkedIcon: "image://theme/icon-m-camera-whitebalance-tungsten-selected"
+                                value: WhiteBalance.Tungsten
+                                savedValue: settings.imageWhiteBalance
+                                onClicked: settings.imageWhiteBalance = value;
+                                text: qsTr("Tungsten");
+                        }
+                }
+        }
+
+        ToolBar {
+                id: toolBar
+                anchors.bottom: parent.bottom
+                tools: ToolBarLayout {
+                        id: layout
+                        ToolIcon { iconId: "icon-m-toolbar-back"; onClicked: pageStack.pop(); }
+                }
+        }
+}
diff --git a/qml/SectionHeader.qml b/qml/SectionHeader.qml
new file mode 100644 (file)
index 0000000..8933a12
--- /dev/null
@@ -0,0 +1,27 @@
+// -*- qml -*-
+import QtQuick 1.1
+import com.nokia.meego 1.1
+
+Row {
+        id: root
+
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.leftMargin: 10
+        anchors.rightMargin: 10
+        spacing: 10
+
+        property alias text: label.text
+
+        Label {
+                id: label
+                verticalAlignment: Text.AlignVCenter
+        }
+
+        Rectangle {
+                color: "darkgray"
+                height: 2
+                width: parent.width - label.width - 20
+                anchors.verticalCenter: parent.verticalCenter
+        }
+}
diff --git a/qml/WhiteBalanceButton.qml b/qml/WhiteBalanceButton.qml
deleted file mode 100644 (file)
index bdd167d..0000000
+++ /dev/null
@@ -1,86 +0,0 @@
-// -*- qml -*-
-import QtQuick 1.1
-import com.nokia.meego 1.1
-import QtCamera 1.0
-
-Selector {
-        id: button
-
-        property alias value: wb.value
-
-        timerConstraints: true // Never trigger
-
-        iconSource: wbIcon(wb.value);
-
-        title: qsTr("White balance mode");
-
-        WhiteBalance {
-                id: wb
-                camera: cam
-                // TODO: hardcoding
-                value: WhiteBalance.Auto
-        }
-
-        function wbIcon(val) {
-                var x = row.children.length;
-                var i = 0;
-                for (i = 0; i < x; i++) {
-                        if (row.children[i].value == val) {
-                                return row.children[i].normalIcon;
-                        }
-                }
-        }
-
-        widget: Row {
-                id: row
-                height: button.checked ? 64 : 0
-                width: button.checked ? (children.length * height) +  (children.length - 1) * spacing : 0
-                spacing: 10
-
-                Behavior on width {
-                        // TODO: seems animation is not working
-                        PropertyAnimation { duration: 250; }
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-whitebalance-auto"
-                        checkedIcon: "image://theme/icon-m-camera-whitebalance-auto-selected"
-                        controller: wb
-                        value: WhiteBalance.Auto
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-whitebalance-cloudy"
-                        checkedIcon: "image://theme/icon-m-camera-whitebalance-cloudy-selected"
-                        controller: wb
-                        value: WhiteBalance.Cloudy
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-whitebalance-sunny"
-                        checkedIcon: "image://theme/icon-m-camera-whitebalance-sunny-selected"
-                        controller: wb
-                        value: WhiteBalance.Sunset
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-whitebalance-tungsten"
-                        checkedIcon: "image://theme/icon-m-camera-whitebalance-tungsten-selected"
-                        controller: wb
-                        value: WhiteBalance.Tungsten
-                        doClose: false
-                }
-
-                CheckButton {
-                        normalIcon: "image://theme/icon-m-camera-whitebalance-fluorescent"
-                        checkedIcon: "image://theme/icon-m-camera-whitebalance-fluorescent-selected"
-                        controller: wb
-                        value: WhiteBalance.Flourescent
-                        doClose: false
-                }
-
-        }
-}