Development/Tutorials/Plasma4: Difference between revisions

From KDE TechBase
(Adding an Example about creating a Config Dialog in JS)
 
(28 intermediate revisions by 10 users not shown)
Line 1: Line 1:
{{Template:I18n/Language Navigation Bar|Development/Tutorials/Plasma}}


== Plasma Programming with C++ ==


== QML 1.0 ==
Plasmoids that use the QML (aka QtQuick) declarative language to describe their user interface while having the logic of the applet, in JavaScript (QML is essentially a forge between CSS and JavaScript).
This is now the '''recommended''' method of creating plasmoids, where possible. The plasmoid, or applet serves as the visualization for the data which a Plasma::DataEngine contains.
It allows easily the declaring of an interface and to easily create things like ListViews with native Plasma theming. It is what Plasma is leaning the most towards, especially in the Mobile, MediaCenter shells.
;[[Development/Tutorials/Plasma/QML/GettingStarted|Getting Started]]
:''Creating and running your first plasmoid in QML''
;[[Development/Tutorials/Plasma/QML/Basic_ListView|Basic List Plasmoid]]
:''Make a QML ListView which displays basic text objects as items. Utilizes native Plasma theming and animations.''
;[[Development/Tutorials/Plasma/QML/API|API Reference]]
:''The QML Plasmoid API. Useful for referencing what is available in the runtime, what are the differences with the pure JavaScript ScriptEngine, the differences between pure Qt QML and Plasma, and as a study aid for the tutorials above.''
== C++ ==
=== Plasmoids ===
;[[Development/Tutorials/Plasma/GettingStarted|Getting Started With Plasmoids]]
;[[Development/Tutorials/Plasma/GettingStarted|Getting Started With Plasmoids]]
:''Creating your first plasmoid in C++ with SVG background, icon and text''
:''Creating your first plasmoid in C++ with SVG background, icon and text''


