diff options
-rw-r--r-- | demos/declarative/webbrowser/content/RectSoftShadow.qml | 40 | ||||
-rw-r--r-- | demos/declarative/webbrowser/webbrowser.qml | 591 | ||||
-rw-r--r-- | examples/declarative/contacts/dummydata/contactModel.qml | 206 | ||||
-rw-r--r-- | examples/declarative/easing/easing.qml | 157 | ||||
-rw-r--r-- | examples/declarative/follow/pong.qml | 173 | ||||
-rw-r--r-- | examples/declarative/listview/dummydata/MyPetsModel.qml | 101 | ||||
-rw-r--r-- | examples/declarative/listview/dummydata/Recipies.qml | 199 | ||||
-rw-r--r-- | examples/declarative/minehunt/minehunt.qml | 239 | ||||
-rw-r--r-- | examples/declarative/mouseregion/mouse.qml | 72 | ||||
-rw-r--r-- | examples/declarative/velocity/Day.qml | 156 | ||||
-rw-r--r-- | examples/declarative/velocity/velocity.qml | 194 | ||||
-rw-r--r-- | examples/declarative/xmldata/daringfireball.qml | 84 | ||||
-rw-r--r-- | examples/declarative/xmldata/yahoonews.qml | 149 | ||||
-rw-r--r-- | src/declarative/fx/qfxkeyactions.cpp | 2 | ||||
-rw-r--r-- | src/declarative/fx/qfxkeyactions.h | 2 |
15 files changed, 1522 insertions, 843 deletions
diff --git a/demos/declarative/webbrowser/content/RectSoftShadow.qml b/demos/declarative/webbrowser/content/RectSoftShadow.qml index 2b39422..5817f00 100644 --- a/demos/declarative/webbrowser/content/RectSoftShadow.qml +++ b/demos/declarative/webbrowser/content/RectSoftShadow.qml @@ -1,10 +1,30 @@ -<Item> - <Image source="pics/softshadow-left.sci" x="-16" y="-16" - width="16" height="{parent.height+32}" /> - <Image source="pics/softshadow-right.sci" x="{parent.width}" y="-16" - width="16" height="{parent.height+32}" /> - <Image source="pics/softshadow-top.png" x="0" y="-16" - width="{parent.width}" height="16" /> - <Image source="pics/softshadow-bottom.png" x="0" y="{parent.height}" - width="{webview.width*webview.scale}" height="16" /> -</Item> +Item { + Image { + source: "pics/softshadow-left.sci" + x: -16 + y: -16 + width: 16 + height: parent.height+32 + } + Image { + source: "pics/softshadow-right.sci" + x: parent.width + y: -16 + width: 16 + height: parent.height+32 + } + Image { + source: "pics/softshadow-top.png" + x: 0 + y: -16 + width: parent.width + height: 16 + } + Image { + source: "pics/softshadow-bottom.png" + x: 0 + y: parent.height + width: webview.width*webview.scale + height: 16 + } +} diff --git a/demos/declarative/webbrowser/webbrowser.qml b/demos/declarative/webbrowser/webbrowser.qml index cf96b3f..2b49c11 100644 --- a/demos/declarative/webbrowser/webbrowser.qml +++ b/demos/declarative/webbrowser/webbrowser.qml @@ -1,7 +1,15 @@ -<?qtfx namespacepath:=content?> -<Item width="640" height="480" id="WebBrowser" state="Normal"> - <properties><Property name="url" value="http://www.qtsoftware.com"/></properties> - <Script> +import "content" +Item { + width: 640 + height: 480 + id: WebBrowser + state: "Normal" + properties: Property { + name: "url" + value: "http://www.qtsoftware.com" + } + Script { + function zoomOut() { WebBrowser.state = "ZoomedOut"; } @@ -14,162 +22,419 @@ zoomOut(); } } - </Script> - - <Item id="WebPanel" anchors.fill="{parent}" clip="true"> - <Rect color="#555555" anchors.fill="{parent}"/> - <Image source="content/pics/softshadow-bottom.png" width="{WebPanel.width}" height="16" /> - <Image source="content/pics/softshadow-top.png" width="{WebPanel.width}" anchors.bottom="{Footer.top}" height="16" /> - <RectSoftShadow x="{-Flick.xPosition}" y="{-Flick.yPosition}" - width="{WebView.width*WebView.scale}" height="{Flick.y+WebView.height*WebView.scale}"/> - <Item id="HeaderSpace" width="{parent.width}" height="60" z="1"> - <Image id="Header" width="{parent.width}" state="Normal" - x="{Flick.xPosition < 0 - ? -Flick.xPosition - : Flick.xPosition > Flick.viewportWidth-Flick.width - ? -Flick.xPosition+Flick.viewportWidth-Flick.width - : 0}" - y="{Flick.yPosition < 0 ? -Flick.yPosition : progressOff*(Flick.yPosition>height?-height:-Flick.yPosition)}" - height="64" source="content/pics/header.png"> - <Text id="HeaderText" text="{WebView.title!='' || WebView.progress == 1.0 ? WebView.title : 'Loading...'}" - color="white" styleColor="black" style="Raised" - font.family="Helvetica" font.size="10" font.bold="true" elide="ElideRight" - anchors.left="{Header.left}" anchors.right="{Header.right}" - anchors.leftMargin="4" anchors.rightMargin="4" - anchors.top="{Header.top}" anchors.topMargin="4" hAlign="AlignHCenter"/> - <Item anchors.top="{HeaderText.bottom}" anchors.topMargin="2" anchors.bottom="{parent.bottom}" width="{parent.width}"> - <Item id="UrlBox" anchors.left="{parent.left}" anchors.leftMargin="12" anchors.right="{parent.right}" anchors.rightMargin="12" height="31" anchors.top="{parent.top}" clip="true"> - <Image source="content/pics/addressbar.sci" anchors.fill="{UrlBox}"/> - <Image id="UrlBoxhl" source="content/pics/addressbar-filled.sci" opacity="{1-Header.progressOff}" clip="true" width="{parent.width*WebView.progress}" height="{parent.height}"/> - <KeyProxy id="proxy" anchors.left="{UrlBox.left}" anchors.fill="{UrlBox}" focusable="true" targets="{[keyActions,EditUrl]}"/> - <KeyActions id="keyActions" return="WebBrowser.url = EditUrl.text; proxy.focus=false;"/> - <TextEdit id="EditUrl" color="#555555" text="{WebView.url == '' ? ' ' : WebView.url}" - anchors.left="{UrlBox.left}" anchors.right="{UrlBox.right}" anchors.leftMargin="6" - anchors.verticalCenter="{UrlBox.verticalCenter}" anchors.verticalCenterOffset="1" - font.size="11" wrap="false" opacity="0"/> - <Text id="ShowUrl" color="#555555" text="{WebView.url == '' ? ' ' : WebView.url}" - anchors.left="{UrlBox.left}" anchors.right="{UrlBox.right}" anchors.leftMargin="6" - anchors.verticalCenter="{UrlBox.verticalCenter}" anchors.verticalCenterOffset="1" - font.size="11" /> - </Item> - <MouseRegion anchors.fill="{UrlBox}" onClicked="proxy.focus=true"/> - </Item> - <properties> - <Property name="progressOff" value="1" type="Real"/> - </properties> - <states> - <State name="Normal" when="{WebView.progress == 1.0}"> - <SetProperty target="{Header}" property="progressOff" value="1"/> - </State> - <State name="ProgressShown" when="{WebView.progress < 1.0}"> - <SetProperty target="{Header}" property="progressOff" value="0"/> - </State> - </states> - <transitions> - <Transition> - <NumericAnimation target="{Header}" properties="progressOff" easing="easeInOutQuad" duration="300"/> - </Transition> - </transitions> - </Image> - </Item> - <Flickable id="Flick" - anchors.top="{HeaderSpace.bottom}" anchors.bottom="{Footer.top}" - anchors.left="{parent.left}" anchors.right="{parent.right}" - width="{parent.width}" - viewportWidth="{Math.max(parent.width,WebView.width*WebView.scale)}" - viewportHeight="{Math.max(parent.height,WebView.height*WebView.scale)}" - > - <properties> - <Property name="centerX" value="0" type="Real"/> - <Property name="centerY" value="0" type="Real"/> - </properties> - <WebView id="WebView" - cacheSize="4000000" - smooth="true" - url="{WebBrowser.url}" - onDoubleClick="toggleZoom()" - focusable="true" - focus="true" - idealWidth="{Flick.width}" - idealHeight="{Flick.height/scale}" - onUrlChanged="Flick.xPosition=0; Flick.yPosition=0; zoomOut()" - scale="{(width > 0) ? Flick.width/width*zoomedOut+(1-zoomedOut) : 1}" - > - <properties> - <Property name="zoomedOut" type="real" value="1"/> - </properties> - </WebView> - <Rect id="WebViewTint" anchors.fill="{WebView}" color="black" opacity="0"> - <MouseRegion anchors.fill="{WebViewTint}" onClicked="proxy.focus=false"/> - </Rect> - </Flickable> - <Image id="Footer" width="{parent.width}" anchors.bottom="{parent.bottom}" - height="43" source="content/pics/footer.sci"> - <Rect y="-1" width="{parent.width}" height="1" color="#555555"/> - <Item id="backbutton" anchors.right="{reload.left}" anchors.rightMargin="10" anchors.verticalCenter="{parent.verticalCenter}" width="{back_e.width}" height="{back_e.height}"> - <Image anchors.fill="{parent}" id="back_e" source="content/pics/back.png" /> - <Image anchors.fill="{parent}" id="back_d" source="content/pics/back-disabled.png" /> - <states> - <State name="Enabled" when="{WebView.back.enabled==true}"> - <SetProperty target="{back_e}" property="opacity" value="1"/> - <SetProperty target="{back_d}" property="opacity" value="0"/> - </State> - <State name="Disabled" when="{WebView.back.enabled==false}"> - <SetProperty target="{back_e}" property="opacity" value="0"/> - <SetProperty target="{back_d}" property="opacity" value="1"/> - </State> - </states> - <transitions> - <Transition> - <NumericAnimation properties="opacity" easing="easeInOutQuad" duration="300"/> - </Transition> - </transitions> - <MouseRegion anchors.fill="{back_e}" onClicked="if (WebView.back.enabled) WebView.back.trigger()"/> - </Item> - <Image id="reload" source="content/pics/reload.png" anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}"/> - <MouseRegion anchors.fill="{reload}" onClicked="WebView.reload.trigger()"/> - <Item id="forwardbutton" anchors.left="{reload.right}" anchors.leftMargin="10" anchors.verticalCenter="{parent.verticalCenter}" width="{forward_e.width}" height="{forward_e.height}"> - <Image anchors.fill="{parent}" anchors.verticalCenter="{parent.verticalCenter}" id="forward_e" source="content/pics/forward.png" /> - <Image anchors.fill="{parent}" id="forward_d" source="content/pics/forward-disabled.png" /> - <states> - <State name="Enabled" when="{WebView.forward.enabled==true}"> - <SetProperty target="{forward_e}" property="opacity" value="1"/> - <SetProperty target="{forward_d}" property="opacity" value="0"/> - </State> - <State name="Disabled" when="{WebView.forward.enabled==false}"> - <SetProperty target="{forward_e}" property="opacity" value="0"/> - <SetProperty target="{forward_d}" property="opacity" value="1"/> - </State> - </states> - <transitions> - <Transition> - <NumericAnimation properties="opacity" easing="easeInOutQuad" duration="320"/> - </Transition> - </transitions> - <MouseRegion anchors.fill="{parent}" onClicked="if (WebView.forward.enabled) WebView.forward.trigger()"/> - </Item> - </Image> - </Item> - <states> - <State name="Normal"> - <SetProperty target="{WebView}" property="zoomedOut" value="0"/> - <SetProperty target="{Flick}" property="xPosition" value="{Math.min(WebView.width-Flick.width,Math.max(0,Flick.centerX-Flick.width/2))}"/> - <SetProperty target="{Flick}" property="yPosition" value="{Math.min(WebView.height-Flick.height,Math.max(0,Flick.centerY-Flick.height/2))}"/> - </State> - <State name="ZoomedOut"> - <SetProperty target="{WebView}" property="zoomedOut" value="1"/> - </State> - </states> - <transitions> - <Transition> - <SequentialAnimation> - <SetPropertyAction target="{WebView}" property="smooth" value="false" /> - <ParallelAnimation> - <NumericAnimation target="{WebView}" properties="zoomedOut" easing="easeInOutQuad" duration="200"/> - <NumericAnimation target="{Flick}" properties="xPosition,yPosition" easing="easeInOutQuad" duration="200"/> - </ParallelAnimation> - <SetPropertyAction target="{WebView}" property="smooth" value="true" /> - </SequentialAnimation> - </Transition> - </transitions> -</Item> + + } + Item { + id: WebPanel + anchors.fill: parent + clip: true + Rect { + color: "#555555" + anchors.fill: parent + } + Image { + source: "content/pics/softshadow-bottom.png" + width: WebPanel.width + height: 16 + } + Image { + source: "content/pics/softshadow-top.png" + width: WebPanel.width + anchors.bottom: Footer.top + height: 16 + } + RectSoftShadow { + x: -Flick.xPosition + y: -Flick.yPosition + width: WebView.width*WebView.scale + height: Flick.y+WebView.height*WebView.scale + } + Item { + id: HeaderSpace + width: parent.width + height: 60 + z: 1 + Image { + id: Header + width: parent.width + state: "Normal" + x: Flick.xPosition < 0 ? -Flick.xPosition : Flick.xPosition > Flick.viewportWidth-Flick.width ? -Flick.xPosition+Flick.viewportWidth-Flick.width : 0 + y: Flick.yPosition < 0 ? -Flick.yPosition : progressOff*(Flick.yPosition>height?-height:-Flick.yPosition) + height: 64 + source: "content/pics/header.png" + Text { + id: HeaderText + text: WebView.title!='' || WebView.progress == 1.0 ? WebView.title : 'Loading...' + color: "white" + styleColor: "black" + style: Raised + font.family: "Helvetica" + font.size: 10 + font.bold: true + elide: "ElideRight" + anchors.left: Header.left + anchors.right: Header.right + anchors.leftMargin: 4 + anchors.rightMargin: 4 + anchors.top: Header.top + anchors.topMargin: 4 + hAlign: AlignHCenter + } + Item { + anchors.top: HeaderText.bottom + anchors.topMargin: 2 + anchors.bottom: parent.bottom + width: parent.width + Item { + id: UrlBox + anchors.left: parent.left + anchors.leftMargin: 12 + anchors.right: parent.right + anchors.rightMargin: 12 + height: 31 + anchors.top: parent.top + clip: true + Image { + source: "content/pics/addressbar.sci" + anchors.fill: UrlBox + } + Image { + id: UrlBoxhl + source: "content/pics/addressbar-filled.sci" + opacity: 1-Header.progressOff + clip: true + width: parent.width*WebView.progress + height: parent.height + } + KeyProxy { + id: proxy + anchors.left: UrlBox.left + anchors.fill: UrlBox + focusable: true + targets: {[keyActions,EditUrl]} + } + KeyActions { + id: keyActions + keyReturn: "WebBrowser.url = EditUrl.text; proxy.focus=false;" + } + TextEdit { + id: EditUrl + color: "#555555" + text: WebView.url == '' ? ' ' : WebView.url + anchors.left: UrlBox.left + anchors.right: UrlBox.right + anchors.leftMargin: 6 + anchors.verticalCenter: UrlBox.verticalCenter + anchors.verticalCenterOffset: 1 + font.size: 11 + wrap: false + opacity: 0 + } + Text { + id: ShowUrl + color: "#555555" + text: WebView.url == '' ? ' ' : WebView.url + anchors.left: UrlBox.left + anchors.right: UrlBox.right + anchors.leftMargin: 6 + anchors.verticalCenter: UrlBox.verticalCenter + anchors.verticalCenterOffset: 1 + font.size: 11 + } + } + MouseRegion { + anchors.fill: UrlBox + onClicked: { proxy.focus=true } + } + } + properties: Property { + name: "progressOff" + value: 1 + type: "Real" + } + states: [ + State { + name: "Normal" + when: WebView.progress == 1.0 + SetProperty { + target: Header + property: "progressOff" + value: 1 + } + }, + State { + name: "ProgressShown" + when: WebView.progress < 1.0 + SetProperty { + target: Header + property: "progressOff" + value: 0 + } + } + ] + transitions: [ + Transition { + NumericAnimation { + target: Header + properties: "progressOff" + easing: "easeInOutQuad" + duration: 300 + } + } + ] + } + } + Flickable { + id: Flick + anchors.top: HeaderSpace.bottom + anchors.bottom: Footer.top + anchors.left: parent.left + anchors.right: parent.right + width: parent.width + viewportWidth: Math.max(parent.width,WebView.width*WebView.scale) + viewportHeight: Math.max(parent.height,WebView.height*WebView.scale) + properties: Property { + name: "centerX" + value: 0 + type: "Real" + } + properties: Property { + name: "centerY" + value: 0 + type: "Real" + } + WebView { + id: WebView + cacheSize: 4000000 + smooth: true + url: WebBrowser.url + onDoubleClick: { toggleZoom() } + focusable: true + focus: true + idealWidth: Flick.width + idealHeight: Flick.height/scale + onUrlChanged: { Flick.xPosition=0; Flick.yPosition=0; zoomOut() } + scale: (width > 0) ? Flick.width/width*zoomedOut+(1-zoomedOut) : 1 + properties: Property { + name: "zoomedOut" + type: "real" + value: 1 + } + } + Rect { + id: WebViewTint + anchors.fill: WebView + color: "black" + opacity: 0 + MouseRegion { + anchors.fill: WebViewTint + onClicked: { proxy.focus=false } + } + } + } + Image { + id: Footer + width: parent.width + anchors.bottom: parent.bottom + height: 43 + source: "content/pics/footer.sci" + Rect { + y: -1 + width: parent.width + height: 1 + color: "#555555" + } + Item { + id: backbutton + anchors.right: reload.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + width: back_e.width + height: back_e.height + Image { + anchors.fill: parent + id: back_e + source: "content/pics/back.png" + } + Image { + anchors.fill: parent + id: back_d + source: "content/pics/back-disabled.png" + } + states: [ + State { + name: "Enabled" + when: WebView.back.enabled==true + SetProperty { + target: back_e + property: "opacity" + value: 1 + } + SetProperty { + target: back_d + property: "opacity" + value: 0 + } + }, + State { + name: "Disabled" + when: WebView.back.enabled==false + SetProperty { + target: back_e + property: "opacity" + value: 0 + } + SetProperty { + target: back_d + property: "opacity" + value: 1 + } + } + ] + transitions: [ + Transition { + NumericAnimation { + properties: "opacity" + easing: "easeInOutQuad" + duration: 300 + } + } + ] + MouseRegion { + anchors.fill: back_e + onClicked: { if (WebView.back.enabled) WebView.back.trigger() } + } + } + Image { + id: reload + source: "content/pics/reload.png" + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + } + MouseRegion { + anchors.fill: reload + onClicked: { WebView.reload.trigger() } + } + Item { + id: forwardbutton + anchors.left: reload.right + anchors.leftMargin: 10 + anchors.verticalCenter: parent.verticalCenter + width: forward_e.width + height: forward_e.height + Image { + anchors.fill: parent + anchors.verticalCenter: parent.verticalCenter + id: forward_e + source: "content/pics/forward.png" + } + Image { + anchors.fill: parent + id: forward_d + source: "content/pics/forward-disabled.png" + } + states: [ + State { + name: "Enabled" + when: WebView.forward.enabled==true + SetProperty { + target: forward_e + property: "opacity" + value: 1 + } + SetProperty { + target: forward_d + property: "opacity" + value: 0 + } + }, + State { + name: "Disabled" + when: WebView.forward.enabled==false + SetProperty { + target: forward_e + property: "opacity" + value: 0 + } + SetProperty { + target: forward_d + property: "opacity" + value: 1 + } + } + ] + transitions: [ + Transition { + NumericAnimation { + properties: "opacity" + easing: "easeInOutQuad" + duration: 320 + } + } + ] + MouseRegion { + anchors.fill: parent + onClicked: { if (WebView.forward.enabled) WebView.forward.trigger() } + } + } + } + } + states: [ + State { + name: "Normal" + SetProperty { + target: WebView + property: "zoomedOut" + value: 0 + } + SetProperty { + target: Flick + property: "xPosition" + value: Math.min(WebView.width-Flick.width,Math.max(0,Flick.centerX-Flick.width/2)) + } + SetProperty { + target: Flick + property: "yPosition" + value: Math.min(WebView.height-Flick.height,Math.max(0,Flick.centerY-Flick.height/2)) + } + }, + State { + name: "ZoomedOut" + SetProperty { + target: WebView + property: "zoomedOut" + value: 1 + } + } + ] + transitions: [ + Transition { + SequentialAnimation { + SetPropertyAction { + target: WebView + property: "smooth" + value: false + } + ParallelAnimation { + NumericAnimation { + target: WebView + properties: "zoomedOut" + easing: "easeInOutQuad" + duration: 200 + } + NumericAnimation { + target: Flick + properties: "xPosition,yPosition" + easing: "easeInOutQuad" + duration: 200 + } + } + SetPropertyAction { + target: WebView + property: "smooth" + value: true + } + } + } + ] +} diff --git a/examples/declarative/contacts/dummydata/contactModel.qml b/examples/declarative/contacts/dummydata/contactModel.qml index 341b7a6..48b2fd9 100644 --- a/examples/declarative/contacts/dummydata/contactModel.qml +++ b/examples/declarative/contacts/dummydata/contactModel.qml @@ -1,103 +1,103 @@ -<ListModel> - <Contact> - <firstName>Aaron</firstName> - <lastName>Kennedy</lastName> - <portrait>contact.png</portrait> - <emails> - <Email address="akennedy@trolltech.com"/> - <Email address="aaron.kennedy@trolltech.com"/> - </emails> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>1</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>2</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>3</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>4</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>5</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>6</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>7</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>8</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Contact</firstName> - <lastName>9</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Alan</firstName> - <lastName>Alpert</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Betty</firstName> - <lastName>Boo</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Foo</firstName> - <lastName>Bar</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Marius</firstName> - <lastName>Bugge Monsen</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Martin</firstName> - <lastName>Jones</lastName> - <portrait>contact.png</portrait> - <emails> - <Email address="mjones@trolltech.com"/> - <Email address="martin.jones@trolltech.com"/> - </emails> - </Contact> - <Contact> - <firstName>Michael</firstName> - <lastName>Brasser</lastName> - <portrait>contact.png</portrait> - <emails> - <Email address="mbrasser@trolltech.com"/> - </emails> - </Contact> - <Contact> - <firstName>Yann</firstName> - <lastName>Bodson</lastName> - <portrait>contact.png</portrait> - </Contact> - <Contact> - <firstName>Yogi</firstName> - <lastName>Bear</lastName> - <portrait>contact.png</portrait> - </Contact> -</ListModel> +ListModel2 { + ListElement { + firstName: "Aaron" + lastName: "Kennedy" + portrait: "contact.png" + emails: [ + ListElement { address: "akennedy@trolltech.com" }, + ListElement { address: "aaron.kennedy@trolltech.com" } + ] + } + ListElement { + firstName: "ListElement" + lastName: 1 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 2 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 3 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 4 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 5 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 6 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 7 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 8 + portrait: "contact.png" + } + ListElement { + firstName: "ListElement" + lastName: 9 + portrait: "contact.png" + } + ListElement { + firstName: "Alan" + lastName: "Alpert" + portrait: "contact.png" + } + ListElement { + firstName: "Betty" + lastName: "Boo" + portrait: "contact.png" + } + ListElement { + firstName: "Foo" + lastName: "Bar" + portrait: "contact.png" + } + ListElement { + firstName: "Marius" + lastName: "Bugge Monsen" + portrait: "contact.png" + } + ListElement { + firstName: "Martin" + lastName: "Jones" + portrait: "contact.png" + emails: [ + ListElement { address: "mjones@trolltech.com" }, + ListElement { address: "martin.jones@trolltech.com" } + ] + } + ListElement { + firstName: "Michael" + lastName: "Brasser" + portrait: "contact.png" + emails: ListElement { + address: "mbrasser@trolltech.com" + } + } + ListElement { + firstName: "Yann" + lastName: "Bodson" + portrait: "contact.png" + } + ListElement { + firstName: "Yogi" + lastName: "Bear" + portrait: "contact.png" + } +} diff --git a/examples/declarative/easing/easing.qml b/examples/declarative/easing/easing.qml index f95d8c6..32c1b9b 100644 --- a/examples/declarative/easing/easing.qml +++ b/examples/declarative/easing/easing.qml @@ -1,67 +1,92 @@ -<Rect id="Window" width="640" height="{Layout.height}" color="white"> +Rect { + id: Window + width: 640 + height: Layout.height + color: "white" - <resources> - <ListModel id="EasingTypes"> - <ListItem><type>easeLinear</type></ListItem> - <ListItem><type>easeInQuad</type></ListItem> - <ListItem><type>easeOutQuad</type></ListItem> - <ListItem><type>easeInOutQuad</type></ListItem> - <ListItem><type>easeOutInQuad</type></ListItem> - <ListItem><type>easeInCubic</type></ListItem> - <ListItem><type>easeOutCubic</type></ListItem> - <ListItem><type>easeInOutCubic</type></ListItem> - <ListItem><type>easeOutInCubic</type></ListItem> - <ListItem><type>easeInQuart</type></ListItem> - <ListItem><type>easeOutQuart</type></ListItem> - <ListItem><type>easeInOutQuart</type></ListItem> - <ListItem><type>easeOutInQuart</type></ListItem> - <ListItem><type>easeInQuint</type></ListItem> - <ListItem><type>easeOutQuint</type></ListItem> - <ListItem><type>easeInOutQuint</type></ListItem> - <ListItem><type>easeOutInQuint</type></ListItem> - <ListItem><type>easeInSine</type></ListItem> - <ListItem><type>easeOutSine</type></ListItem> - <ListItem><type>easeInOutSine</type></ListItem> - <ListItem><type>easeOutInSine</type></ListItem> - <ListItem><type>easeInExpo</type></ListItem> - <ListItem><type>easeOutExpo</type></ListItem> - <ListItem><type>easeInOutExpo</type></ListItem> - <ListItem><type>easeOutInExpo</type></ListItem> - <ListItem><type>easeInCirc</type></ListItem> - <ListItem><type>easeOutCirc</type></ListItem> - <ListItem><type>easeInOutCirc</type></ListItem> - <ListItem><type>easeOutInCirc</type></ListItem> - <ListItem><type>easeInElastic</type></ListItem> - <ListItem><type>easeOutElastic</type></ListItem> - <ListItem><type>easeInOutElastic</type></ListItem> - <ListItem><type>easeOutInElastic</type></ListItem> - <ListItem><type>easeInBack</type></ListItem> - <ListItem><type>easeOutBack</type></ListItem> - <ListItem><type>easeInOutBack</type></ListItem> - <ListItem><type>easeOutInBack</type></ListItem> - <ListItem><type>easeOutBounce</type></ListItem> - <ListItem><type>easeInBounce</type></ListItem> - <ListItem><type>easeInOutBounce</type></ListItem> - <ListItem><type>easeOutInBounce</type></ListItem> - </ListModel> - </resources> - - <VerticalLayout id="Layout" anchors.left="{Window.left}" anchors.right="{Window.right}"> - <Repeater dataSource="{EasingTypes}"> - <Component> - <Text id="Text" text="{type}" height="18" font.italic="true"> - <x> - <SequentialAnimation id="Anim"> - <NumericAnimation from="0" to="{Window.width / 2}" easing="{type}" duration="1000"/> - <PauseAnimation duration="300"/> - <NumericAnimation to="0" from="{Window.width / 2}" easing="{type}" duration="1000"/> - </SequentialAnimation> - </x> - <children> - <MouseRegion onClicked="Anim.running=true" anchors.fill="{parent}"/> - </children> - </Text> - </Component> - </Repeater> - </VerticalLayout> -</Rect> + ListModel2 { + id: EasingTypes + ListElement { type: "easeLinear" } + ListElement { type: "easeInQuad" } + ListElement { type: "easeOutQuad" } + ListElement { type: "easeInOutQuad" } + ListElement { type: "easeOutInQuad" } + ListElement { type: "easeInCubic" } + ListElement { type: "easeOutCubic" } + ListElement { type: "easeInOutCubic" } + ListElement { type: "easeOutInCubic" } + ListElement { type: "easeInQuart" } + ListElement { type: "easeOutQuart" } + ListElement { type: "easeInOutQuart" } + ListElement { type: "easeOutInQuart" } + ListElement { type: "easeInQuint" } + ListElement { type: "easeOutQuint" } + ListElement { type: "easeInOutQuint" } + ListElement { type: "easeOutInQuint" } + ListElement { type: "easeInSine" } + ListElement { type: "easeOutSine" } + ListElement { type: "easeInOutSine" } + ListElement { type: "easeOutInSine" } + ListElement { type: "easeInExpo" } + ListElement { type: "easeOutExpo" } + ListElement { type: "easeInOutExpo" } + ListElement { type: "easeOutInExpo" } + ListElement { type: "easeInCirc" } + ListElement { type: "easeOutCirc" } + ListElement { type: "easeInOutCirc" } + ListElement { type: "easeOutInCirc" } + ListElement { type: "easeInElastic" } + ListElement { type: "easeOutElastic" } + ListElement { type: "easeInOutElastic" } + ListElement { type: "easeOutInElastic" } + ListElement { type: "easeInBack" } + ListElement { type: "easeOutBack" } + ListElement { type: "easeInOutBack" } + ListElement { type: "easeOutInBack" } + ListElement { type: "easeOutBounce" } + ListElement { type: "easeInBounce" } + ListElement { type: "easeInOutBounce" } + ListElement { type: "easeOutInBounce" } + } + + VerticalLayout { + id: Layout + anchors.left: Window.left + anchors.right: Window.right + Repeater { + dataSource: EasingTypes + Component { + Text { + id: Text + text: type + height: 18 + font.italic: true + x: SequentialAnimation { + id: Anim + NumericAnimation { + from: 0 + to: Window.width / 2 + easing: type + duration: 1000 + } + PauseAnimation { + duration: 300 + } + NumericAnimation { + to: 0 + from: Window.width / 2 + easing: type + duration: 1000 + } + } + children: [ + MouseRegion { + onClicked: { Anim.running=true } + anchors.fill: parent + } + ] + } + } + } + } +} diff --git a/examples/declarative/follow/pong.qml b/examples/declarative/follow/pong.qml index 4fbf323..ed4a652 100644 --- a/examples/declarative/follow/pong.qml +++ b/examples/declarative/follow/pong.qml @@ -1,55 +1,120 @@ -<Rect id="Page" width="640" height="480" color="#000000"> - <!-- Make a ball to bounce --> - <Rect id="Ball" x="20" width="20" height="20" color="#00ee00" z="1"> - <properties> - <!-- Add a property for the target y coordinate --> - <Property name="targetY" value="{Page.height-10}"/> - <Property name="direction" value="right"/> - </properties> - <x> - <!-- Move the ball to the right and back to the left repeatedly --> - <SequentialAnimation running="true" repeat="true"> - <NumericAnimation to="{Page.width-40}" duration="2000"/> - <SetPropertyAction target="{Ball}" property="direction" value="left"/> - <NumericAnimation to="20" duration="2000"/> - <SetPropertyAction target="{Ball}" property="direction" value="right"/> - </SequentialAnimation> - </x> - <y> - <!-- Make y follow the target y coordinate, with a velocity of 200 --> - <Follow source="{Ball.targetY}" velocity="200"/> - </y> - <onTopChanged> - <!-- Detect the ball hitting the top or bottom of the view and bounce it --> - if (y <= 0) +Rect { + id: Page + width: 640 + height: 480 + color: "#000000" + // Make a ball to bounce + Rect { + id: Ball + x: 20 + width: 20 + height: 20 + color: "#00ee00" + z: 1 + // Add a property for the target y coordinate + properties: Property { + name: "targetY" + value: Page.height-10 + } + properties: Property { + name: "direction" + value: "right" + } + // Move the ball to the right and back to the left repeatedly + x: SequentialAnimation { + running: true + repeat: true + NumericAnimation { + to: Page.width-40 + duration: 2000 + } + SetPropertyAction { + target: Ball + property: "direction" + value: "left" + } + NumericAnimation { + to: 20 + duration: 2000 + } + SetPropertyAction { + target: Ball + property: "direction" + value: "right" + } + } + // Make y follow the target y coordinate, with a velocity of 200 + y: Follow { + source: Ball.targetY + velocity: 200 + } + // Detect the ball hitting the top or bottom of the view and bounce it + onTopChanged: { if (y <= 0) targetY = Page.height-20; - else if (y >= Page.height-20) - targetY = 0; - </onTopChanged> - </Rect> - <!-- - Place bats to the left and right of the view, following the y - coordinates of the ball. - --> - <Rect id="LeftBat" color="#00ee00" x="2" width="20" height="90"> - <y> - <Follow source="{Ball.y-45}" velocity="300" enabled="{Ball.direction == 'left'}"/> - </y> - </Rect> - <Rect id="RightBat" x="{Page.width-22}" color="#00ee00" width="20" height="90"> - <y> - <Follow source="{Ball.y-45}" velocity="300" enabled="{Ball.direction == 'right'}"/> - </y> - </Rect> - - <!-- - The rest, to make it look realistic, if neither ever scores... - --> - <Rect color="#00ee00" width="40" height="60" x="{320-80}"/> - <Rect color="#000000" width="20" height="40" x="{320-70}" y="10"/> - <Rect color="#00ee00" width="40" height="60" x="{320+40}"/> - <Rect color="#000000" width="20" height="40" x="{320+50}" y="10"/> - <Repeater dataSource="{24}"> - <Rect color="#00ee00" width="10" height="10" x="{320-5}" y="{index*20}"/> - </Repeater> -</Rect> + else if (y >= Page.height-20) + targetY = 0; } + } + // Place bats to the left and right of the view, following the y + // coordinates of the ball. + Rect { + id: LeftBat + color: "#00ee00" + x: 2 + width: 20 + height: 90 + y: Follow { + source: Ball.y-45 + velocity: 300 + enabled: Ball.direction == 'left' + } + } + Rect { + id: RightBat + x: Page.width-22 + color: "#00ee00" + width: 20 + height: 90 + y: Follow { + source: Ball.y-45 + velocity: 300 + enabled: Ball.direction == 'right' + } + } + // The rest, to make it look realistic, if neither ever scores... + Rect { + color: "#00ee00" + width: 40 + height: 60 + x: 320-80 + } + Rect { + color: "#000000" + width: 20 + height: 40 + x: 320-70 + y: 10 + } + Rect { + color: "#00ee00" + width: 40 + height: 60 + x: 320+40 + } + Rect { + color: "#000000" + width: 20 + height: 40 + x: 320+50 + y: 10 + } + Repeater { + dataSource: 24 + Rect { + color: "#00ee00" + width: 10 + height: 10 + x: 320-5 + y: index*20 + } + } +} diff --git a/examples/declarative/listview/dummydata/MyPetsModel.qml b/examples/declarative/listview/dummydata/MyPetsModel.qml index 5af7fbf..def8cf3 100644 --- a/examples/declarative/listview/dummydata/MyPetsModel.qml +++ b/examples/declarative/listview/dummydata/MyPetsModel.qml @@ -1,51 +1,50 @@ -<!-- -ListModel allows free form list models to be defined and populated. -Be sure to name the file the same as the id. ---> -<ListModel id="MyPetsModel"> - <Pet> - <name>Rover</name> - <type>Dog</type> - <age>5</age> - </Pet> - <Pet> - <name>Whiskers</name> - <type>Cat</type> - <age>2</age> - </Pet> - <Pet> - <name>Warren</name> - <type>Rabbit</type> - <age>2</age> - </Pet> - <Pet> - <name>Polly</name> - <type>Parrot</type> - <age>12</age> - </Pet> - <Pet> - <name>Spot</name> - <type>Dog</type> - <age>9</age> - </Pet> - <Pet> - <name>Tiny</name> - <type>Elephant</type> - <age>15</age> - </Pet> - <Pet> - <name>Penny</name> - <type>Turtle</type> - <age>4</age> - </Pet> - <Pet> - <name>Joey</name> - <type>Kangaroo</type> - <age>1</age> - </Pet> - <Pet> - <name>Kimba</name> - <type>Bunny</type> - <age>65</age> - </Pet> -</ListModel> +// ListModel allows free form list models to be defined and populated. +// Be sure to name the file the same as the id. +ListModel2 { + id: MyPetsModel + ListElement { + name: "Rover" + type: "Dog" + age: 5 + } + ListElement { + name: "Whiskers" + type: "Cat" + age: 2 + } + ListElement { + name: "Warren" + type: "Rabbit" + age: 2 + } + ListElement { + name: "Polly" + type: "Parrot" + age: 12 + } + ListElement { + name: "Spot" + type: "Dog" + age: 9 + } + ListElement { + name: "Tiny" + type: "Elephant" + age: 15 + } + ListElement { + name: "Penny" + type: "Turtle" + age: 4 + } + ListElement { + name: "Joey" + type: "Kangaroo" + age: 1 + } + ListElement { + name: "Kimba" + type: "Bunny" + age: 65 + } +} diff --git a/examples/declarative/listview/dummydata/Recipies.qml b/examples/declarative/listview/dummydata/Recipies.qml index 49bc610..6b20409 100644 --- a/examples/declarative/listview/dummydata/Recipies.qml +++ b/examples/declarative/listview/dummydata/Recipies.qml @@ -1,112 +1,87 @@ -<ListModel id="Recipies"> - <Recipe title="Pancakes" picture="content/pics/pancakes.jpg"> - <ingredients> - <![CDATA[ - <html> - <ul> - <li> 1 cup (150g) self-raising flour - <li> 1 tbs caster sugar - <li> 3/4 cup (185ml) milk - <li> 1 egg - </ul> - </html> - ]]> - </ingredients> - <method> - <![CDATA[ - <html> - <ol> - <li> Sift flour and sugar together into a bowl. Add a pinch of salt. - <li> Beat milk and egg together, then add to dry ingredients. Beat until smooth. - <li> Pour mixture into a pan on medium heat and cook until bubbles appear on the surface. - <li> Turn over and cook other side until golden. - </ol> - ]]> - </method> - </Recipe> - <Recipe title="Fruit Salad" picture="content/pics/fruit-salad.jpg"> - <ingredients> - * Seasonal Fruit - </ingredients> - <method> - * Chop fruit and place in a bowl. - </method> - </Recipe> - <Recipe title="Vegetable Soup" picture="content/pics/vegetable-soup.jpg"> - <ingredients> - <![CDATA[ - <html> - <ul> - <li> 1 onion - <li> 1 turnip - <li> 1 potato - <li> 1 carrot - <li> 1 head of celery - <li> 1 1/2 litres of water - </ul> - </html> - ]]> - </ingredients> - <method> - <![CDATA[ - <html> - <ol> - <li> Chop vegetables. - <li> Boil in water until vegetables soften. - <li> Season with salt and pepper to taste. - </ol> - </html> - ]]> - </method> - </Recipe> - <Recipe title="Hamburger" picture="content/pics/hamburger.jpg"> - <ingredients> - <![CDATA[ - <html> - <ul> - <li> 500g minced beef - <li> Seasoning - <li> lettuce, tomato, onion, cheese - <li> 1 hamburger bun for each burger - </ul> - </html> - ]]> - </ingredients> - <method> - <![CDATA[ - <html> - <ol> - <li> Mix the beef, together with seasoning, in a food processor. - <li> Shape the beef into burgers. - <li> Grill the burgers for about 5 mins on each side (until cooked through) - <li> Serve each burger on a bun with ketchup, cheese, lettuce, tomato and onion. - </ol> - </html> - ]]> - </method> - </Recipe> - <Recipe title="Lemonade" picture="content/pics/lemonade.jpg"> - <ingredients> - <![CDATA[ - <html> - <ul> - <li> 1 cup Lemon Juice - <li> 1 cup Sugar - <li> 6 Cups of Water (2 cups warm water, 4 cups cold water) - </ul> - </html> - ]]> - </ingredients> - <method> - <![CDATA[ - <html> - <ol> - <li> Pour 2 cups of warm water into a pitcher and stir in sugar until it dissolves. - <li> Pour in lemon juice, stir again, and add 4 cups of cold water. - <li> Chill or serve over ice cubes. - </ol> - </html> - ]]> - </method> - </Recipe> -</ListModel> +ListModel2 { + id: Recipies + ListElement { + title: "Pancakes" + picture: "content/pics/pancakes.jpg" + ingredients: "<html> \ + <ul> \ + <li> 1 cup (150g) self-raising flour \ + <li> 1 tbs caster sugar \ + <li> 3/4 cup (185ml) milk \ + <li> 1 egg \ + </ul> \ + </html>" + method: "<html> \ + <ol> \ + <li> Sift flour and sugar together into a bowl. Add a pinch of salt. \ + <li> Beat milk and egg together, then add to dry ingredients. Beat until smooth. \ + <li> Pour mixture into a pan on medium heat and cook until bubbles appear on the surface. \ + <li> Turn over and cook other side until golden. \ + </ol>" + } + ListElement { + title: "Fruit Salad" + picture: "content/pics/fruit-salad.jpg" + ingredients: "* Seasonal Fruit" + method: "* Chop fruit and place in a bowl." + } + ListElement { + title: "Vegetable Soup" + picture: "content/pics/vegetable-soup.jpg" + ingredients: "<html> \ + <ul> \ + <li> 1 onion \ + <li> 1 turnip \ + <li> 1 potato \ + <li> 1 carrot \ + <li> 1 head of celery \ + <li> 1 1/2 litres of water \ + </ul> \ + </html>" + method: "<html> \ + <ol> \ + <li> Chop vegetables. \ + <li> Boil in water until vegetables soften. \ + <li> Season with salt and pepper to taste. \ + </ol> \ + </html>" + } + ListElement { + title: "Hamburger" + picture: "content/pics/hamburger.jpg" + ingredients: "<html> \ + <ul> \ + <li> 500g minced beef \ + <li> Seasoning \ + <li> lettuce, tomato, onion, cheese \ + <li> 1 hamburger bun for each burger \ + </ul> \ + </html>" + method: "<html> \ + <ol> \ + <li> Mix the beef, together with seasoning, in a food processor. \ + <li> Shape the beef into burgers. \ + <li> Grill the burgers for about 5 mins on each side (until cooked through) \ + <li> Serve each burger on a bun with ketchup, cheese, lettuce, tomato and onion. \ + </ol> \ + </html>" + } + ListElement { + title: "Lemonade" + picture: "content/pics/lemonade.jpg" + ingredients: "<html> \ + <ul> \ + <li> 1 cup Lemon Juice \ + <li> 1 cup Sugar \ + <li> 6 Cups of Water (2 cups warm water, 4 cups cold water) \ + </ul> \ + </html>" + method: "<html> \ + <ol> \ + <li> Pour 2 cups of warm water into a pitcher and stir in sugar until it dissolves. \ + <li> Pour in lemon juice, stir again, and add 4 cups of cold water. \ + <li> Chill or serve over ice cubes. \ + </ol> \ + </html>" + } +} diff --git a/examples/declarative/minehunt/minehunt.qml b/examples/declarative/minehunt/minehunt.qml index fb65fa3..cde2612 100644 --- a/examples/declarative/minehunt/minehunt.qml +++ b/examples/declarative/minehunt/minehunt.qml @@ -1,73 +1,166 @@ -<Item id="field" width="370" height="480"> - <properties> - <Property name="clickx" type="Int" value="0"/> - <Property name="clicky" type="Int" value="0"/> - </properties> - <resources> - <Component id="tile"> - <Flipable id="flipable" width="40" height="40"> - <axis> - <Axis startX="20" startY="20" endX="20" endY="0" /> - </axis> - <front> - <Image source="pics/front.png" width="40" height="40"> - <Image anchors.horizontalCenter="{parent.horizontalCenter}" - anchors.verticalCenter="{parent.verticalCenter}" - source="pics/flag.png" opacity="{modelData.hasFlag}"> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> - </Image> - </Image> - </front> - <back> - <Image source="pics/back.png" width="40" height="40"> - <Text anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" - text="{modelData.hint}" color="white" font.bold="true" - opacity="{modelData.hasMine == false && modelData.hint > 0}"/> - <Image anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" - source="pics/bomb.png" opacity="{modelData.hasMine}"/> - <Explosion anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" explode="{modelData.hasMine==true && modelData.flipped==true}"/> - </Image> - </back> - <states> - <State name="back" when="{modelData.flipped == true}"> - <SetProperty target="{flipable}" property="rotation" value="180" /> - </State> - </states> - <transitions> - <Transition> - <SequentialAnimation> - <PauseAnimation duration="{var ret = Math.abs(flipable.parent.x-field.clickx) + Math.abs(flipable.parent.y-field.clicky); if (ret > 0) {if(modelData.hasMine==true && modelData.flipped==true){ret*3;}else{ret;}} else {0}}"/> - <NumericAnimation easing="easeInOutQuad" properties="rotation"/> - </SequentialAnimation> - </Transition> - </transitions> - <MouseRegion anchors.fill="{parent}" - onClicked="field.clickx = flipable.parent.x; field.clicky = flipable.parent.y; row = Math.floor(index/9); col = index - (Math.floor(index/9) * 9); if(mouse.button==undefined || mouse.button==Qt.RightButton){flag(row,col);}else{flip(row,col);}" /> - </Flipable> - </Component> - </resources> - <Image source="pics/No-Ones-Laughing-3.jpg" tile="true"/> - <Description text="Use the 'minehunt' executable to run this demo!" width="300" opacity="{tiles?0:1}" anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}"/> - <Repeater dataSource="{tiles}" x="1" y="1"> - <Component> - <ComponentInstance component="{tile}" - x="{(index - (Math.floor(index/9) * 9)) * 41}" - y="{Math.floor(index/9) * 41}"/> - </Component> - </Repeater> - <Item id="gamedata" width="370" height="100" y="380"> - <Text color="white" font.size="18" x="20" y="20">In play:</Text> - <Image x="100" y="20" source="pics/bomb-color.png"/> - <Text x="100" y="60" color="white" text="{numMines}"/> - <Image x="140" y="20" source="pics/flag-color.png"/> - <Text x="140" y="60" color="white" text="{numFlags}"/> - - <Image x="240" y="0" source="{if(isPlaying==true){'pics/smile.png'}else{if(hasWon==true){'pics/glee.png'}else{'pics/frown.png'}}}"> - <MouseRegion anchors.fill="{parent}" onClicked="reset()"/> - </Image> - </Item> -</Item> +Item { + id: field + width: 370 + height: 480 + properties: Property { + name: "clickx" + type: "Int" + value: 0 + } + properties: Property { + name: "clicky" + type: "Int" + value: 0 + } + resources: [ + Component { + id: tile + Flipable { + id: flipable + width: 40 + height: 40 + axis: Axis { + startX: 20 + startY: 20 + endX: 20 + endY: 0 + } + front: Image { + source: "pics/front.png" + width: 40 + height: 40 + Image { + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + source: "pics/flag.png" + opacity: modelData.hasFlag + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } + } + } + back: Image { + source: "pics/back.png" + width: 40 + height: 40 + Text { + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + text: modelData.hint + color: "white" + font.bold: true + opacity: modelData.hasMine == false && modelData.hint > 0 + } + Image { + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + source: "pics/bomb.png" + opacity: modelData.hasMine + } + Explosion { + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + explode: modelData.hasMine==true && modelData.flipped==true + } + } + states: [ + State { + name: "back" + when: modelData.flipped == true + SetProperty { + target: flipable + property: "rotation" + value: 180 + } + } + ] + transitions: [ + Transition { + SequentialAnimation { + PauseAnimation { + duration: {var ret = Math.abs(flipable.parent.x-field.clickx) + Math.abs(flipable.parent.y-field.clicky); if (ret > 0) {if(modelData.hasMine==true && modelData.flipped==true){ret*3;}else{ret;}} else {0}} + } + NumericAnimation { + easing: "easeInOutQuad" + properties: "rotation" + } + } + } + ] + MouseRegion { + anchors.fill: parent + onClicked: { field.clickx = flipable.parent.x; field.clicky = flipable.parent.y; row = Math.floor(index/9); col = index - (Math.floor(index/9) * 9); if(mouse.button==undefined || mouse.button==Qt.RightButton){flag(row,col);}else{flip(row,col);} } + } + } + } + ] + Image { + source: "pics/No-Ones-Laughing-3.jpg" + tile: true + } + Description { + text: "Use the 'minehunt' executable to run this demo!" + width: 300 + opacity: tiles?0:1 + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + } + Repeater { + dataSource: tiles + x: 1 + y: 1 + Component { + ComponentInstance { + component: tile + x: (index - (Math.floor(index/9) * 9)) * 41 + y: Math.floor(index/9) * 41 + } + } + } + Item { + id: gamedata + width: 370 + height: 100 + y: 380 + Text { + color: "white" + font.size: 18 + x: 20 + y: 20 + } + Image { + x: 100 + y: 20 + source: "pics/bomb-color.png" + } + Text { + x: 100 + y: 60 + color: "white" + text: numMines + } + Image { + x: 140 + y: 20 + source: "pics/flag-color.png" + } + Text { + x: 140 + y: 60 + color: "white" + text: numFlags + } + Image { + x: 240 + y: 0 + source: if(isPlaying==true){'pics/smile.png'}else{if(hasWon==true){'pics/glee.png'}else{'pics/frown.png'}} + MouseRegion { + anchors.fill: parent + onClicked: { reset() } + } + } + } +} diff --git a/examples/declarative/mouseregion/mouse.qml b/examples/declarative/mouseregion/mouse.qml index 7aaf51a..6d10425 100644 --- a/examples/declarative/mouseregion/mouse.qml +++ b/examples/declarative/mouseregion/mouse.qml @@ -1,24 +1,48 @@ -<Rect color="white" width="200" height="200"> - <Rect width="50" height="50" color="red"> - <Text text="Click" anchors.centeredIn="{parent}"/> - <MouseRegion onPressed="print('press (x: ' + mouse.x + ' y: ' + mouse.y + ' button: ' + (mouse.button == Qt.RightButton ? 'right' : 'left') + ' Shift: ' + (mouse.modifiers & Qt.ShiftModifier ? 'true' : 'false') + ')')" - onReleased="print('release (x: ' + mouse.x + ' y: ' + mouse.y + ' isClick: ' + mouse.isClick + ' wasHeld: ' + mouse.wasHeld + ')')" - onClicked="print('click (x: ' + mouse.x + ' y: ' + mouse.y + ' wasHeld: ' + mouse.wasHeld + ')')" - onDoubleClicked="print('double click (x: ' + mouse.x + ' y: ' + mouse.y + ')')" - onPressAndHold="print('press and hold')" - onExitedWhilePressed="print('exiting while pressed')" - onReenteredWhilePressed="print('reentering while pressed')" anchors.fill="{parent}"/> - </Rect> - <Rect y="100" width="50" height="50" color="blue"> - <Text text="Drag" anchors.centeredIn="{parent}"/> - <MouseRegion drag.target="{parent}" - drag.axis="x" drag.xmin="0" drag.xmax="150" - onPressed="print('press')" - onReleased="print('release (isClick: ' + mouse.isClick + ') (wasHeld: ' + mouse.wasHeld + ')')" - onClicked="print('click' + '(wasHeld: ' + mouse.wasHeld + ')')" - onDoubleClicked="print('double click')" - onPressAndHold="print('press and hold')" - onExitedWhilePressed="print('exiting while pressed')" - onReenteredWhilePressed="print('reentering while pressed')" anchors.fill="{parent}"/> - </Rect> -</Rect> +Rect { + color: "white" + width: 200 + height: 200 + Rect { + width: 50 + height: 50 + color: "red" + Text { + text: "Click" + anchors.centeredIn: parent + } + MouseRegion { + onPressed: { print('press (x: ' + mouse.x + ' y: ' + mouse.y + ' button: ' + (mouse.button == Qt.RightButton ? 'right' : 'left') + ' Shift: ' + (mouse.modifiers & Qt.ShiftModifier ? 'true' : 'false') + ')') } + onReleased: { print('release (x: ' + mouse.x + ' y: ' + mouse.y + ' isClick: ' + mouse.isClick + ' wasHeld: ' + mouse.wasHeld + ')') } + onClicked: { print('click (x: ' + mouse.x + ' y: ' + mouse.y + ' wasHeld: ' + mouse.wasHeld + ')') } + onDoubleClicked: { print('double click (x: ' + mouse.x + ' y: ' + mouse.y + ')') } + onPressAndHold: { print('press and hold') } + onExitedWhilePressed: { print('exiting while pressed') } + onReenteredWhilePressed: { print('reentering while pressed') } + anchors.fill: parent + } + } + Rect { + y: 100 + width: 50 + height: 50 + color: "blue" + Text { + text: "Drag" + anchors.centeredIn: parent + } + MouseRegion { + drag.target: parent + drag.axis: "x" + drag.xmin: 0 + drag.xmax: 150 + onPressed: { print('press') } + onReleased: { print('release (isClick: ' + mouse.isClick + ') (wasHeld: ' + mouse.wasHeld + ')') } + onClicked: { print('click' + '(wasHeld: ' + mouse.wasHeld + ')') } + onDoubleClicked: { print('double click') } + onPressAndHold: { print('press and hold') } + onExitedWhilePressed: { print('exiting while pressed') } + onReenteredWhilePressed: { print('reentering while pressed') } + anchors.fill: parent + } + } +} diff --git a/examples/declarative/velocity/Day.qml b/examples/declarative/velocity/Day.qml index b65f2bc..7d26e88 100644 --- a/examples/declarative/velocity/Day.qml +++ b/examples/declarative/velocity/Day.qml @@ -1,41 +1,115 @@ -<Rect width="400" height="500" radius="7" pen.color="black" id="Page"> - <properties> - <Property name="day" type="string" /> - <Property name="stickies" /> - </properties> - - <Image x="10" y="10" source="cork.jpg" opaque="true"/> - <Text x="20" y="20" height="40" font.size="14" font.bold="true" width="370" text="{day}" style="Outline" styleColor="#dedede"/> - - <Repeater dataSource="{Page.stickies}"> - <Item x="{Math.random() * 200 + 100}" y="{Math.random() * 300 + 50}" id="StickyPage"> - <rotation> - <Follow source="{-Flick.xVelocity / 100}" spring="2.0" damping="0.1"/> - </rotation> - <Item id="Sticky" scale="0.5"> - <Image id="StickyImage" source="sticky.png" smooth="true" y="-20" x="{8 + -width * 0.6 / 2}" scale="0.6" /> - <TextEdit id="MyText" smooth="true" font.size="28" readOnly="false" x="-104" y="36" wrap="true" rotation="-8" text="{noteText}" width="195" height="172" /> - <Item y="-20" x="{StickyImage.x}" width="{StickyImage.width * StickyImage.scale}" height="{StickyImage.height * StickyImage.scale}" > - <MouseRegion id="Mouse" onClicked="MyText.focus = true" anchors.fill="{parent}" drag.target="{StickyPage}" drag.axis="xy" drag.ymin="0" drag.ymax="500" drag.xmin="0" drag.xmax="400"/> - </Item> - </Item> - <Image source="tack.png" x="{-width / 2}" y="{-height * 0.7 / 2}" scale="0.7" /> - - <states> - <State name="pressed" when="{Mouse.pressed}"> - <SetProperties target="{Sticky}" rotation="8" scale="1"/> - <SetProperties target="{Page}" z="8"/> - </State> - </states> - <transitions> - <Transition> - <NumericAnimation properties="rotation,scale" duration="200"/> - </Transition> - </transitions> - </Item> - </Repeater> - - - - -</Rect> +Rect { + width: 400 + height: 500 + radius: 7 + pen.color: "black" + id: Page + properties: Property { + name: "day" + type: "string" + } + properties: Property { + name: "stickies" + } + Image { + x: 10 + y: 10 + source: "cork.jpg" + opaque: true + } + Text { + x: 20 + y: 20 + height: 40 + font.size: 14 + font.bold: true + width: 370 + text: day + style: Outline + styleColor: "#dedede" + } + Repeater { + dataSource: Page.stickies + Item { + x: Math.random() * 200 + 100 + y: Math.random() * 300 + 50 + id: StickyPage + rotation: Follow { + source: -Flick.xVelocity / 100 + spring: 2.0 + damping: 0.1 + } + Item { + id: Sticky + scale: 0.5 + Image { + id: StickyImage + source: "sticky.png" + smooth: true + y: -20 + x: 8 + -width * 0.6 / 2 + scale: 0.6 + } + TextEdit { + id: MyText + smooth: true + font.size: 28 + readOnly: false + x: -104 + y: 36 + wrap: true + rotation: -8 + text: noteText + width: 195 + height: 172 + } + Item { + y: -20 + x: StickyImage.x + width: StickyImage.width * StickyImage.scale + height: StickyImage.height * StickyImage.scale + MouseRegion { + id: Mouse + onClicked: { MyText.focus = true } + anchors.fill: parent + drag.target: StickyPage + drag.axis: "xy" + drag.ymin: 0 + drag.ymax: 500 + drag.xmin: 0 + drag.xmax: 400 + } + } + } + Image { + source: "tack.png" + x: -width / 2 + y: -height * 0.7 / 2 + scale: 0.7 + } + states: [ + State { + name: "pressed" + when: Mouse.pressed + SetProperties { + target: Sticky + rotation: 8 + scale: 1 + } + SetProperties { + target: Page + z: 8 + } + } + ] + transitions: [ + Transition { + NumericAnimation { + properties: "rotation,scale" + duration: 200 + } + } + ] + } + } +} diff --git a/examples/declarative/velocity/velocity.qml b/examples/declarative/velocity/velocity.qml index 0215d37..ff95527 100644 --- a/examples/declarative/velocity/velocity.qml +++ b/examples/declarative/velocity/velocity.qml @@ -1,81 +1,113 @@ -<Rect color="lightSteelBlue" width="800" height="600"> - <ListModel id="List"> - <Day> - <name>Sunday</name> - <dayColor>#808080</dayColor> - <notes> - <Note noteText="Lunch" /> - <Note noteText="Party" /> - </notes> - </Day> - <Day> - <name>Monday</name> - <dayColor>blue</dayColor> - <notes> - <Note noteText="Pickup kids" /> - <Note noteText="Checkout kinetic" /> - <Note noteText="Read email" /> - </notes> - </Day> - <Day> - <name>Tuesday</name> - <dayColor>yellow</dayColor> - <notes> - <Note noteText="Walk dog" /> - <Note noteText="Buy newspaper" /> - </notes> - </Day> - <Day> - <name>Wednesday</name> - <dayColor>purple</dayColor> - <notes> - <Note noteText="Cook dinner" /> - <Note noteText="Eat dinner" /> - </notes> - </Day> - <Day> - <name>Thursday</name> - <dayColor>blue</dayColor> - <notes> - <Note noteText="5:30pm Meeting" /> - <Note noteText="Weed garden" /> - </notes> - </Day> - <Day> - <name>Friday</name> - <dayColor>green</dayColor> - <notes> - <Note noteText="Still work" /> - <Note noteText="Drink" /> - </notes> - </Day> - <Day> - <name>Saturday</name> - <dayColor>orange</dayColor> - <notes> - <Note noteText="Drink" /> - <Note noteText="Drink" /> - </notes> - </Day> - </ListModel> - - <Flickable id="Flick" anchors.fill="{parent}" viewportWidth="{Lay.width}"> - <HorizontalLayout id="Lay"> - <Repeater dataSource="{List}"> - <Component> - <Day day="{name}" color="{dayColor}" stickies="{notes}"/> - </Component> - </Repeater> - <!-- - <Day color="#808080" day="Sunday" /> - <Day color="blue" day="Monday"/> - <Day color="yellow" day="Tuesday"/> - <Day color="purple" day="Wednesday"/> - <Day color="blue" day="Thursday"/> - <Day color="green" day="Friday"/> - <Day color="orange" day="Saturday"/> - --> - </HorizontalLayout> - </Flickable> - -</Rect> +Rect { + color: "lightSteelBlue" + width: 800 + height: 600 + ListModel2 { + id: List + ListElement { + name: "Sunday" + dayColor: "#808080" + notes: [ + ListElement { + noteText: "Lunch" + }, + ListElement { + noteText: "Party" + } + ] + } + ListElement { + name: "Monday" + dayColor: "blue" + notes: [ + ListElement { + noteText: "Pickup kids" + }, + ListElement { + noteText: "Checkout kinetic" + }, + ListElement { + noteText: "Read email" + } + ] + } + ListElement { + name: "Tuesday" + dayColor: "yellow" + notes: [ + ListElement { + noteText: "Walk dog" + }, + ListElement { + noteText: "Buy newspaper" + } + ] + } + ListElement { + name: "Wednesday" + dayColor: "purple" + notes: [ + ListElement { + noteText: "Cook dinner" + }, + ListElement { + noteText: "Eat dinner" + } + ] + } + ListElement { + name: "Thursday" + dayColor: "blue" + notes: [ + ListElement { + noteText: "5:30pm Meeting" + }, + ListElement { + noteText: "Weed garden" + } + ] + } + ListElement { + name: "Friday" + dayColor: "green" + notes: [ + ListElement { + noteText: "Still work" + }, + ListElement { + noteText: "Drink" + } + ] + } + ListElement { + name: "Saturday" + dayColor: "orange" + notes: [ + ListElement { + noteText: "Drink" + }, + ListElement { + noteText: "Drink" + } + ] + } + } + Flickable { + id: Flick + anchors.fill: parent + viewportWidth: Lay.width + HorizontalLayout { + id: Lay + Repeater { + dataSource: List + Component { + Day { + day: name + color: dayColor + stickies: notes + } + } + } + } + } +} diff --git a/examples/declarative/xmldata/daringfireball.qml b/examples/declarative/xmldata/daringfireball.qml index 5e98d1b..3877adf 100644 --- a/examples/declarative/xmldata/daringfireball.qml +++ b/examples/declarative/xmldata/daringfireball.qml @@ -1,25 +1,59 @@ -<Rect color="white" width="600" height="600"> - <resources> - <XmlListModel id="feedModel" source="http://daringfireball.net/index.xml" - query="doc($src)/feed/entry"> - <namespaceDeclarations> - declare default element namespace 'http://www.w3.org/2005/Atom'; - </namespaceDeclarations> - <Role name="title" query="title/string()"/> - <Role name="tagline" query="author/name/string()"/> - <Role name="content" query="content/string()" isCData="true"/> - </XmlListModel> - <Component id="feedDelegate"> - <Item height="{contents.height + 20}"> - <Text x="10" id="TitleText" text="{title}" font.bold="true"/> - <Text text="{'by ' + tagline}" anchors.left="{TitleText.right}" anchors.leftMargin="10" font.italic="true"/> - <Text x="10" text="{content}" anchors.top="{TitleText.bottom}" width="580" wrap="true"> - <onLinkActivated>print('link clicked: ' + link)</onLinkActivated> - </Text> - </Item> - </Component> - </resources> - - <ListView id="list" anchors.fill="{parent}" clip="true" - model="{feedModel}" delegate="{feedDelegate}"/> -</Rect> +Rect { + color: "white" + width: 600 + height: 600 + resources: [ + XmlListModel { + id: feedModel + source: "http://daringfireball.net/index.xml" + query: "doc($src)/feed/entry" + namespaceDeclarations: "declare default element namespace 'http://www.w3.org/2005/Atom';" + Role { + name: "title" + query: "title/string()" + } + Role { + name: "tagline" + query: "author/name/string()" + } + Role { + name: "content" + query: "content/string()" + isCData: true + } + }, + Component { + id: feedDelegate + Item { + height: contents.height + 20 + Text { + x: 10 + id: TitleText + text: title + font.bold: true + } + Text { + text: 'by ' + tagline + anchors.left: TitleText.right + anchors.leftMargin: 10 + font.italic: true + } + Text { + x: 10 + text: content + anchors.top: TitleText.bottom + width: 580 + wrap: true + onLinkActivated: { print('link clicked: ' + link) } + } + } + } + ] + ListView { + id: list + anchors.fill: parent + clip: true + model: feedModel + delegate: feedDelegate + } +} diff --git a/examples/declarative/xmldata/yahoonews.qml b/examples/declarative/xmldata/yahoonews.qml index 32a706e..a465cdd 100644 --- a/examples/declarative/xmldata/yahoonews.qml +++ b/examples/declarative/xmldata/yahoonews.qml @@ -1,38 +1,111 @@ -<Rect color="black" gradientColor="#AAAAAA" width="600" height="600"> - <resources> - <XmlListModel id="feedModel" source="http://rss.news.yahoo.com/rss/oceania" query="doc($src)/rss/channel/item"> - <Role name="title" query="title/string()"/> - <Role name="link" query="link/string()"/> - <Role name="description" query="description/string()" isCData="true"/> - </XmlListModel> - <Component id="feedDelegate"> - <Item id="Delegate" height="{Wrapper.height + 10}"> - <MouseRegion anchors.fill="{Wrapper}" onPressed="Delegate.ListView.list.currentIndex = index;" - onClicked="if (Wrapper.state == 'Details') { Wrapper.state = '';} else {Wrapper.state = 'Details';}"/> - <Rect id="Wrapper" y="5" height="{TitleText.height + 10}" width="580" color="#F0F0F0" radius="5"> - <Text x="10" y="5" id="TitleText" text="{'<a href=\'' + link + '\'>' + title + '</a>'}" font.bold="true" font.family="Helvetica" font.size="14" onLinkActivated="print('link clicked: ' + link)"/> - <Text x="10" id="Description" text="{description}" width="560" wrap="true" font.family="Helvetica" - anchors.top="{TitleText.bottom}" anchors.topMargin="5" opacity="0"/> - - <states> - <State name="Details"> - <SetProperty target="{Wrapper}" property="height" binding="contents.height + 10"/> - <SetProperty target="{Description}" property="opacity" value="1"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="Details" reversible="true"> - <SequentialAnimation> - <NumericAnimation duration="200" properties="height" easing="easeOutQuad"/> - <NumericAnimation duration="200" properties="opacity"/> - </SequentialAnimation> - </Transition> - </transitions> - </Rect> - </Item> - </Component> - </resources> - - <ListView id="list" x="10" y="10" width="{parent.width - 20}" height="{parent.height - 20}" clip="true" - model="{feedModel}" delegate="{feedDelegate}" currentItemPositioning="Snap"/> -</Rect> +Rect { + color: "black" + gradientColor: "#AAAAAA" + width: 600 + height: 600 + resources: [ + XmlListModel { + id: feedModel + source: "http://rss.news.yahoo.com/rss/oceania" + query: "doc($src)/rss/channel/item" + Role { + name: "title" + query: "title/string()" + } + Role { + name: "link" + query: "link/string()" + } + Role { + name: "description" + query: "description/string()" + isCData: true + } + }, + Component { + id: feedDelegate + Item { + id: Delegate + height: Wrapper.height + 10 + MouseRegion { + anchors.fill: Wrapper + onPressed: { Delegate.ListView.list.currentIndex = index; } + onClicked: { if (Wrapper.state == 'Details') { Wrapper.state = '';} else {Wrapper.state = 'Details';} } + } + Rect { + id: Wrapper + y: 5 + height: TitleText.height + 10 + width: 580 + color: "#F0F0F0" + radius: 5 + Text { + x: 10 + y: 5 + id: TitleText + text: '<a href=\'' + link + '\'>' + title + '</a>' + font.bold: true + font.family: "Helvetica" + font.size: 14 + onLinkActivated: { print('link clicked: ' + link) } + } + Text { + x: 10 + id: Description + text: description + width: 560 + wrap: true + font.family: "Helvetica" + anchors.top: TitleText.bottom + anchors.topMargin: 5 + opacity: 0 + } + states: [ + State { + name: "Details" + SetProperty { + target: Wrapper + property: "height" + binding: "contents.height + 10" + } + SetProperty { + target: Description + property: "opacity" + value: 1 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "Details" + reversible: true + SequentialAnimation { + NumericAnimation { + duration: 200 + properties: "height" + easing: "easeOutQuad" + } + NumericAnimation { + duration: 200 + properties: "opacity" + } + } + } + ] + } + } + } + ] + ListView { + id: list + x: 10 + y: 10 + width: parent.width - 20 + height: parent.height - 20 + clip: true + model: feedModel + delegate: feedDelegate + currentItemPositioning: "Snap" + } +} diff --git a/src/declarative/fx/qfxkeyactions.cpp b/src/declarative/fx/qfxkeyactions.cpp index 69d4679..d2739ea 100644 --- a/src/declarative/fx/qfxkeyactions.cpp +++ b/src/declarative/fx/qfxkeyactions.cpp @@ -736,7 +736,7 @@ void QFxKeyActions::setKey_Space(const QString &s) /*! \qmlproperty string KeyActions::escape - \qmlproperty string KeyActions::return + \qmlproperty string KeyActions::keyReturn \qmlproperty string KeyActions::enter \qmlproperty string KeyActions::delete \qmlproperty string KeyActions::space diff --git a/src/declarative/fx/qfxkeyactions.h b/src/declarative/fx/qfxkeyactions.h index 7ad323a..b0d002d 100644 --- a/src/declarative/fx/qfxkeyactions.h +++ b/src/declarative/fx/qfxkeyactions.h @@ -101,7 +101,7 @@ class Q_DECLARATIVE_EXPORT QFxKeyActions : public QFxItem Q_PROPERTY(QString digit9 READ key_9 WRITE setKey_9) Q_PROPERTY(QString asterisk READ key_Asterisk WRITE setKey_Asterisk) Q_PROPERTY(QString escape READ key_Escape WRITE setKey_Escape) - Q_PROPERTY(QString return READ key_Return WRITE setKey_Return) + Q_PROPERTY(QString keyReturn READ key_Return WRITE setKey_Return) Q_PROPERTY(QString enter READ key_Enter WRITE setKey_Enter) Q_PROPERTY(QString delete READ key_Delete WRITE setKey_Delete) Q_PROPERTY(QString space READ key_Space WRITE setKey_Space) |