Updates from February, 2010 Toggle Comment Threads | Keyboard Shortcuts

  • pit 5:37 pm on February 3, 2010 Permalink | Reply
    Tags: , , , hello world,   

    Build your first Web Runtime widget with APIBridge 

    This article shows you how to create, compile, build and deploy a Web Runtime widget, that includes the APIBridge plugin developed by Nokia, and available on Forum Nokia website.

    The APIBridge is a Symbian C++ engine that exposes native functionalities to Web Runtime widgets. These functionalities include:

    • Uploading files.
    • Capturing video, image, and audio.
    • Reading files.
    • Resizing images.

    Before starting with the following steps, you have to download APIBridge from Forum Nokia website, and unpack it to a convenient location on your machine.

    Also, to compile and build the whole example, you must get one UID from your SymbianSigned account.

    Step 1. Prepare your widget

    The first step is to develop your own widget, and to package it into the standard WGZ format. You can develop the widget with the tools of your choice.

    In this tutorial, I’ll just build a simple “Hello World” widget with the WRT Plugin for Aptana Studio. You can read a full guide about creating from scratch a simple widget on Forum Nokia Library.

    Using the Aptana Wizard interface, let’s create a new “Nokia Web Runtime Widget”.

    Now, let’s customize the “index.html” file with your Hello World text.

    So, the test widget is ready to be packaged!

    Step 2. Compiling APIBridge source code

    Now, take the folder where you have unpacked APIBridge, and make a copy of its WgzInstaller folder. We’ll use this copy to create the new widget installer.

    Note: to perform this step, you must already have your own UID.

    Now, perform these changes:

    1. Open the group\WgzInstaller.mmp file, and replace the fake UID 0×12345678 with your own
    2. In the src\WgzInstaller.cpp file file, replace the KWidgetInstallerFileName with the actual filename of your packaged widget

    Now all is ready to compile your source code. Go into the group\ folder and, from command line, run:

    bldmake bldfiles
    abld build gcce

    If you don’t get any errors, the APIBridge code shoud have been correctly compiled.

    Step 3. Customize and package

    Now, copy your packaged widget to the content/ folder. Done this, open the /sis/WgzInstaller_template.pkg file and set the appropriate values for these properties:

    • Application name
    • Installation UID
    • Vendor name
    • .wgz file name

    Since we’re building from command line, we also have to tell where makesis can actually find the WgzInstaller.exe file created in the previous step. In this tutorial, I’ve used the S60 5th edition SDK v1.0, so I’ll change this value:




    Now, let’s create the SIS file: from command prompt, go into the sis/ folder and run:

    makesis WgzInstaller_template.pkg

    Your output should be something like this:

    Processing WgzInstaller_template.pkg...
    Created  WgzInstaller_template.sis.

    Step 4. Sign and deploy

    Take the SIS file you’ve created in the previous step, and sign it with your own SymbianSigned certificate:

    signsis WgzInstaller_template.sis WgzInstaller_template_signed.sis your_certificate.cer your_key.key your_password

    Now, your widget is ready! Just send it to your Nokia device, and install. You’ll notice that, during the installation, you’ll be prompted to install both your widget and the APIBridge engine.

    Below you can see the Hello World widget running in all its glory :)

    Thanks go to Leonardo for his precious support! :)

  • pit 8:31 am on February 1, 2010 Permalink | Reply
    Tags: , , ,   

    Using Google Static Maps in your widget with JavaScript 

    A new featured article from Ar.tur on Forum Nokia Wiki shows you how to use the static version of Google Maps in your mobile widget by using few lines of JavaScript code.

    The same article also shows how to use the Location API from Web Runtime Platform Services to retrieve your current location, and then using this data to get the appropriate map from Google Maps.

    You can read the full article here: Static GoogleMaps API in JavaScript.

  • pit 2:10 pm on January 29, 2010 Permalink | Reply
    Tags: , ,   

    Mobile Joomla 0.8.2 is available 

    Version 0.8.2 of Mobile Joomla was relesed today!

    This version includes several improvements, including:

    • Further improvements on installation procedure to support even lower-profile configurations
    • Incompatibilities with some minor MySQL versions are fixed
    • Submenus. A long awaited feature; now it is possible to have your submenus with the mobile version of your site.
    • Various small fixes

    Find out more on Mobile Joomla website.

    • pit 4:11 pm on November 20, 2009 Permalink | Reply
      Tags: , , , , , , ,   

      How to create a new Component for the Guarana UI Library 

      This new article shows how to create from scratch a new Component from the Guarana UI Library.

      The article shows all the steps involved in the creation of the new Component, explaining all the necessary details to understand the whole process, passing by the setup of the Component file structure, the writing of the actual Component JS and CSS code, and the integration of the Component with the Guarana UI building process.

      Purpose of the article is to give developers guidelines to create their own Components, integrating them with the Guarana UI Library. The component is also available on the Guarana UI online Components Browser.

      The full article is available, as usual, on Forum Nokia Wiki: How to create a new Component for the Guarana UI Library Guarana.

      • Allan Bezerra 6:36 pm on November 20, 2009 Permalink

        Really cool!
        I only did a little modification on Guarana PATH setting place.
        – Allan Bezerra

      • koko 3:01 am on November 30, 2009 Permalink

        Wow thanks these are great and very appreciated

    • pit 4:38 pm on November 19, 2009 Permalink | Reply
      Tags: , , , ,   

      Guarana UI online Components Browser 

      The Guarana UI framework has just been launched, with a complete set of ready-to-use components that will definitely be useful to all Web Runtime developers.

      Guarana UI Components Browser

      It’s now available a Guarana UI online Components Browser, that allows developers to quickly preview and use all the Guarana UI Components.

      Soon it will feature tutorials and guidelines on Components usage, testing and customization.

      If you have a WRT widget, a new Component or a proof-of-concept built by using Guarana UI, and want to feature it on this page, just drop me an email or a comment on this post.

      Hope you enjoy it! :)

      Note: as the Guarana UI framework is designed to properly work with WebKit, the Guarana UI online Components Browser does not currently work with the Interet Explorer browser

      • Alessandro 4:43 pm on November 19, 2009 Permalink

        Ciao Alessandro,

        great work!

      • pit 5:12 pm on November 19, 2009 Permalink

        Thank you Alessandro! :)

    • pit 12:08 pm on November 19, 2009 Permalink | Reply
      Tags: , , , ui framework,   

      Guarana UI: a jQuery-Based UI Library for Nokia WRT 

      Mobile widget developers know that one of the biggest difficulties when creating a new widget is to build a nice, usable interface that is compatible with the largest set of devices, touch or non-touch. Components and code snippets commonly found on standard JavaScript frameworks are quite always not suited for mobile devices, and result in poor or non-optimal results.

      Finally, Forum Nokia has released a UI framework that promises to solve all these issues, by providing a complete, tested and cross-compatible set of ready-to-use components: Guarana UI!

      The framework is really complete, counting more that 20 components, compatible with touch (S60 5th edition) and non touch devices (S60 3.2 and 3.1, with some exceptions for the 3.1).

      Moreover, the framework includes some interesting features as asynchronous loading of resources, that is absolutely useful to optimize performances and memory usage within a widget.

      To get started, Forum Nokia provides extensive documentation, a Quick Start guide and sample code to show how each component looks like and how it can be used.

      Kudos to Forum Nokia developers, as their effort will definitely bring fresh air to all widgets’ developers out there! :)

    compose new post
    next post/next comment
    previous post/previous comment
    show/hide comments
    go to top
    go to login
    show/hide help
    shift + esc