A Qt QML Beginner’s Project: MotoRing, part 1 – GPS

I unloaded some Qt newbie frustration the other day detailing my first serious efforts to code for the Nokia N9.  Now I’d like to step back a bit and outline the actual project, and in subsequent posts walk other newcomers through my coding journey of pleasure and pain.

First a disclaimer: I’ve been programming for over 25 years.  That has included COBOL, Forth, Logo, DOS/VAX/Unix batch commands, Basic, LISP, Pascal, C, JavaScript and Visual Basic (both COM and .NET).  While I could work minor wonders with scripting and compiled linear languages, I found that I have been most productive in event-driven VB.Net.  Readers should know that I am not targeting an audience that’s totally new to programming, but rather, programmers who like me are experienced with other languages and platforms but new to Qt.

I really wasn’t very apprehensive about Qt, especially the mature 4.7.  Friends kept telling me how easy it was, and the Qt Creator environment did not look difficult at all at first glance. 

What got me motivated to finally dive in?  I was presented recently with a coding challenge and after some thought decided I would create an app for the Nokia N9 and N950 that would intercept calls and texts for responsible drivers.  I hashed the idea over with Andrew Flegg and Thomas Perl in London last month and they offered some really useful ideas.  Then I discovered not long ago that apps of this sort already exist for other platforms so there certainly appeared to be a need.

I elected to go the Qt Quick route and see if I could do this completely using QML and JavaScript .  What better test of QML’s depth and breadth?  I also have some experience with JavaScript and none with C++ so that was a deciding factor as well.

With any project, it’s always good to tackle requirements first.  So other than a clever name (in this case, MotoRing) what were mine?

  • Constantly retrieve current device speed (in user-preferred units)
  • Intercept calls and texts when device is moving above a preset threshold
  • Send automatic text to callers/texters informing them that driver is not taking calls.  They should be instructed to immediately call back if there is an emergency
  • Allow calls through from previously intercepted number if placed within specified time frame (i.e., emergencies)
  • Automatically exit app after device has been moving below speed threshold for a given amount of time

That’s pretty much it.  Of course we can add more bells and whistles, but it’s usually best, especially for us beginners, to focus on core functionality first.  On that note, as I began this I wasn’t even sure if QML and JavaScript could handle this idea.  So the first order of business was to check that out, starting with the GPS need.

As I noted in the previous article, I found example code right away.  After some small bugs were exorcized, the example ran perfectly.  I just needed to add Speed capture.

No need to rehash my struggles with Qt Creator’s behavior.  I’m learning to work around its occasional flakiness anyway (and will report bugs once I get a good grip on what’s been happening).  My main problems outside of bugs and IDE quirks had to do with QML element layout.  Minor changes kept flinging things around my workspace.  Then I came to understand that Qt Creator allows UI elements to be positioned relative to each other… and that’s how my selected sample code was oriented.  This is an elegant solution to the need for fluidity on mobile devices, especially in handling portrait and landscape flipping.  On a related note, I had also been mystified as to why the layout Grid in the sample code extended beyond my portrait mode boundary, until I realized that this was done to accommodate landscape mode.

Ah HA!

With this new-found grasp of QML layout features I was able to make changes to elements positioning without fearing their fall into some IDE black hole.  That included adding a new Speed indicator for testing purposes (I really don’t need all the other GPS properties).

Getting the speed indicator to work was easy.  I found what I needed on a Qt API documentation page and It Just Worked.  But in my excitement I neglected to note how speed was returned.  My youngest son and I took the app out for a test drive and were mystified at the results.  Speed in MotoRing seemed to be about a fourth of actual.

I felt pretty stupid when I discovered the next day that speed is shown by default in meters per second.  That is, 3.6 kilometers per hour.

Of course in the US we measure miles per hour.  I wanted my app to be able to handle either, so I needed a function.  I whipped the following up in JavaScript (precision is truncated):

