Open BB News

Qt Update – 4.8 Binaries and PlayBook QPA Plugin at Gitorious

pelegri — Fri, 24 Feb 2012 19:24:56 +0000

~~Two~~ Three quick updates on Qt:

First, we have started uploading prebuilt Qt 4.8 binaries. As of this writing there are 2×2 sets, all available at the downloads section of our Qt repo at GitHub:

Installers for 64-bit and 32-bit Linux hosts. These ELF executables are invoked as
```
qt4.8-playbook.bin 
```
Similar installers for the PlayBook simulator

We are working on additional installers for Windows.

The second update is on our participation on the Qt Project. As of this last Tuesday (c87445a), the BlackBerry PlayBook QPA (the Qt Platform Abstraction) Plugin is now at Gitorious. Further contributions will follow; our goal is to be able to work from the upstream directly.

And three (added), check out the QNX page in the Qt Project Wiki.

New WebWorks Community API: Using Analytics Service

pelegri — Fri, 24 Feb 2012 16:27:19 +0000

Tim has added a new WebWorks Extension to our WebWorks-Community-APIsrepository. The new feature is loaded through

Using the service requires registering with the service, adding some JavaScript setup code and including some instrumentation calls to track key events, from clicking on buttons to purchases. The logs are sent to the Analytics Service (when on coverage) and the vendor can then review this aggregate data about the user base in the Analytics Portal.

This extension is only available for the BlackBerry Smartphones. Basic information in the README file in our repo; additional information on the service is here.

BlackBerry PlayBook 2.0 is Out!!

pelegri — Wed, 22 Feb 2012 04:43:37 +0000

Today was the official worldwide launch of the BlackBerry® PlayBook™ OS 2.0 software update. There are many new features; rather than singling out any, I’ll point to the official pages and blogs.

There is plenty of information in the form of articles and videos. Some of the items describe the features, some how to get started using them. The main links include:

Main page at BlackBerry.com
BlackBerry PlayBook OS 2.0 is here and corresponding Getting Started
New Video Chat features and corresponding Getting Started
Email, Calendar and Contacts (part 1 and part 2) and corresponding Getting Started

Enjoy!

The New AliceJS: What’s up with V0.2?

ldhasson — Thu, 16 Feb 2012 17:01:35 +0000

We released the first version of AliceJS a while back, and spent several months gathering feedback and playing around with it. Clearly, the concept of Organics has been popular with users: the ability to alter various aspects of an animation to subtly randomize the final outcome is a powerful idea to keep UI animations in an application fresh. The simplicity of the API and the closeness to the CSS syntax has also been well received.

Introduction

For those who are not familiar with the framework, check out the Wobble demo at http://blackberry.github.com/Alice/demos/fx/wobble.html. First, play around with the Duration and Rotation parameters to see how they affect the animation. Then change the Timing function and the Perspective of Origin. After playing with that, start adding Randomness and see how all the various animations start changing.

The key to AliceJS is that all of this happens with only one line of code on top of an application’s regular HTML, so development is dead easy. AliceJS generates CSS properties at the DOM level (so it works on any DOM element, not just images like with other “animation” frameworks) to enable those effects. Below is a simple sample for a page that uses AliceJS:

In this example, we create a basic Form, and an Image, laid out in an HTML table. Then we have 2 buttons, and 2 functions that execute the AliceJS code to start the Wobble effect. The first function uses standard parameters while the second adds randomness factors to ‘duration’ and ‘rotation’. The signature for Wobble is:

alice.plugins.wobble = function(elems, rotate, perspectiveOrigin, duration, timing);

This API is slightly different from V0.1, so you need to update your code. In the following sections, we will discuss the main ideas in the API re-architecture we did for V0.2. One thing we didn’t change however was the similarity with CSS. The best way to think about AliceJS is to think as if you were doing CSS work. For example, this is a normal call:

a.wobble(["e1", "e2"], {value: 20, randomness: 80}, "center",
                       {value: 1000, randomness: 20}, "ease-in-out");

Putting CSS glasses on, it could look like this:

