{"id":1946,"date":"2012-04-03T00:58:14","date_gmt":"2012-04-02T20:58:14","guid":{"rendered":"http:\/\/vizZzion.org\/blog\/?p=1946"},"modified":"2012-04-03T01:36:30","modified_gmt":"2012-04-02T23:36:30","slug":"new-plasma-quick-module-plasmaextras","status":"publish","type":"post","link":"https:\/\/vizZzion.org\/blog\/2012\/04\/new-plasma-quick-module-plasmaextras\/","title":{"rendered":"new Plasma  Quick module: PlasmaExtras"},"content":{"rendered":"<p><em>Plasma Quick is KDE Plasma&#8217;s user interface toolkit which brings system and data integration, theming and artwork and tools to build workspace and mobile applications to the world of QtQuick. Plasma Quick provides everything needed to build high-quality apps. PlasmaExtras provides an extended set of Plasma QtQuick components.<\/em><a href=\"http:\/\/vizzzion.org\/images\/blog\/active\/active-microblog-alpha.png\"><img loading=\"lazy\" decoding=\"async\" width=\"540\" height=\"319\" title=\"Active Microblog using Plasma Components and Plasma Extras\" src=\"http:\/\/vizzzion.org\/images\/blog\/active\/active-microblog-alpha_thumb.png\" alt=\"Active Microblog using Plasma Components and Plasma Extras\"><\/a><\/p>\n<p>In Plasma 4.8, we released a set of QtQuick (QML) components that are providing an implementation of Qt Quick&#8217;s standard component API. While QtQuick itself only provides very basic components for texts, for example, Plasma Component&#8217;s Text Input adds an integrated look &#038; feel to them. Often, you will find that in your app, you&#8217;ll also need a few higher level widgets, ui elements with a higher degree of intgration. PlasmaExtras has now been added to our git master tree, so it will be released with KDE SC 4.9 in July.<\/p>\n<p>So, what does PlasmaExtras contain right now? One very important thing is that it adds an image loader, which allows the runtime to resolve theme-internal URLs, such as <em> image:\/\/appbackgrounds\/contextarea<\/em>, giving you themed application backgrounds.<\/p>\n<p><strong>ResourceInstance<\/strong> adds support for <a href=\"http:\/\/www.notmart.org\/index.php\/Software\/Share,_Like_and_Connect\">Share Like Connect<\/a>. Basically, ResourceInstance exports the currently viewed or active document (or &#8220;Thing&#8221; really), identified by a url and a name. Share Like Connect provides a standardised mechanism to share and &#8220;like&#8221; information. It also gives you the tools to connect a document to an Activity, which makes collecting information on a certain topic easy. Adding share like connect support to your application becomes as easy as:<\/p>\n<pre>\n\/\/ Example in an imaginary webbrowser\nimport org.kde.plasma.extras 0.1 as PlasmaExtras\n[...]\n    PlasmaExtras.ResourceInstance {\n        uri: webbrowser.currentUrl\n        name: webbrowser.pageTitle\n    }\n<\/pre>\n<\/p>\n<p>A default set of <strong>animations<\/strong> allows the developer to streamline app-internal animations with the rest of the ui. It also allows us to provide a set of high-quality and fast animations, app developers can just reuse them in their ui:<\/p>\n<pre>\nButton {\n    [...]\n    onClicked: PlasmaExtras.AppearAnimation { targetItem: infoPopup }\n}\n<\/pre>\n<p>If you want to do some work in the background while the animation is playing, you can do it like this:<\/p>\n<pre>\nonClicked: ParallelAnimation {\n    ScriptAction { script: thisFunctionMayTakeAWhile() }\n    AppearAnimation { targetItem: infoPopup }\n} \n<\/pre>\n<p>The ParallelAnimation, which we compose when our button is clicked will start all its children at once. A ScriptAction is not an animation per se, but runs a bit of inlined javascript (usually, you can just call another function here which does the real work). Both are run in parallel, so this pattern can be used to hide computational tasks in an elegant way. This way, you can of course also combine animations, or run them in sequence (using SequentialAnimation { &#8230; }). <\/p>\n<p>We&#8217;ve also added a few Label subclasses, <a href=\"http:\/\/api.kde.org\/4.x-api\/plasma-qml-apidocs\/Title.html\">Title<\/a>, <a href=\"http:\/\/api.kde.org\/4.x-api\/plasma-qml-apidocs\/Heading.html\">Heading<\/a> and <a href=\"http:\/\/api.kde.org\/4.x-api\/plasma-qml-apidocs\/Paragraph.html\">Paragraph<\/a>, which theme the standard Plasma Components <a href=\"http:\/\/api.kde.org\/4.x-api\/plasma-qml-apidocs\/Label.html\">Label<\/a> to provide more consistent layout of static texts.<\/p>\n<pre>\nimport org.kde.plasma.extras 0.1 as PlasmaExtras\n[...]\nColumn{\n    PlasmaExtras.Title { text: \"Fruit sweetness on the rise\" }\n    PlasmaExtras.Heading { text: \"Apples in the sunlight\"; level: 2 }\n    PlasmaExtras.Paragraph { text: \"Long text about fruit and apples [...]\" }\n    [...]\n}\n<\/pre>\n<\/p>\n<p><a href=\"http:\/\/vizzzion.org\/images\/blog\/active\/plasmaextras-gallery.png\"><img loading=\"lazy\" decoding=\"async\" width=\"400\" height=\"239\" title=\"PlasmaExtras QtQuick components\" src=\"http:\/\/vizzzion.org\/images\/blog\/active\/plasmaextras-gallery_thumb.png\" alt=\"PlasmaExtras QtQuick components\"><\/a><\/p>\n<p>There is also an experimental <a href=\"http:\/\/api.kde.org\/4.x-api\/plasma-qml-apidocs\/App.html\">App<\/a> class in PlasmaExtras. The goal of this component is a container for apps that is adaptive to the device. It provides a basic workflow pattern around different parts of your app and navigation between them. This is achieved by providing separate areas, such as toolbars, navigation and content. Since we&#8217;re still experimenting a bit with this stuff, this one needs a bit more work.<\/p>\n<p>More examples can be found in the gallery app, which is also shown in the screenshot, it&#8217;s in the kde-runtime git module under kde-runtime\/plasma\/declarativeimports\/test\/. The <a href=\"http:\/\/api.kde.org\/4.x-api\/plasma-qml-apidocs\/\">API documentation<\/a> gives you an overview about available classes, properties and signals, and also contains code examples. Over time, I expect PlasmaExtras to grow a bit and provide more useful things for developers.<\/p>\n<p>Most of these components have already been in use for some time in Plasma Active. they&#8217;ve now &#8220;moved up&#8221; in the hierarchy being made available on more systems. They are a nice example how work is shared across formfactors in Plasma, and how the Desktop UI benefits from development on mobile systems.<\/p>\n<p>Happy hacking!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Plasma Quick is KDE Plasma&#8217;s user interface toolkit which brings system and data integration, theming and artwork and tools to build workspace and mobile applications to the world of QtQuick. Plasma Quick provides everything needed to build high-quality apps. PlasmaExtras provides an extended set of Plasma QtQuick components. In Plasma 4.8, we released a set&hellip; <a class=\"more-link\" href=\"https:\/\/vizZzion.org\/blog\/2012\/04\/new-plasma-quick-module-plasmaextras\/\">Continue reading <span class=\"screen-reader-text\">new Plasma  Quick module: PlasmaExtras<\/span> <span class=\"meta-nav\" aria-hidden=\"true\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[23,22,29,32,35],"tags":[],"class_list":["post-1946","post","type-post","status-publish","format-standard","hentry","category-active","category-english","category-kde","category-plasma","category-qt"],"_links":{"self":[{"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/posts\/1946","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/comments?post=1946"}],"version-history":[{"count":5,"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/posts\/1946\/revisions"}],"predecessor-version":[{"id":1951,"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/posts\/1946\/revisions\/1951"}],"wp:attachment":[{"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/media?parent=1946"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/categories?post=1946"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vizZzion.org\/blog\/wp-json\/wp\/v2\/tags?post=1946"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}