function speedConvert(speedState) {
if (speedState == buttonMetric)
return 1.00;
return 0.62;

I also added a ButtonRow element to the top of the page to toggle miles-per-hour and kilometers-per-hour.  The text box for speed passes the state of this element through the JavaScript function above to determine which is being used.  There is probably an even easier way to do this but my method works well.  Not counting a brief hair-pulling period where I forgot that JavaScript has no “THEN” in “If/Else” statements.  Oops!

After I got this part working well, I updated the code at wiki.meego.com/QML/Get_GPS_data.  If you have ideas on how to improve it further, feel free!

Some things to note:

  • It would be nice to have the app automatically set units of measure based on localization settings, but I’m not even sure QML can support that.  Readers?
  • I would have rather used a RadioButton rather than ButtonRow element– but despite what’s shown in the Harmattan API documentation, it does not appear to be available for that platform.  Question: why would this be a Symbian-specific element?  Radio buttons are very common UI features
  • Speed accuracy seems to be +/- about 3 miles per hour, so consider that when you set thresholds

Next: I need to add the threshold setting, and look into SMS interception…

On a broader note: if you’re interested in this series, and/or articles that strive to make technology more accessible, make sure to subscribe to this blog as that will be more of the focus going forward.  And feel free to share articles!


18 responses to “A Qt QML Beginner’s Project: MotoRing, part 1 – GPS

  1. Keep using a ButtonRow. RadioButton is very Desktop-ish, and button row has the practical advantage of visually showing the active interaction area better (even though the physical area should be about the same with the radio button if it’s properly implemented, i.e. you can toggle it by pressing on its label) and also showing the current status better (whole area of item highlighted vs. only a dot in the control element on the left).

  2. Interesting article, hopefully this becomes a series. But how about a screenshot? Don’t be shy! 🙂
    (The link to the meego-wiki is not correct.)

  3. “It would be nice to have the app automatically set units of measure based on localization settings, but I’m not even sure QML can support that. ”

    This is possible, but practically not worth the effort. Most countries use Metric system alone, especially those which were colonized by British, and it is a STANDARD system too. So it is good not to provide any localization (at least, not bad).

    To justify further, all formulae(British English ;)) in physics are formulated for measuring in standard units only. I have read an article about Nasa scientist had used the non-standard(American) system when designing their satellite(without knowing that that ‘particular’ physics equation will give values in Standard system) and paid a huge price for their mistake.

    So please try to use metric system, thus making your application to be distributed to all countries.

    Otherwise welcome to Qt development. Been addicted to the Qt stuff for about an year & a half. Esp. the Qt Labs is impressive where all Qt developers can collaborate. 🙂

    • Maybe I wasn’t clear.

      The app is mainly concerned with speed. Yes, many nations are on the metric system but here in the US we are stuck with miles per hour as our unit of measure. I would like to set defaults accordingly BUT allow for override by the user. Right now the app supports toggling with no way of determining which makes more sense for the user as default. That’s what I would like to change.

    • I’m not sure you can blame us Brits on metric units usage.

      We anachronistically still use Miles for roads in the UK. Pretty much everything else is metric though except for in pubs where it’s pints (which are larger than US pints) or maybe the occasional yard of ale. 😉

  4. I think that instead of moving on to the next development phase as I had intended, in the next article I’ll post an app screen shot and relate/breakdown the existing code for other newbies. Sound good?

  5. I would guess (ie. I’ve not looked so may be talking out my ass) but RadioButton will be available as a QtComponent under Symbian but not shown in the gallery in QtDesigner. It will be available if you code it by hand.

    This seems to be a limitation in QtDesigner in the current v2.3.1 QtCreator tools.

    It’s very frustrating as a newb trying to write Harmattan apps when the Qt tutorials and examples used for Symbian show the components in QtDesigner but they disappear if you start the tutorial project as Harmattan.

    • I *did* find an example of a RadioButton coded up for Harmattan, but the example came up short. It showed a single button (really?) with no mention of how a multiple-button component would be created.

      But, yes, your second paragraph was my experience!

  6. Pingback: Early December stuff – Randall "Texrat" Arnold

  7. Pingback: A Qt QML Beginner’s Project: MotoRing, part 2 – Rewind and Reveal | Tabula Crypticum

  8. You know what texrat – I’m in the same position as you, but with much less experience. I am working on creating a ebay application using QML, the biggest issue I have is design! How do I solve the problem of multiple screens? Which widgets should I use for the buttons? What about each screen? Should it be a rectangle? What about code re-use?

    How do I find out the device height/width and set this as a global variable? How do I make it work correctly with vertical/horizontal positions?

    Questions questions…. i’m open to sharing ideas if you are, maybe we should make a thread on maemo where we are able to discuss this?

  9. Pingback: A Qt QML Beginner’s Project: MotoRing, part 2 – Rewind and Reveal

  10. Pingback: More Post-MeeGo Musing: Community Echoes | Tabula Crypticum

  11. Ecxellent idea for an app!! I actually thought about this a few years ago.. Have an app that automatic starts as you start moving at a certain speed, say 20 mph, basically using the gps/network info to read the speed you are moving allowing for the app to figure you are on a moving vehicle and respond for you, I basically thought a text message was fine.. Unfortunately I am no programer of any sort so..
    I ve heard such apps like this are already on iOS and aOS as well, but I’m a nokia user so I wouldn’t know.. Anyways looking forward to checking out your app as soon as its ready for testing! Good luck.

  12. Do you know how to get info on what is the quality of GPS signal? If I am not using assisted GPS it rakes quite some time to acquire GPS signal on Symbian Anna phones and older ones. I would like to put some kind of progress bar on the screen to show to the user how much GPS data has the phone gathered.
    Also it would be cool to show GPS signal quality.

    Does anyone know how to do this in QML?

  13. Pingback: Qml | TagHall

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s