Step by Step HelloWorld Widget

Prerequisities

The following packages must be installed on the developer virtual machine

qt-qmake-4.7.0
qt-creator-2.0.1 (or newer)
tiitoo-qtcreator-wizard
tiitoo-widgetsdk
tiitoo-widgetsdk-devel
tiitoo-widgetsdk-utils
tiitoo-widgetsdk-utils-devel
tiitoo-pinnwandev

Step 1: Create a WeTab Widget Project

Start Qt Creator and then click File ->  New File or Project. In the “New” dialog select “WeTab Widget Project” > “WeTab Widget

Step 2: Locate and name your project

Enter a project name and specify the location for the project folder. A new folder with the same name as your project will be created under this folder. For this tutorial we use “HelloWorld” as the project name and the user’s home folder as the project’s parent directory.

Step 3: Enter Widget Parameters

First name your Widget and Plugin. Although you are totally free to choose these, it is strongly encouraged to use the convention as its in this example, e.g. HelloWorldWidget and HelloWorldPlugin.
Then you need to specify the size of your Widget. Pinboard allows 3 widget sizes:

  • SMALL allcoates 1 cell (all bookmarks and launchers are SMALL widgets)
  • MEDIUM allocates 2×2 cells (e.g. Wikipedia widget)
  • LARGE allocates 2×3 cells  (e.g. all RSS/Atom feed widgets)

In this tutorial we will create a MEDIUM widget.

Step 4: Finish new project wizard

When you click Next you will see the following Summary screen. Click Finish to complete the New Project Wizard and your project will be ready.

The HelloWorld Project Wizard created a bunch of files for the widget, Below you can see an overview of automatically craeted files and folders.

Step 5: Setup Run configuration

This step is optional. You can always build the project as you wish and call the Pinboard emulator “tiitoo-pinnwandev” from the command line in order to test your widget. However creating a Run Configuration in qt-creator would be much more comforatble for testing.
You first need to open the Run Settings view in Qt Creator. Click “Project” on the left bar and then “Run Settings” at the top, and enter the values as seen below. Notica that these settings may be different depending on the actual project location. If you have followed the tutorial steps precisely, then the settings below should be fine though.

Step 6: Execute and test your Widget

Once you have a custom run configuration, you are ready to execute your first Widget. Ctrl+B to build your project and then Ctrl+R to run the pinboard emulator. You should see the following:

Step 7: Create a TTA archive

If you believe you are done with you widget, tested enough with the emulator, you might want to package it into a TTA. In order to do that you need to use the ant target “tta”. Open a terminal window, go to the project directory and simply execute the following :

# ant tta

This should create a 4tiitoo-HelloWorld-tta.zip file in the current directory, which you could later submit to the WeTab Market.