Quick Widgets: Difference between revisions
From Maemo Wiki
Jump to navigationJump to search
imported>greatgonzo No edit summary |
imported>greatgonzo No edit summary |
||
| Line 20: | Line 20: | ||
== Basic Example == | == Basic Example == | ||
=== Web Browser widget === | |||
<source lang="javascript"> | |||
import Qt 4.7 | |||
import QtWebKit 1.0 | |||
Item { | |||
// Modify these to customize | |||
// widget width | |||
width: 300 | |||
// widget height | |||
height: 350 | |||
// the url to display | |||
property string url: "http://touch.facebook.com" | |||
// the optimum width for the website. The page is scaled down | |||
// from this width to the widget's width | |||
property int optimal_width: 340 | |||
// interval when to reload the page | |||
// setting it to 0 means never refresh | |||
property real reload_in_minutes: 10 | |||
// end user mods. | |||
id: main | |||
MouseArea { | |||
anchors.right: parent.right | |||
width: 30 | |||
height: parent.height | |||
onClicked: { | |||
} | |||
} | |||
Rectangle { | |||
anchors.fill: parent | |||
radius: 10 | |||
color: "gray" | |||
opacity: 0.6 | |||
} | |||
Text { | |||
id: txt | |||
anchors.centerIn: parent | |||
text: "loading..." | |||
color: "white" | |||
} | |||
WebView { | |||
id: browser | |||
transformOrigin: Item.TopLeft | |||
property bool scaled: false | |||
smooth: true | |||
visible: false | |||
preferredWidth: optimal_width | |||
preferredHeight: parent.height | |||
url: parent.url | |||
Behavior on y { PropertyAnimation {} } | |||
onUrlChanged: { | |||
y = 0 | |||
} | |||
onLoadFinished: { | |||
if (!scaled) { | |||
browser.contentsScale = main.width/browser.width | |||
scaled = true; | |||
} | |||
browser.visible = true | |||
//console.log('loaded') | |||
txt.z = 0 | |||
} | |||
} | |||
MouseArea { | |||
anchors.right: parent.right | |||
width: 30 | |||
height: parent.height | |||
onClicked: { | |||
var inc = main.height*0.9 | |||
if (mouse.y > main.height/2) { | |||
var dy = Math.min(inc, | |||
browser.contentsSize.height-main.height+browser.y) | |||
browser.y -= dy | |||
} else { | |||
var dy = Math.min(inc, Math.abs(browser.y)) | |||
browser.y += dy | |||
} | |||
} | |||
} | |||
Timer { | |||
id: refresh | |||
interval: 1000*60*parent.reload_in_minutes | |||
running: runtime.isActiveWindow | |||
repeat: true | |||
onTriggered: { txt.z = 1 | |||
browser.reload.trigger() | |||
} | |||
} | |||
} | |||
</source> | |||
== User Contributed scripts == | == User Contributed scripts == | ||
* /opt/quick-widgets/examples/process.qml | * /opt/quick-widgets/examples/process.qml | ||
== API == | |||
document qmlprocess here... | |||
== Thanks == | == Thanks == | ||
venemo and the Nokia Qt labs | venemo and the Nokia Qt labs | ||
Revision as of 02:19, 24 November 2010
quick-widgets is an application to facilitate creating and deploying home screen widgets.
see thread on talk
Features
- run Qt Quick applications as home widgets
- suspend widget when not on current home screen
- access to system calls in QML (wrapping QProcess)
- fix widget to size or let content determine the size
- restore after reboot/crash
Wish list
- base widgets
- more event bindings directly in qml
Basic Example
Web Browser widget
<source lang="javascript"> import Qt 4.7 import QtWebKit 1.0
Item {
// Modify these to customize
// widget width width: 300
// widget height height: 350
// the url to display property string url: "http://touch.facebook.com"
// the optimum width for the website. The page is scaled down // from this width to the widget's width property int optimal_width: 340
// interval when to reload the page // setting it to 0 means never refresh property real reload_in_minutes: 10
// end user mods.
id: main
MouseArea {
anchors.right: parent.right
width: 30 height: parent.height onClicked: {
}
}
Rectangle {
anchors.fill: parent
radius: 10
color: "gray" opacity: 0.6
}
Text {
id: txt
anchors.centerIn: parent
text: "loading..." color: "white"
}
WebView {
id: browser
transformOrigin: Item.TopLeft
property bool scaled: false
smooth: true visible: false
preferredWidth: optimal_width
preferredHeight: parent.height
url: parent.url
Behavior on y { PropertyAnimation {} }
onUrlChanged: {
y = 0
}
onLoadFinished: {
if (!scaled) {
browser.contentsScale = main.width/browser.width
scaled = true;
}
browser.visible = true
//console.log('loaded')
txt.z = 0
}
}
MouseArea {
anchors.right: parent.right
width: 30 height: parent.height onClicked: {
var inc = main.height*0.9
if (mouse.y > main.height/2) {
var dy = Math.min(inc,
browser.contentsSize.height-main.height+browser.y)
browser.y -= dy
} else {
var dy = Math.min(inc, Math.abs(browser.y))
browser.y += dy
}
}
}
Timer {
id: refresh
interval: 1000*60*parent.reload_in_minutes
running: runtime.isActiveWindow repeat: true
onTriggered: { txt.z = 1
browser.reload.trigger()
}
}
} </source>
User Contributed scripts
- /opt/quick-widgets/examples/process.qml
API
document qmlprocess here...
Thanks
venemo and the Nokia Qt labs