;[[Development/Tutorials/Plasma/GettingStarted..Some_More|Getting Started With Plasmoids..Some more]] :''A few more starter's tips.''
;[[Development/Tutorials/Plasma/GettingStarted..Some_More|Getting Started With Plasmoids..Some more]] :''A few more starter's tips.''
;[[Development/Tutorials/Plasma/UsingExtenders|How to use extenders in your Plasmoid]]
:''A simple example that shows how to use extenders in a Plasmoid.''
;[http://www.linux-magazine.com/w3/issue/114/036-040_plasma.pdf Creating Plasmoids]
:''May 2010 article from Linux Magazine''
;[http://web.archive.org/web/20111103065058/http://www.ibm.com/developerworks/linux/library/l-kde-plasmoids/index.html? Create Plasmoids using KDevelop]
:''Article explaining the structure of Plasma and how to create a Plasmoid''
;[http://community.kde.org/User:Mxttie#Adding_configuration Adding configuration to your plasmoid]
:''Article explaining how to add a configuration dialog to your plasmoid.''
=== DataEngines ===


;[[Development/Tutorials/Plasma/DataEngines|Writing a DataEngine]]
;[[Development/Tutorials/Plasma/DataEngines|Writing a DataEngine]]
Line 13: Line 44:
;[[Development/Tutorials/Plasma/Services|Writing a Service]]
;[[Development/Tutorials/Plasma/Services|Writing a Service]]
:''Services provide a standardized interface for visualizations to perform "write operations". This can be for example, uploading pasted test to a pastebin service..''
:''Services provide a standardized interface for visualizations to perform "write operations". This can be for example, uploading pasted test to a pastebin service..''
=== PackageStructures ===


;[[Development/Tutorials/Plasma/PackageStructure|Writing a PackageStructure Plugin]]
;[[Development/Tutorials/Plasma/PackageStructure|Writing a PackageStructure Plugin]]
:''PackageStructure plugins allow custom Packages to be defined, installed, removed and listed as well as provide access their contents at runtime. Packages may contain any kind of data addons, including scripts.''
:''PackageStructure plugins allow custom Packages to be defined, installed, removed and listed as well as provide access their contents at runtime. Packages may contain any kind of data addons, including scripts.''


;[[Development/Tutorials/Plasma/UsingExtenders|How to use extenders in your Plasmoid]]
=== Runners ===
:''A simple example that shows how to use extenders in a Plasmoid.''


;[[Development/Tutorials/Plasma/AbstractRunner|Creating Runners]]
;[[Development/Tutorials/Plasma/AbstractRunner|Creating Runners]]
:''Runners are plugins that provide action-based search functionality in the Plasma workspace "run command" dialog. These plugins can be used by any application that links again libplasma.''
:''Runners are plugins that provide action-based search functionality in the Plasma workspace "run command" dialog. These plugins can be used by any application that links again libplasma.''
=== Wallpapers ===


;[[Development/Tutorials/Plasma/WallpaperHelloWorld|Wallpaper Tutorial 1]]
;[[Development/Tutorials/Plasma/WallpaperHelloWorld|Wallpaper Tutorial 1]]
Line 28: Line 62:
;[[Development/Tutorials/Plasma/WallpaperConfiguration|Wallpaper Tutorial 2]]
;[[Development/Tutorials/Plasma/WallpaperConfiguration|Wallpaper Tutorial 2]]
:''This tutorial covers how to add configuration options to the wallpaper.''
:''This tutorial covers how to add configuration options to the wallpaper.''
;[[Development/Tutorials/Plasma/WallpaperDoubleBuffer|Wallpaper Tutorial 3]]
:''This tutorial improves the wallpaper by using the so-called 'double buffer' technique.''
=== Plasma Shells ===


;[[Development/Tutorials/Plasma/ShellDesign|Creating a Plasma Shell]]
;[[Development/Tutorials/Plasma/ShellDesign|Creating a Plasma Shell]]
:''This tutorial covers the essentials of writing a new Plasma shell from scratch. A must-read for anyone creating a new or modifying an existing Plasma Shell. Existing Plasma shells include Plasma Desktop, Plasma Netbook, Plasma Mobile, Plasma Media Center, Plasma Screensaver, Plasma KPart and Plasma KDM, and all follow the patterns documented here.''
:''This tutorial covers the essentials of writing a new Plasma shell from scratch. A must-read for anyone creating a new or modifying an existing Plasma Shell. Existing Plasma shells include Plasma Desktop, Plasma Netbook, Plasma Mobile, Plasma Media Center, Plasma Screensaver, Plasma KPart and Plasma KDM, and all follow the patterns documented here.''


;[http://www.linux-magazine.com/w3/issue/114/036-040_plasma.pdf Creating Plasmoids]
=== Containment actions ===
:''May 2010 article from Linux Magazine''
;[[Development/Tutorials/Plasma/ContainmentAction|Creating a Plasma ContainmentAction]]
 
:"This tutorial covers the essentials of writing a new Plasma ContainmentAction. You can use a ContainmentAction e.g. for desktop context menus."
;[http://www.ibm.com/developerworks/linux/library/l-kde-plasmoids/index.html Create Plasmoids using KDevelop]
:''Article explaining the structure of Plasma and how to create a Plasmoid''
 
;[http://community.kde.org/User:Mxttie#Adding_configuration Adding configuration to your plasmoid]
:''Article explaining how to add a configuration dialog to your plasmoid.''


;[[Development/Tutorials/Plasma/ApplicationShell|Integrate Plasma in Applications]]
== JavaScript ==
:''This tutorial shows you how to make an application dashboard based on Plasma technologies.''
 
== Plasma Programming with JavaScript ==


Plasma has built-in JavaScript (also known as ECMAScript, and often referred to as QtScript in the context of Qt) scripting support without requiring any external dependencies.
Plasma has built-in JavaScript (also known as ECMAScript, and often referred to as QtScript in the context of Qt) scripting support without requiring any external dependencies.
Line 54: Line 85:


;[[Development/Tutorials/Plasma/JavaScript/DataEngine|Getting Data]]
;[[Development/Tutorials/Plasma/JavaScript/DataEngine|Getting Data]]
:''How to retreive data from a data engine''
:''How to retrieve data from a data engine''


;[[Development/Tutorials/Plasma/JavaScript/NowPlaying|Now Playing]]
;[[Development/Tutorials/Plasma/JavaScript/NowPlaying|Now Playing]]
Line 64: Line 95:
;[[Development/Tutorials/Plasma/JavaScript/CheatSheet|Cheat Sheet]]
;[[Development/Tutorials/Plasma/JavaScript/CheatSheet|Cheat Sheet]]
:''A cheat sheet, rather than a tutorial, of things to remember and watch out for when developing JavaScript plasmoids''
:''A cheat sheet, rather than a tutorial, of things to remember and watch out for when developing JavaScript plasmoids''
;[[Development/Tutorials/Plasma/JavaScript/ConfigDialog|Adding a Config Dialog]]
: An explanation and examples about how to add a Config Dialog to your recently created plasmoid.


;[[Development/Tutorials/Plasma/JavaScript/API|API Reference]]
;[[Development/Tutorials/Plasma/JavaScript/API|API Reference]]
:''The Simplified JavaScript Plasmoid API. Useful for referencing what is available in the runtime and as a study aid for the tutorials above.''
:''The Simplified JavaScript Plasmoid API. Useful for referencing what is available in the runtime and as a study aid for the tutorials above.''
=== QML (QtQuick) Plasmoids ===
It's possible to write Javascript Plasmoids that use the QML declarative language to describe their user interface, while having the logic in JavaScript. This is now the recommended method of creating plasmoids, if possible. It allows easily the declaring of an interface. It is also what Plasma is leaning the most towards, especially in the Mobile, MediaCenter and KDM shells.
;[[Development/Tutorials/Plasma/QML/GettingStarted|Getting Started]]
:''Creating and running your first plasmoid in QML''
;[[Development/Tutorials/Plasma/QML/API|API Reference]]
:''The QML Plasmoid API. Useful for referencing what is available in the runtime, what are the differences with the pure JavaScript scriptengine and as a study aid for the tutorials above.''


=== Other Applications Of Javascript ===
=== Other Applications Of Javascript ===
Line 87: Line 112:
:''This guide shows you how to create a comic plugin for the comic plasmoid.''
:''This guide shows you how to create a comic plugin for the comic plasmoid.''


== Plasma Programming with Python ==
== Python ==
There are some sample plasmoids written in python https://projects.kde.org/projects/kde/kdeexamples/repository/revisions/master/show/plasma/python
 


=== Plasmoids ===
;[[Development/Tutorials/Plasma/Python/GettingStarted|Getting Started]]
;[[Development/Tutorials/Plasma/Python/GettingStarted|Getting Started]]
:''Creating and running your first plasmoid in Python''
:''Creating and running your first plasmoid in Python''
Line 97: Line 125:
;[[Development/Tutorials/Plasma/Python/Using DataEngines|Using DataEngines]]
;[[Development/Tutorials/Plasma/Python/Using DataEngines|Using DataEngines]]
:''How to use DataEngines from a plasmoid''
:''How to use DataEngines from a plasmoid''
=== DataEngines ===


;[[Development/Tutorials/Plasma/Python/Writing DataEngines|Writing DataEngines]]
;[[Development/Tutorials/Plasma/Python/Writing DataEngines|Writing DataEngines]]
Line 103: Line 133:
;[[Development/Tutorials/Plasma/PythonPlasmoid|Writing a Plasmoid in Python]]
;[[Development/Tutorials/Plasma/PythonPlasmoid|Writing a Plasmoid in Python]]
:''Writing a simple battery graph in python''
:''Writing a simple battery graph in python''
=== Runners ===


;[[Development/Tutorials/Plasma/PythonRunner|Writing a KRunner plugin in Python]]
;[[Development/Tutorials/Plasma/PythonRunner|Writing a KRunner plugin in Python]]
:''Writing a simple krunner plugin in python''
:''Writing a simple krunner plugin in python''


== Plasma Programming with Ruby ==
== Ruby ==
 
=== Plasmoids ===
 
;[[Development/Tutorials/Plasma/Ruby/GettingStarted|Getting Started]]
;[[Development/Tutorials/Plasma/Ruby/GettingStarted|Getting Started]]
:''Creating and running your first plasmoid in Ruby''
:''Creating and running your first plasmoid in Ruby''
Line 116: Line 151:
;[[Development/Tutorials/Plasma/Ruby/SimplePasteApplet|Writing a simple paste applet]]
;[[Development/Tutorials/Plasma/Ruby/SimplePasteApplet|Writing a simple paste applet]]
:''A tutorial explaining how to set up a plasmoid, create a simple paste applet using widgets and add Plasma features seen elsewhere. Complete with tips for those who have never programmed before.''
:''A tutorial explaining how to set up a plasmoid, create a simple paste applet using widgets and add Plasma features seen elsewhere. Complete with tips for those who have never programmed before.''
;[[Development/Tutorials/Plasma/Ruby/Blinker|Use SVG artwork in the simplest way possible]]
:''Follow a fellow student as he asks around about SVG usage and explains why the code examples work. This is a wiki so feel free to add your own insights until this tutorial can be considered complete.''
=== DataEngines ===


;[[Development/Tutorials/Plasma/Ruby/Writing DataEngines|Writing DataEngines]]
;[[Development/Tutorials/Plasma/Ruby/Writing DataEngines|Writing DataEngines]]
:''How to write your own Plasma DataEngine using Ruby''
:''How to write your own Plasma DataEngine using Ruby''


;[[Development/Tutorials/Plasma/Ruby/Blinker|Use SVG artwork in the simplest way possible]]
== Web Technologies (HTML/JS/CSS) ==
:''Follow a fellow student as he asks around about SVG usage and explains why the code examples work. This is a wiki so feel free to add your own insights until this tutorial can be considered complete.''
 
== Plasma Programming with Web Technologies (HTML/JS/CSS etc) ==
;[[Development/Tutorials/Plasma/Web/GettingStarted|Getting Started]]
;[[Development/Tutorials/Plasma/Web/GettingStarted|Getting Started]]
:''Creating and running your first plasmoid in HTML''
:''Creating and running your first plasmoid in HTML''


== Plasma integration ==
== Plasma integration for applications ==


;[[Development/Tutorials/Solid_Device_Actions|Creating a Device Notifier action]]
;[[Development/Tutorials/Solid_Device_Actions|Creating a Device Notifier action]]
:''When your application is interested in removable hardware''
:''When your application is interested in removable hardware''


== Theme development ==
;[[Development/Tutorials/Plasma/ApplicationShell|Integrate Plasma in Applications]]
:''This tutorial shows you how to make an application dashboard based on Plasma technologies.''
 
== Packages ==
 
;[[Development/Tutorials/Plasma/PackageOverview|Plasma Packages]]
:''An overview of what makes up a Plasma Package and what they are and can be used for.''
 
;[[Development/Tutorials/Plasma/PackageStructure|Writing a PackageStructure Plugin in C++]]
:''PackageStructure plugins allow custom Packages to be defined, installed, removed and listed as well as provide access their contents at runtime. Packages may contain any kind of data addons, including scripts.''
 
== Themes ==


;[[Development/Tutorials/Plasma/Theme|Creating a Plasma Theme Quickstart]]
;[[Development/Tutorials/Plasma/Theme|Creating a Plasma Theme Quickstart]]
Line 140: Line 188:
:''A comprehensive guide to the contents of a Plasma SVG theme, including configuration options, wallpapers, on-disk layout, names of all standard SVG files and every element in them.''
:''A comprehensive guide to the contents of a Plasma SVG theme, including configuration options, wallpapers, on-disk layout, names of all standard SVG files and every element in them.''


== Activity Template development ==
== Activity Templates ==


;[[KDE_System_Administration/PlasmaDesktopScripting#Activity_templates|Creating a Plasma Activity Template Quickstart]]
;[[KDE_System_Administration/PlasmaDesktopScripting#Activity_templates|Creating a Plasma Activity Template Quickstart]]
Line 151: Line 199:
* [http://techbase.kde.org/Projects/Plasma/Eclipse_Integration Plasma Eclipse Integration]
* [http://techbase.kde.org/Projects/Plasma/Eclipse_Integration Plasma Eclipse Integration]
* The [https://mail.kde.org/mailman/listinfo/plasma-devel plasma-devel mailing list] and #plasma on IRC (irc.freenode.org).
* The [https://mail.kde.org/mailman/listinfo/plasma-devel plasma-devel mailing list] and #plasma on IRC (irc.freenode.org).
== Presentation Slides==
http://chani.wordpress.com/2009/04/25/quick-update-for-my-presentation/ Victory Calendar -- also link to websvn plasma playground in the odp file.

Latest revision as of 04:42, 25 February 2015


QML 1.0

Plasmoids that use the QML (aka QtQuick) declarative language to describe their user interface while having the logic of the applet, in JavaScript (QML is essentially a forge between CSS and JavaScript).

This is now the recommended method of creating plasmoids, where possible. The plasmoid, or applet serves as the visualization for the data which a Plasma::DataEngine contains.

It allows easily the declaring of an interface and to easily create things like ListViews with native Plasma theming. It is what Plasma is leaning the most towards, especially in the Mobile, MediaCenter shells.

Getting Started
Creating and running your first plasmoid in QML
Basic List Plasmoid
Make a QML ListView which displays basic text objects as items. Utilizes native Plasma theming and animations.
API Reference
The QML Plasmoid API. Useful for referencing what is available in the runtime, what are the differences with the pure JavaScript ScriptEngine, the differences between pure Qt QML and Plasma, and as a study aid for the tutorials above.

C++

Plasmoids

Getting Started With Plasmoids
Creating your first plasmoid in C++ with SVG background, icon and text
Getting Started With Plasmoids..Some more
A few more starter's tips.
How to use extenders in your Plasmoid
A simple example that shows how to use extenders in a Plasmoid.
Creating Plasmoids
May 2010 article from Linux Magazine
Create Plasmoids using KDevelop
Article explaining the structure of Plasma and how to create a Plasmoid
Adding configuration to your plasmoid
Article explaining how to add a configuration dialog to your plasmoid.

DataEngines

Writing a DataEngine
DataEngines provide a standardized interface to various (read only) data sources for visualizations to use. Learn what a DataEngine is and how to write one of your own.
Writing a Service
Services provide a standardized interface for visualizations to perform "write operations". This can be for example, uploading pasted test to a pastebin service..

PackageStructures

Writing a PackageStructure Plugin
PackageStructure plugins allow custom Packages to be defined, installed, removed and listed as well as provide access their contents at runtime. Packages may contain any kind of data addons, including scripts.

Runners

Creating Runners
Runners are plugins that provide action-based search functionality in the Plasma workspace "run command" dialog. These plugins can be used by any application that links again libplasma.

Wallpapers

Wallpaper Tutorial 1
This tutorial shows you how to make a simple Hello World plasma wallpaper plugin.
Wallpaper Tutorial 2
This tutorial covers how to add configuration options to the wallpaper.
Wallpaper Tutorial 3
This tutorial improves the wallpaper by using the so-called 'double buffer' technique.

Plasma Shells

Creating a Plasma Shell
This tutorial covers the essentials of writing a new Plasma shell from scratch. A must-read for anyone creating a new or modifying an existing Plasma Shell. Existing Plasma shells include Plasma Desktop, Plasma Netbook, Plasma Mobile, Plasma Media Center, Plasma Screensaver, Plasma KPart and Plasma KDM, and all follow the patterns documented here.

Containment actions

Creating a Plasma ContainmentAction
"This tutorial covers the essentials of writing a new Plasma ContainmentAction. You can use a ContainmentAction e.g. for desktop context menus."

JavaScript

Plasma has built-in JavaScript (also known as ECMAScript, and often referred to as QtScript in the context of Qt) scripting support without requiring any external dependencies.

Plasmoids

Getting Started
Creating and running your first plasmoid in JavaScript
Getting Data
How to retrieve data from a data engine
Now Playing
Slightly more advanced data engine usage: displaying what's currently playing
System Monitor
How to access systemmonitor data engine
Cheat Sheet
A cheat sheet, rather than a tutorial, of things to remember and watch out for when developing JavaScript plasmoids
Adding a Config Dialog
An explanation and examples about how to add a Config Dialog to your recently created plasmoid.
API Reference
The Simplified JavaScript Plasmoid API. Useful for referencing what is available in the runtime and as a study aid for the tutorials above.

Other Applications Of Javascript

Scripting Plasma Shells
The KDE Plasma Desktop and Netbook provide means to manage the desktop shell (desktop, panels, widget) via scripts written in JavaScript. This article describes how to take advantage of this feature set as well as documents the full API. This is primarily a system administration tool, but may also be of interest to power users.
Javascript Animations
How to write Animations using Javascript for use in Plasma applications
Creating Comic Plugins
This guide shows you how to create a comic plugin for the comic plasmoid.

Python

There are some sample plasmoids written in python https://projects.kde.org/projects/kde/kdeexamples/repository/revisions/master/show/plasma/python


Plasmoids

Getting Started
Creating and running your first plasmoid in Python
Using widgets
Introduction to using Plasma widgets
Using DataEngines
How to use DataEngines from a plasmoid

DataEngines

Writing DataEngines
How to write your own Plasma DataEngine
Writing a Plasmoid in Python
Writing a simple battery graph in python

Runners

Writing a KRunner plugin in Python
Writing a simple krunner plugin in python

Ruby

Plasmoids

Getting Started
Creating and running your first plasmoid in Ruby
Using widgets
Introduction to using Plasma widgets
Writing a simple paste applet
A tutorial explaining how to set up a plasmoid, create a simple paste applet using widgets and add Plasma features seen elsewhere. Complete with tips for those who have never programmed before.
Use SVG artwork in the simplest way possible
Follow a fellow student as he asks around about SVG usage and explains why the code examples work. This is a wiki so feel free to add your own insights until this tutorial can be considered complete.

DataEngines

Writing DataEngines
How to write your own Plasma DataEngine using Ruby

Web Technologies (HTML/JS/CSS)

Getting Started
Creating and running your first plasmoid in HTML

Plasma integration for applications

Creating a Device Notifier action
When your application is interested in removable hardware
Integrate Plasma in Applications
This tutorial shows you how to make an application dashboard based on Plasma technologies.

Packages

Plasma Packages
An overview of what makes up a Plasma Package and what they are and can be used for.
Writing a PackageStructure Plugin in C++
PackageStructure plugins allow custom Packages to be defined, installed, removed and listed as well as provide access their contents at runtime. Packages may contain any kind of data addons, including scripts.

Themes

Creating a Plasma Theme Quickstart
A quick guide to creating your first Plasma theme
The Plasma Theme Structure In Detail
A comprehensive guide to the contents of a Plasma SVG theme, including configuration options, wallpapers, on-disk layout, names of all standard SVG files and every element in them.

Activity Templates

Creating a Plasma Activity Template Quickstart
A quick guide to creating your first Plasma Activity Template

Resources