#MyDiv {
   animate-wobble: randomize(20deg, 80%) center randomize(1000ms, 20%) ease-in-out;
}

#MyDiv {
  animate-wobble-rotation: 5 80%;
  animate-wobble-anchor: center;
  animate-wobble-duration: 1000ms 20%;
  animate-wobble-timing-function: ease-in-out;
}

API Redo

Jim Ing (@jim_ing, the co-developer of the framework) and myself had never been fully satisfied with the code underneath it all. After all, it was thrown together quite rapidly so we could explore the Organics concept and build cool animations. So, it was time for us to fundamentally revisit this codebase. The result is V0.2 which is essentially a complete rewrite.

We have centralized all parameter processing, so that the framework is completely uniform for all effects. It also allowed us to add a lot of extensibility right in for future enhancements.
We create a massively flexible master effect and added “shortcuts”, simple additional sub-effects which essentially open up a few parameters and delegate to the master effect.

Parameter centralization

In the example above, I passed in an array of strings to denote the elements in the DOM for which the Wobble effect should apply. But what if I actually already had the elements? Or you used a selector on a class?

// example 1
a.wobble("e1", 20, "center", 1000, "ease-in-out");
a.wobble(["e1", "e2"], 20, "center", 1000, "ease-in-out");

// example 2
var e1 = document.getElementById("e1");
var e2 = document.getElementById("e2");
a.wobble(e1, 20, "center", 1000, "ease-in-out");
a.wobble([e1, e2], 20, "center", 1000, "ease-in-out");

// example 3
var elems = getElementsByTagName("toto");
a.wobble(elems, 20, "center", 1000, "ease-in-out");

The framework centralizes all processing of the “elements” parameter. Not only does that make the framework, and all effects (present and future) consistent, but it also allows for extension. In a future article, we’ll explore that concept and show how we could use jQuery for instance as the selector. That same approach applies to all parameters, for example, for duration:

1000: a value without any unit is understood as being in milliseconds
“1000ms”: a string with a unit as milliseconds
“10s”: a string with a unit as seconds

Additionally, when using randomization, you simply use an object passed in as {value: 1000, randomness: 10}. Here, “value” is exactly as we just discussed above, and “randomness” is a percentage factor. So, for a value of 1000 and a randomness factor of 10 (or “10%”), the final value will land somewhere between 900 and 1100 (+ or – 10% of the value). In a future article, we’ll describe how this can be further customized so that you could use a more sophisticated randomization function. This can have interesting applications such as generating random values successively that don’t deviate from a specified median value. There are lots of cool possibilities.

Effects

We decided to consolidate effects as much as we could. From our experience with AliceJS V0.1, we knew that we could create a large class of effects with simple parameter variance. So we decided to try it out. Some effects that used to be available in the experimental section of AliceJS 0.1 are not yet available in the new architecture, but they should follow soon.

In AliceJS 0.2, we have one giant master effect called Cheshire in honor of the cat in “Alice In Wonderland”. In Walt Disney’s classic animated film, you could see the cat fade in and out, rotate, slide around and so on. And that’s exactly what that effect can do… and a lot more. This master effect uses many parameters such as duration, timing, direction, move, rotate, overshoot, perspective etc… You should use the new Builder tool at http://blackberry.github.com/Alice/demos/builder.html to play around with the parameters and generate the low-level code against the master effect.

I played around, and the tool generated the following Cheshire call:

alice.cheshire({"elems": ["elem1"],
                "delay": {"value": "0ms","randomness": "30%"},
                "duration": {"value": "2500ms","randomness": "50%"},
                "timing": "ease-in-out",
                "iteration": "infinite",
                "direction": "alternate",
                "playstate": "running",
                "move": "left",
                "rotate": {"value": "90","randomness": "80%"},
                "flip": "left",
                "turns": "4",
                "fade": "in",
                "scale": {"from": "1%","to": "100%"},
                "shadow": "true",
                "overshoot": "20%",
                "perspective": "1000",
                "perspectiveOrigin": "center",
                "backfaceVisibility": "visible"
              });

