Started moving visuals definitions out of the generic files

Merge-request: 1 Reviewed-by: Jens Bache-Wiig <[email protected]>
jfaust · Oct 25, 2010 · 6d19c78 · 6d19c78
1 parent 654ea2c
commit 6d19c78
Show file tree

Hide file tree

Showing 12 changed files with 437 additions and 163 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,95 @@
+# This file is used to ignore files which are generated in the Qt build system
+# ----------------------------------------------------------------------------
+
+
+callgrind.out.*
+pcviewer.cfg
+*~
+*.a
+*.la
+*.core
+*.moc
+*.o
+*.obj
+*.orig
+*.swp
+*.rej
+*.so
+*.pbxuser
+*.mode1
+*.mode1v3
+*_pch.h.cpp
+*_resource.rc
+.#*
+*.*#
+.qmake.cache
+.qmake.vars
+*.prl
+tags
+.DS_Store
+*.debug
+Makefile*
+*.prl
+*.app
+*.pro.user
+*.qmlproject.user*
+moc_*.cpp
+ui_*.h
+qrc_*.cpp
+
+# xemacs temporary files
+*.flc
+
+# Vim temporary files
+.*.swp
+
+# Visual Studio generated files
+*.ib_pdb_index
+*.idb
+*.ilk
+*.pdb
+*.sln
+*.suo
+*.vcproj
+*vcproj.*.*.user
+*.ncb
+
+# MinGW generated files
+*.Debug
+*.Release
+
+.pch
+.rcc
+
+# Symbian build system generated files
+# ---------------------
+
+ABLD.BAT
+bld.inf
+*.mmp
+*.mk
+*.rss
+*.loc
+!s60main.rss
+*.pkg
+plugin_commonU.def
+*.qtplugin
+*.sis
+*.sisx
+
+# Generated by abldfast.bat from devtools.
+.abldsteps.*
+
+# Carbide project files
+# ---------------------
+.project
+.cproject
+.make.cache
+
+qtc-debugging-helper
+
+#svn file
+*/.svn/*
+
+# linux shared libraries
+*.so*
diff --git a/Button.qml b/Button.qml
@@ -1,110 +1,42 @@
 import Qt 4.7
+import "./behaviors"
+import "./styles/default" as DefaultStyles
 
 Item {
-    id:button
+    id: button
 
-    width: Math.max(100, labelComponent.item.width + 2*10)
-    height: Math.max(32, labelComponent.item.height + 2*4)
+    width: contentComponent.item.width
+    height: contentComponent.item.height
 
-    clip:true
     signal clicked
-
-    property alias hover: mousearea.containsMouse
-    property bool pressed: false
-    property bool checkable: false
-    property bool checked: false
-
-    property Component background : defaultbackground
-    property Component content : defaultlabel
+    property alias pressed: behavior.pressed
+    property alias checkable: behavior.checkable  // button toggles between checked and !checked
+    property alias checked: behavior.checked
 
     property string text
-    property string icon
-
-    property color backgroundColor: "#fff";
-    property color foregroundColor: "#333";
+    property url icon
 
-    property alias font: fontcontainer.font
-
-    Text {id:fontcontainer; font.pixelSize:14} // Workaround since font is not a declarable type (bug?)
-
-    // background
-    Loader {
-        id:backgroundComponent
-        anchors.fill:parent
-        sourceComponent:background
-        opacity: enabled ? 1 : 0.8
-    }
+    property Component background: defaultStyle.background
+    property Component content: defaultStyle.content
 
-    // content
-    Loader {
-        id:labelComponent
-        anchors.centerIn: parent
-        sourceComponent:content
-    }
+    property color backgroundColor: "#fff";
+    property color foregroundColor: "#222";
 
-    MouseArea {
-        id:mousearea
-        enabled: button.enabled
-        hoverEnabled: true
+    DefaultStyles.ButtonStyle { id: defaultStyle }
+    ButtonBehavior {
+        id: behavior
         anchors.fill: parent
-        onPressed: button.pressed = true
-        onEntered: if(pressed && enabled) button.pressed = true  // handles clicks as well
-        onExited: button.pressed = false
-        onReleased: {
-            if (button.pressed && enabled) { // No click if release outside area
-                button.pressed  = false
-                if (checkable)
-                    checked = !checked;
-                button.clicked()
-            }
-        }
+        onClicked: button.clicked()
     }
 
-    Component {
-        id:defaultbackground
-        Item {
-
-            Rectangle{
-                color:backgroundColor
-                radius: 5
-                x:1
-                y:1
-                width:parent.width-2
-                height:parent.height-2
-            }
-
-            BorderImage {
-                anchors.fill:parent
-                id: backgroundimage
-                smooth:true
-                source: pressed ? "images/button_pressed.png" : "images/button_normal.png"
-                width: 80; height: 24
-                border.left: 3; border.top: 3
-                border.right: 3; border.bottom: 3
-            }
-        }
+    Loader {    // background
+        anchors.fill: parent
+        sourceComponent: background
     }
 
-    Component {
-        id:defaultlabel
-        Item {
-            width:layout.width
-            height:layout.height
-            anchors.margins:4
-            Row {
-                spacing:6
-                anchors.centerIn:parent
-                id:layout
-                Image { source:button.icon; anchors.verticalCenter:parent.verticalCenter}
-                Text {
-                    id:label
-                    font:button.font
-                    color:button.foregroundColor;
-                    anchors.verticalCenter: parent.verticalCenter ;
-                    text:button.text
-                    opacity:parent.enabled ? 1 : 0.5
-                }
-            }
-        }
+    Loader {    // content
+        id: contentComponent
+        anchors.centerIn: parent
+        sourceComponent: content
     }
 }
diff --git a/ButtonBlock.qml b/ButtonBlock.qml
@@ -0,0 +1,39 @@
+import Qt 4.7
+
+Rectangle {
+    id: block
+    width: grid.width+20
+    height: grid.height+20
+    color: "blue"
+
+    signal clicked
+    property alias model: repeater.model
+    property Component buttonTemplate: Button { checkable: true }
+//    property Component customStyle: null
+//    property list<Item> selected
+//    property variant selected: new Array();
+
+    Grid {
+        id: grid
+        columns: 3
+        anchors.centerIn: parent
+        Repeater {
+            id: repeater
+            delegate: Loader {
+                sourceComponent: buttonTemplate
+                onLoaded: {
+//                    if(customStyle != null) { item.background = customStyle.background; item.content = customStyle.content }
+                    if(model.text) item.text = model.text
+                    if(model.icon) item.icon = model.icon
+                    if(model.enabled) item.enabled = model.enabled
+                    if(model.checkable) item.checkable = model.checkable
+                }
+                Connections {
+                    target:  item
+                    onClicked: { print("Clicked " + index); block.clicked(index) }
+//                    onCheckedChanged: { selected.push(item); print(selected.length) }
+                }
+            }
+        }
+    }
+}
diff --git a/CheckBox.qml b/CheckBox.qml
@@ -1,71 +1,13 @@
-import Qt 4.7
-
-Button{
-    id:button
-
-    checkable: true
-    background: defaultbackground
-    content: defaultlabel
-
-    Component {
-        id:defaultbackground
-        Item {
-            Rectangle{
-                anchors.fill:backgroundimage
-                color:backgroundColor
-                radius: 5
-                x:1
-                y:1
-                width:parent.width-2
-                height:parent.height-2
-            }
-
-            BorderImage {
-                id: backgroundimage
-                smooth:true
-                anchors.left:parent.left
-                anchors.top:parent.top
-                anchors.bottom: parent.bottom
-
-                source: "images/lineedit_normal.png"
-                width: parent.height; height: parent.height
-                border.left: 6; border.top: 3
-                border.right: 6; border.bottom: 3
-            }
-
-            Image {
-                opacity:checked ? (enabled ? 1:0.5) : 0
-                source:"images/checkbox_check.png"
-                Behavior on opacity{NumberAnimation {duration: 150; easing.type:Easing.OutCubic}}
-                anchors.centerIn:backgroundimage
-                anchors.verticalCenterOffset:1
-                anchors.horizontalCenterOffset:1
-            }
-        }
-    }
-
-    Component {
-        id:defaultlabel
-        Item {
-            width:layout.width
-            height:layout.height
-
-            anchors.bottom:parent.bottom
-            anchors.margins:4
-            Row {
-                spacing:4
-                anchors.bottom:parent.bottom
-                id:layout
-                Item{ width:parent.height + 8 ; height:1}
-                Image { source:button.icon}
-                Text {
-                    color:button.foregroundColor;
-                    opacity:enabled ? 1 : 0.5
-                    font.pixelSize:14
-                    text:button.text
-                    y:4
-                }
-            }
-        }
-    }
-}
+import Qt 4.7
+import "./behaviors"
+import "./styles/default" as DefaultStyles
+
+Button {
+    id: button
+
+    background: defaultStyle.background
+    content: defaultStyle.content
+    checkable: true
+
+    DefaultStyles.CheckBoxStyle { id: defaultStyle }
+}
diff --git a/RadioButton.qml b/RadioButton.qml
@@ -0,0 +1,13 @@
+import Qt 4.7
+import "./behaviors"
+import "./styles/default" as DefaultStyles
+
+Button {
+    id: button
+
+    background: defaultStyle.background
+    content: defaultStyle.content
+    checkable: true
+
+    DefaultStyles.RadioButtonStyle { id: defaultStyle }
+}
diff --git a/behaviors/ButtonBehavior.qml b/behaviors/ButtonBehavior.qml
@@ -0,0 +1,26 @@
+import Qt 4.7
+
+Item {
+    id: behavior
+
+    signal clicked
+    property bool pressed: false
+    property bool checkable: false
+    property bool checked: false
+    property bool triState: false
+
+    MouseArea {
+        id: mousearea
+        anchors.fill: parent
+        onEntered: if(enabled) behavior.pressed = true  // handles clicks as well
+        onExited: behavior.pressed = false
+        onReleased: {
+            if(behavior.pressed && behavior.enabled) { // No click if release outside area
+                behavior.pressed = false
+                if(behavior.checkable)
+                    behavior.checked = !behavior.checked;
+                behavior.clicked()
+            }
+        }
+    }
+}