Since I started using N8, I quickly converted my Twitter client, TwimGo, easily to Symbian WRT. I only had to package the application differently but I could use the same code without changes that I wrote for N900.
Just few days ago I released a new version 2.1 for the Nokia N900 which you can download from twimgo.com app site. Nokia N8 version should be available through Ovi Store within few weeks. It’s just waiting for Ovi Store QA check before it is published.
Here’s a small preview video of TwimGo running on Nokia N8:
I’ve been learning the Qt Quick and QML stuff lately but I took a few minutes to improve the Qt Web Runtime based TwimGo, Twitter client for Nokia N900.
Following screenshot shows all new features in one view:
Old style retweet, which you can modify before tweeting with RT prefix
New style retweet, which instantly retweets the tweet
Show original tweet with “Original” button when viewing reply tweet details
Download the latest version from TwimGo.com after uninstalling your current TwimGo version. Hope you enjoy!
Yet another week have passed since last release of TwimGo so it is time to release new and fresh version of my mobile Twitter client for Nokia N900. This version has the following new features:
More secure – uses Twitter API over HTTPS
Simple desktop widget showing latest tweets
Clickable hashtags – Does a search when clicking hashtag
As usual, uninstall app before installing this new release. Download app from www.twimgo.com …and make sure you have Qt Web Runtime before downloading TwimGo.
There can’t be a better way of spending your Saturday night other then crafting and knitting new apps for your mobile devices. This Saturday I was missing a nice news reader for my Nokia N900. I tried to follow the Forum Nokia workflow: Design, Develop, Distribute. Here’s what happened:
Design
Palette for news reader app
The firstthing that I had to do was to get my app a decent color palette so that app would feel nice and consistent through out the views. I tend to use colourlovers.com to either create or browse good palettes. This time I decided to use nice blueish palette, The First Raindrop.
Now it was time to do the actual fun part and design the overall view of the apps user interface. As I tend to use Qt Web Runtime for development it’s pretty easy to do the UI drafts with simple static HTML page. These drafts can easily be extended to be used in the final app.
I really wanted to have horizontal panels this time around. Maybe to provide a book-like user interaction where you go to the next page to the right and back to the left. The following image shows the mockup of the UI.
User interface mockup for news reader app
As the mobile device display is quite small I thought that I’d show only one panel on one screen. If this would be created for a tablet like device then it could be wise to show e.g. all three or two panels at once on a display. I’ll have to test that when I get the first MeeGo tablet in my hands :)
Develop
Now that I had a draft UI HTML I started knitting the functionality with JavaScript to my new app which I would call NewsFlow. I used jQuery library to do all the heavy lifting like loading and parsing the RSS feeds.
As a small detail I used CSS animation for the panel switching so when user e.g. selects a feed from a feed list then view is switched to feed items page. With jQuery the CSS animations can be easily created with the animate method:
...
$(left).css("left", "0");
$(left).css("position", "fixed");
$(left).animate(
// What CSS value(s) to animate
{left:"-" + width + "px"},
// Animation time in milliseconds
1000,
// Function to call when animation is finished
function() {
$(window).scrollTop();
$(left).css("position", "relative");
});
...
Then was the time to do the normal widget packaging and upload the app to the device. Here is what it turned out to be:
I have to say that I like it a lot as a simple news reader. This was again a good reminder on how fast the Qt WRT is to develop with. Now I just hope that Ovi Store would also start supporting Qt WRT apps soon so that the Distribute part would be easier.
What features you’d like to have in your news reader app?
It’s amazing how simple it is to create desktop widgets with Qt Web Runtime. I was able to create this “flip clock” widget in less then hour and most of that time I spent tweaking the background image pixels in Pixelmator :)
The code behind this widget is only around 20 lines of HTML, 20 lines of JavaScript, 35 lines of CSS and one config file.
In HTML I only create divs for hours, minutes and date. In JavaScript I refresh the view to show current time and date and start the timer which updates the values in every 60s. Layout is done with a background PNG image and hours, minutes and date DIVs are placed on top of the image in CSS with position:fixed styling.
index.html
...
00
00
-
JavaScript (script.js)
function refresh() {
var time = new Date();
var hours = time.getHours();
if(hours<10) {
hours = "0" + hours;
}
var minutes = time.getMinutes();
if(minutes<10){
minuts = "0" + minutes;
}
$("#hours").text(hours);
$("#minutes").text(minutes);
var day = time.getDay();
var month = time.getMonth();
var weekday = ["Sunday", "Monday",
"Tuesday", "Wednesday",
"Thursday", "Friday",
"Saturday"];
var months = [
"Jan", "Feb", "Mar",
"Apr", "May", "June",
"July", "Aug", "Sep",
"Oct", "Nov", "Dec"];
$("#date").text(weekday[day] + ", " + time.getDate() + " " + months[month]);
}
You can download the source code in ZIP here. You can install the widget directly to your Nokia N900 here.