As you can see, the master effect is very powerful, with a lot of parameters to achieve almost limitless possibilities. For simplicity, we have then defined sub effects which are essentially shortcuts. As you saw previously, the Wobble effect only requires a few of those parameters. And to make it easy to type, make it still look like CSS code, and help in IDEs that can do function call completion, we used the more traditional way of passing in parameters. Here is how ‘Wobble’ is structured:

alice.plugins.wobble = function (elems, rotate, perspectiveOrigin, duration, timing) {
    "use strict";
    console.info("wobble: ", arguments);
    alice.plugins.cheshire({
        elems: elems,
        rotate: rotate || 5,
        perspectiveOrigin: perspectiveOrigin || "center",
        duration: duration || "200ms",
        timing: timing || "ease-in-out",
        iteration: "infinite",
        direction: "alternate"
     });
};

We picked “rotate”, “perspectiveOrigin”, “duration”, and “timing” as the key properties for the ‘Wobble’ effect, and simply filled in the rest in the method. It is effectively just a shortcut to a full Cheshire call.

There are 15 sub effects out of the box which can be all seen on http://blackberry.github.com/Alice/demos/. They are:

Bounce
Dance
Drain
Fade
Hinge
PageFlip
Pendulum
PhantomZone
RaceFlag
Slide
Spin
Toss
Twirl
Wobble
Zoom

With the builder tool, you can create your own mixture and the possibilities are almost endless. You can look at further variations with the samples on http://blackberry.github.com/Alice/demos/stack.html and http://blackberry.github.com/Alice/demos/sampler.html.

Conclusion

AliceJS 0.2 is a complete rewrite to make sure we had a solid base to continue developing the framework.

We have implemented rich parameter syntaxes which are completely centralized across the entire framework for extensibility and consistency.
We have consolidated animation parameters into a master effect from which we then derived over a dozen sub effects.
We added a builder tool
We added more samples to show how flexible this all is.
We added Jasmine test cases.

The framework works best on BlackBerry 7 and PlayBook devices due to top notch CSS hardware acceleration implementation of course, but we have also tested it on a number of other platforms: the framework now works across a wide range of WebKit-based mobile device such as iOS and Android, and desktop Safari and Google Chrome. Last but not least, we did finally add support for Firefox. Yeah! Do note that 3D effects such as flips require FireFox 10 to work.

We hope you have a lot of fun with it and we are eagerly awaiting feedback and contributions. In the near future, we’ll post additional articles about building new master effects, customizing how the framework handles parameter arguments, and creating sub effects.

PS: I apologize for my uppercasing of HTML tags! ;P

Qt Comes to QNX

Matthew S. — Fri, 10 Feb 2012 21:56:10 +0000

Note: Also see this Update on Binaries and Upstreaming (ed., Feb 24 ’12)

Having been a Qt developer for many years prior to joining RIM, I am extremely excited that Qt is now available for PlayBook development. Qt brings a mature, stable application framework for developing rich 2D and 3D applications on QNX-based platforms. It is very user friendly, with an incredibly intuitive API. With Qt, you have the choice of writing your apps in QML/JavaScript, C++ or a combination of the two. This separation allows app designers and developers to work together seamlessly to create rich, user interface-centric applications. Qt is also the basis for our Cascades SDK coming later this year. Developing your apps now with Qt can provide a natural extension to incorporating Cascades in the future.

We are committed to making QNX the #1 platform for Qt development on mobile devices. As part of our commitment to Qt, we are currently optimizing the build process to make things as streamlined as possible for developers. This includes integration with standard QNX development tools as well as QtCreator so you can create your Qt apps in the Qt way and target them for QNX.

To save having to build the Qt libraries yourself, we’ve pre-built the Qt binaries for you for QNX and posted them on our downloads page at github.

Correction: The binaries are not yet there; in the meantime, use the simple instructions in the “Getting Started” document and build them from the sources (ed.)

You can also download the preview of QtCreator with the QNX plugin from the same downloads page. We expect that the QNX plugin will be officially available in the next version of QtCreator, version 2.5.

To help getting started, we’ve created a number of instructional guides for developing with Qt on QNX. Check out the getting started guide for instructions on how to get your environment up and running quickly.

