summaryrefslogtreecommitdiffstats
path: root/demos/declarative
diff options
context:
space:
mode:
authorIan Walters <ian.walters@nokia.com>2009-04-23 05:42:13 (GMT)
committerIan Walters <ian.walters@nokia.com>2009-04-23 05:42:13 (GMT)
commit0af965285378ae51ac98dfade94f216761449459 (patch)
tree63284a53d9932b1202cad495c5e1bd2ebec208ae /demos/declarative
parent6f089aec4e6c396ce45dcab0bd58e2dda23adce1 (diff)
parent2595bf1dd0252027ebba409f8f81d906ab9c099c (diff)
downloadQt-0af965285378ae51ac98dfade94f216761449459.zip
Qt-0af965285378ae51ac98dfade94f216761449459.tar.gz
Qt-0af965285378ae51ac98dfade94f216761449459.tar.bz2
Merge branch 'kinetic-declarativeui' of git@scm.dev.nokia.troll.no:qt/kinetic into kinetic-declarativeui
Diffstat (limited to 'demos/declarative')
-rw-r--r--demos/declarative/webbrowser/README3
-rw-r--r--demos/declarative/webbrowser/WebBrowser.qml175
-rw-r--r--demos/declarative/webbrowser/content/pics/addressbar-filled.pngbin996 -> 694 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/addressbar.pngbin867 -> 467 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/back-disabled.pngbin1035 -> 475 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/back.pngbin1113 -> 707 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/footer.pngbin588 -> 200 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/forward-disabled.pngbin1044 -> 471 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/forward.pngbin1120 -> 682 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/header.pngbin304 -> 193 bytes
-rw-r--r--demos/declarative/webbrowser/content/pics/reload.pngbin1709 -> 1283 bytes
-rw-r--r--demos/declarative/webbrowser/webbrowser.qml175
12 files changed, 177 insertions, 176 deletions
diff --git a/demos/declarative/webbrowser/README b/demos/declarative/webbrowser/README
index a081e30..7bfd41f 100644
--- a/demos/declarative/webbrowser/README
+++ b/demos/declarative/webbrowser/README
@@ -1,5 +1,6 @@
For good performance, be sure to use disk cache for remote content:
- duiviewer -cache WebBrowser.qml
+ duiviewer -cache webbrowser.qml
Otherwise everything always re-loads over the network.
+
diff --git a/demos/declarative/webbrowser/WebBrowser.qml b/demos/declarative/webbrowser/WebBrowser.qml
deleted file mode 100644
index 08b94e3..0000000
--- a/demos/declarative/webbrowser/WebBrowser.qml
+++ /dev/null
@@ -1,175 +0,0 @@
-<?qtfx namespacepath:=content?>
-<Item width="320" height="500" id="webbrowser" state="Normal">
- <properties><Property name="url" value="http://www.qtsoftware.com"/></properties>
- <Script>
- function zoomOut() {
- webbrowser.state = "ZoomedOut";
- }
- function toggleZoom() {
- if(webbrowser.state == "ZoomedOut") {
- flick.centerX = webview.mouseX;
- flick.centerY = webview.mouseY;
- webbrowser.state = "Normal";
- } else {
- zoomOut();
- }
- }
- </Script>
-
- <Item id="webpanel" anchors.fill="{parent}" clip="true">
- <Rect color="#555555" anchors.fill="{parent}"/>
- <Image src="content/pics/softshadow-bottom.png" width="{webpanel.width}" height="16" />
- <Image src="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 &lt; 0
- ? -flick.xPosition
- : flick.xPosition &gt; flick.viewportWidth-flick.width
- ? -flick.xPosition+flick.viewportWidth-flick.width
- : 0}"
- y="{flick.yPosition &lt; 0 ? -flick.yPosition : progressoff*(flick.yPosition>height?-height:-flick.yPosition)}"
- height="60" src="content/pics/header.png">
- <Text id="header_text" text="{webview.title!='' || webview.progress == 1.0 ? webview.title : 'Loading...'}"
- color="#000000"
- font.family="Helvetica" font.size="9" 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="{header_text.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 src="content/pics/addressbar.sci" anchors.fill="{urlbox}"/>
- <Image id="urlboxhl" src="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 &lt; 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" src="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" src="content/pics/back.png" />
- <Image anchors.fill="{parent}" id="back_d" src="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" src="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" src="content/pics/forward.png" />
- <Image anchors.fill="{parent}" id="forward_d" src="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>
diff --git a/demos/declarative/webbrowser/content/pics/addressbar-filled.png b/demos/declarative/webbrowser/content/pics/addressbar-filled.png
index c793a10..d8452ec 100644
--- a/demos/declarative/webbrowser/content/pics/addressbar-filled.png
+++ b/demos/declarative/webbrowser/content/pics/addressbar-filled.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/addressbar.png b/demos/declarative/webbrowser/content/pics/addressbar.png
index 9b8e2c9..3278f58 100644
--- a/demos/declarative/webbrowser/content/pics/addressbar.png
+++ b/demos/declarative/webbrowser/content/pics/addressbar.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/back-disabled.png b/demos/declarative/webbrowser/content/pics/back-disabled.png
index 0ca0701..91b9e76 100644
--- a/demos/declarative/webbrowser/content/pics/back-disabled.png
+++ b/demos/declarative/webbrowser/content/pics/back-disabled.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/back.png b/demos/declarative/webbrowser/content/pics/back.png
index 3e88a6c..9988dd3 100644
--- a/demos/declarative/webbrowser/content/pics/back.png
+++ b/demos/declarative/webbrowser/content/pics/back.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/footer.png b/demos/declarative/webbrowser/content/pics/footer.png
index f5fe95f..8391a93 100644
--- a/demos/declarative/webbrowser/content/pics/footer.png
+++ b/demos/declarative/webbrowser/content/pics/footer.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/forward-disabled.png b/demos/declarative/webbrowser/content/pics/forward-disabled.png
index 573aaa4..cb87f4f 100644
--- a/demos/declarative/webbrowser/content/pics/forward-disabled.png
+++ b/demos/declarative/webbrowser/content/pics/forward-disabled.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/forward.png b/demos/declarative/webbrowser/content/pics/forward.png
index d4eb026..83870ee 100644
--- a/demos/declarative/webbrowser/content/pics/forward.png
+++ b/demos/declarative/webbrowser/content/pics/forward.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/header.png b/demos/declarative/webbrowser/content/pics/header.png
index c4aff2e..26588c3 100644
--- a/demos/declarative/webbrowser/content/pics/header.png
+++ b/demos/declarative/webbrowser/content/pics/header.png
Binary files differ
diff --git a/demos/declarative/webbrowser/content/pics/reload.png b/demos/declarative/webbrowser/content/pics/reload.png
index fa4d033..45b5535 100644
--- a/demos/declarative/webbrowser/content/pics/reload.png
+++ b/demos/declarative/webbrowser/content/pics/reload.png
Binary files differ
diff --git a/demos/declarative/webbrowser/webbrowser.qml b/demos/declarative/webbrowser/webbrowser.qml
new file mode 100644
index 0000000..7618f4d
--- /dev/null
+++ b/demos/declarative/webbrowser/webbrowser.qml
@@ -0,0 +1,175 @@
+<?qtfx namespacepath:=content?>
+<Item width="640" height="480" id="WebBrowser" state="Normal">
+ <properties><Property name="url" value="http://www.qtsoftware.com"/></properties>
+ <Script>
+ function zoomOut() {
+ WebBrowser.state = "ZoomedOut";
+ }
+ function toggleZoom() {
+ if(WebBrowser.state == "ZoomedOut") {
+ Flick.centerX = WebView.mouseX;
+ Flick.centerY = WebView.mouseY;
+ WebBrowser.state = "Normal";
+ } else {
+ zoomOut();
+ }
+ }
+ </Script>
+
+ <Item id="WebPanel" anchors.fill="{parent}" clip="true">
+ <Rect color="#555555" anchors.fill="{parent}"/>
+ <Image src="content/pics/softshadow-bottom.png" width="{WebPanel.width}" height="16" />
+ <Image src="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 &lt; 0
+ ? -Flick.xPosition
+ : Flick.xPosition &gt; Flick.viewportWidth-Flick.width
+ ? -Flick.xPosition+Flick.viewportWidth-Flick.width
+ : 0}"
+ y="{Flick.yPosition &lt; 0 ? -Flick.yPosition : progressOff*(Flick.yPosition>height?-height:-Flick.yPosition)}"
+ height="64" src="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 src="content/pics/addressbar.sci" anchors.fill="{UrlBox}"/>
+ <Image id="UrlBoxhl" src="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 &lt; 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" src="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" src="content/pics/back.png" />
+ <Image anchors.fill="{parent}" id="back_d" src="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" src="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" src="content/pics/forward.png" />
+ <Image anchors.fill="{parent}" id="forward_d" src="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>