Currently our Qt source is being hosted on github but we will be moving our sources into the Qt Project soon and will continue to actively contribute to Qt in general. We consider it important to not only open source the work we have done but to also continue to work in an open source fashion with the Qt community.

If you have questions related to Qt development on PlayBook, come post your questions on the BlackBerry Developer Zone Forum. You can post your questions in the NDK section and Qt experts will help you find your answers.

I encourage you to experiment by building a Qt app on PlayBook and see just how easy it is to create rich, compelling apps with this toolkit.

Look for more exciting developments coming soon!

Skia on PlayBook

asimonov1 — Mon, 30 Jan 2012 18:47:43 +0000

We are excited to announce that a new library is available for use by PlayBook developers. Skia, an open-source 2D graphics library for drawing text, geometry and images can now be found at our Skia GitHub repository. One key feature of this version of the library is the inclusion of hardware acceleration for many drawing operations.

To showcase how to use Skia on the PlayBook, we have created a sample application as a part of the Skia GitHub repository (see image below). In addition, for a more extensive overview of Skia’s capabilities a detailed wiki page has also been added.

The remaining portion of this article looks at the steps involved in getting the Skia sample application up and running on a BlackBerry PlayBook.

Prerequisites

You will need to make sure that you have a copy of the BlackBerry Native SDK as well as a debug token.

Building the Sample

1. Obtain the Source

Download Skia from GitHub by either cloning the repository or downloading the source as a ZIP archive.

WARNING: Do not clone or unzip the source files into the NDK workspace directly. This will result in compilation errors when building the samples.

2. Import Projects into Momentics

Open the QNX Momentics IDE that was bundled with the BlackBerry NDK.
Import the grskia project into Momentics by selecting File -> Import. The project can be found inside of the Skia folder that you checked out from GitHub.
Similarly, import the SkiaSample project into Momentics. The project can be found inside Skia/rim_samples/SkiaSample.

3. Set up Author Information for the sample

Open the bar-descriptor.xml for the SkiaSample project. Click the Set from Debug Token button located on the General tab and save the file.

4. Enable/disable hardware acceleration in SkiaSample (Optional)

Open SkiaSample/main.cpp and find the USE_SKIA_OPENGL define near the top of the file.
To use hardware-accelerated Skia, set USE_SKIA_OPENGL to 1.
To use software Skia, set USE_SKIA_OPENGL to 0.

5. Build the Projects

Before proceeding, make sure that both the grskia and SkiaSample projects are set to use the same build configuration (Device-Release or Device-Debug). You can do so by right-clicking on each project in the Project Explorer tab and selecting Build Configurations -> Set Active.

Build the grskia project first, by right-clicking on it and selecting Build. Next, build the SkiaSample project.

6. Deploy SkiaSample to PlayBook

Deploy the executable to the device by selecting Run-> Run As -> BlackBerry Tablet OS C/C++ Application from Momentics.

JSON_parser available for PlayBook

chungrim — Fri, 27 Jan 2012 21:56:01 +0000

We are hosting the unmodified source for a JSON parser written by Jean Gressmann (based on JSON.org’s JSON checker) as a new JSON_parser repository. This high-performance, C-based, library can be used as a parser or as a checker. Through a callback function, the calling application can receive the parsed objects (name-value pairs) for a given JSON input.

Features highlighted by the author are as follows:

Arbitrary levels of JSON object/array nesting.
C-style comments.
UTF-16 & escape sequence (\uXXXX) decoding to UTF-8.
Allows for manual processing of floating point values.

To build the parser with your project, simply include and compile it with your source files. There is a sample (main.c) which demonstrates proper invocation of the parser with a callback function.

Belligerent Blocks – Using Scoreloop SDK on the PlayBook

pelegri — Thu, 26 Jan 2012 15:35:56 +0000

The NDK microsite has many useful samples but the GitHub NDK-Samples repo has additional ones, including BelligerentBlocks, the game that was shown in San Francisco during DevCon America 2011.

BelligerentBlocks showcases the Scoreloop™ social gaming platform (wikipedia) and many BlackBerry® PlayBook™ features (OpenGL ES, OpenAL, SQLite3) and leverages our port of Box2D. This post describes how to download, build and install BelligerentBlocks on your PlayBook.

SetUp

Same arrangement as in previous posts: the target is a consumer (i.e. secure) PlayBook Tablet, running the latest public beta release 2.0.0.7111 (see instructions) and the host is a Mac laptop running MacOS using the NDK 2 beta 3 tools.

I installed a debug-token to avoid having to sign the applications during the “development” cycle.

Building Belligerent Blocks

You will need two packages from our GitHub repo: Box2D and the actual BelligerentBlocks. We will use the (Eclipse-based) IDE to build, package and install the application.

Box2D is its own GitHub repository. You can clone the repo or just download the ZIP file for the master branch. The clone takes longer as it pulls down all branches and the full repo history. Either way, you will get the Eclipse project information, so import the project into your IDE. I used the master branch.

BelligerentBlocks is part of the NDK-Samples repository. The corresponding subdirectory is also a complete Eclipse project, so also import that project into the IDE. For this we need to use the next branch, since that corresponds to the PlayBook 2.0 runtime.

Next, build the two projects, first Box2D, then BelligerentBlocks. They should build without issues.

Next is to configure the target configurations. One way to do this is to run BelligerentBlocks, which will automatically prompt you:

Configure the target, in this case connected via USB:

Now you are pretty much ready: select the BelligerentBlock project and Run-As… and wait while the application downloads:

Run and Enjoy

And you are ready. The application starts and connects via the Scoreloop API. It will ask you for an id which will later use to share scores, and it will start:

Tap… and play…

A score ranking appears at the end of the game. The first two are cheats, but the rest are real. The maximum score is 1000, see how close you can get.

Enjoy! And browse the code to learn how easy it is to use the Scoreloop API.

Porting Wikipedia Mobile to the BlackBerry PlayBook

Gord Tanner — Wed, 25 Jan 2012 14:06:41 +0000

It all started from a tweet late sunday night:

OK Wikipedia app for android must be the best phonegap app ever. > 4.5 stars. Top trending on the market. > 350k installs. All in 2 weeks!—
dave johnson (@davejohnson) January 24, 2012

The Wikipedia guys created an amazing phonegap app for android and iOS and had open sourced it here. Quickly looking at the source and running the app in ripple it was clear that this would also make a great app for the BlackBerry® PlayBook™.

After forking the repo I put the contents of the app up on my personal webserver and used a webworks app I wrote that points to it. This allows me to quickly test and develop webworks apps on the simulator or a real playbook. You can pick up my config.xml here. A good tutorial on setting this available on our support forums.

Once I got the app running on a real playbook I noticed some rendering issues in Ripple and in the simulator. Because we at RIM want to provide the best tools available for development I logged a bug for ripple and forwarded off a screenshot of the incorrect rendering in the simulator to the proper channels.

Once I had the app running on the PlayBook and had done some smoke testing it felt good so I updated the build script and quickly had a proper PhoneGap app ready to be pushed back to github.

Just finished a port of the @WikimediaMobile app to the @BlackBerry #PlayBook. Easy since it used @phonegap github.com/gtanner/Wikipe…—
Gord Tanner (@gordtanner) January 24, 2012

The news spread fast …

@gordtanner Awesome! Send us a pull request and join us on irc #wikimedia-mobile (freenode)—
Wikimedia Mobile (@WikimediaMobile) January 24, 2012

We are currently working on merging the code into the Wikipedia branch and getting it into AppWorld quickly.

If you would like to check out the code for yourself you can pull down the code and build it yourself from github.

Weather WebWorks Sample is in – RSS Reader is out, for now

pelegri — Sun, 22 Jan 2012 16:26:05 +0000

We have posted a new sample to the WebWorks-Samples repository: Weather. This sample is targeted to the BlackBerry smartphones and uses the Spinner Control extension from WebWorks-Community-APIs.

Also, a week ago we removed the RSS Reader sample, but we will push a better version soon.

Enjoy!