Android, Java, Linux, UX/UI

QRite – QR Code Generator

UPDATE: Tanushri recently won a LG G Watch watch in PyCon 2015 (thanks to Google), so we have a watch to start implementing the smartwatch feature. The app will now be free on Google Play as well, as we don’t need money anymore 🙂

I had recently bought a smart-watch (SmartQ Z) and as mentioned in some of my previous posts, I started playing around and creating my own watch-faces. One fine day, I got an idea to put my contact details on the watch screen as a widget showing a QR code (with my vCard encoded) so that if someone asks me for my details, I could just flash my wrist and they could scan and save my contact info. Geek lvl over 9999.

So, I spent some a few evenings with a friend, re-inventing the wheel and created first my QR Code generation app. It was mostly an Android revision for us with some UX/UI brainstorming done now and then. The goal was to make it simple. Very simple. And clean. With just the necessary customizations given to the user. This is how it looks till now:

screenshots

You can check out the beta attempt, get some more details and screenshots here : http://qrite.suchakra.in/ Its an open source app and if you want to use it or want to contribute to the source code, head over to this Github repo. The source is not so rosy and glorious considering I just focused on functionality and gave exactly 0 about anything else :/ It needs some cleanup for sure and it is indeed the next step.

So there are some features already available as configuring color, size and recent contact details for which QR code was generated. And some features are to be added, such as digitizing an already available QR code using your camera and ‘scanning’. The major feature, “Send to Smartwatch” is also left. The plans are to support Android Wear, Pebble and generic android (such as SmartQ Z) platforms. However, I don’t have Android Wear/Pebble for which this could be most useful. If you want to donate a Android Wear or Pebble (if you have one extra) or some money for me to get those, or if you just want to support open source development, you can consider buying the app from this Play Store link (it will be made free as soon as all features are completed). You can also send a donation by clicking 

Just FYI, my goal is approx USD $130 (price of cheapest LG W100 watch). Feedback and suggestions for the app are welcome.

TL;DR – Just another QR code generation app. Open sourced. Smartwatch integration in progress. Donate money for Android Wear/Pebble or submit code if you want.

Advertisement
Standard
Android, Embedded, Linux, UX/UI

Some Cool Retro Watchfaces

These holidays, I was refraining from spending huge sums on stocking gadgets I don’t need. But (un)fortunately, I ended up buying a Nexus 5, a Moga Hero controller and a cheap smartwatch. So what do you do when you get an Android device? Exactly! Start hacking on it – root, custom ROMs, custom kernel, cool apps! So, my experimentation started with the SmartQ Z Smartwatch I had bought. For the price (CAD $91, including shipping from China) this was an irresistible piece of tiny Android to start tinkering around with. It packs a 1GHz Ingenic processor (MIPS) – JZ4775, 512MB DDR RAM and 4GB flash. All of this with a tiny 1.54 inch screen with a 240×240 resolution. The latest firmware supplied by the vendor is based on Android 4.4 with a custom launcher. It is a very hacker-friendly device and came with ‘su’ out of the box 🙂 Though its a bit old (2013 launch) and the manufacturer seems to have abandoned the development on this, for the price, its a pretty impressive piece of tech on your hand.

I decided to make my own watchfaces with custom features and more inspiring UI than the watchfaces provided in the watch. Also, the hidden agenda was to check out the new Android Studio. As with everything Chinese, the SDK and docs for the Smartwatch were in Chinese! But fortunately, after surfing through XDA Developers forums, I found a link to the English docs on their website to refer to the weather APIs that I needed to use. With moderate efforts, I was able to make the following watch faces :

They are actually developed as widgets and the launcher apparently sees if the AppWidgetProvicer class you use starts with the string “WatchFace”. If this is the case, it simply puts that widget along with the custom watch faces in the menu.

If you own a similar watch/with similar screen dimensions, you can try installing the apps or use the source code for building your own cool watchfaces. I really wish I had an Android Wear watch rather than this so that I could develop on a more useful and up-to-date platform. Thanks for reading. Happy new year! Here is the source code and specs for these watch faces :

LCD Watch Face

Source : https://github.com/tuxology/LCDWatchFace

Download : lcdwatchface.apk

CRT Watch Face

Source : https://github.com/tuxology/CRTWatchFace

Download : crtwatchface.apk

If you find any bugs, report them on Github. Also, if you want me to port them on Android Wear, let me know. I’ll try to do that in emulator.

Standard
Embedded, Linux, Qt

Qt Apps on Android! Part Two : An App(le) a day

No guys, this post is not related to Apple Inc or Steve Jobs but to my previous post 🙂 We now are in a position to have our development setup ready for Qt app development on Android so lets begin with the actual stuff. I shall take an example of the digital clock app you had seen in the previous post (reproduced here for your sake).

For some Qt newbies, its also going to be a tutorial on using Qt Creator effectively. We shall cover UI design and then do some coloring and stuff like that to make it more beautiful. Then we shall code the app so that your clock works.

Requirements

For your reference, I have put up this simple app on my git repo or maybe you can get the tarball from here

Step 1

Start the Necessitas Qt Creator and create a new Qt Gui Application from File > New File or Project > Qt Widget Project > Qt GUI Application

Step 2

Choose the project name and location and after that choose the Qt version as  Qt for Android which we created in the last post.

You can also select the Desktop version to for prototyping your app for the desktop x86 host. Once the project is created you can see the auto generated files under Project as shown below. The file tuxologycloxk.cpp is the one in which all the logic goes.

Step 3

Under Forms, click the .ui file and start making the UI. Its a pretty easy job actually, you have to drag and drop the required widgets and arrange them properly in something called as layouts. Just analyse a bit how I have created the UI for the clock.

You can drag and drop the Widgets from the left panel to the form view and the corresponding Objects will be created in the right top panel as shown above. The property for each project can be set directly from here only. For eg. the initial value (initValue) for the lcdNumber object has been set as 1200 above. You can actually set the widgets background as well as the whole application colour palette by changing properties of the respective objects.

Notes on StyleSheets

You can also apply styleSheets to make your app a bit beautiful too. For example the Exit text that you see in the application is actually a button with some styles applied. You can set styles using the UI editor quite easily. Just right click the corresponding widget and click on Change styleSheet. You will get window as shown below in which you can apply your desired style.

The above stylesheet changes a button from the boring button widget to a sleek black button which mixes well with the application’s look and feel.

Step 4

Look closely and you will understand that writing code is no big deal too. Just refer my digital clock source and browse through the code to understand it. Just a small reminder on creating signals and slots – You can click on the widget directly to create slots for the specific signals they will emit. For eg. right click Exit and select Go to slot.. A dialog box will ask you the signal which will be emitted and when you hit Ok a slot in the code will  be automatically generated. Now you can write whatever code you want to implement in that slot.

Step 5

Assuming that you have created the application, you can do some other settings too. Just click on Projects on the left panel and you will see different targets for you application. We had opted for Android as well as Desktop in the beginning so both shall be shown here. Click on Run and then Details under Package Configuration. You will see some configuration tabs as shown below. You can fine tune some stuff from here of course such as Android Permissions, app name, app icon etc.

You also have an option to either deploy local Qt libs for the device or use device’s libs. If you have installed Ministro from Android market to your device, just leave it to use the devices qt libs. However, if you are going to use the emulator, make sure you get the Ministro apk from here and install it on the emulator by selecting the third option below.

Once all is set its time to connect your device, set platform as Android and hit Run (Ctrl+R) You can see the compile output on the compile output window and the debug messages in Application Output window (hit Alt+3 or Alt+4 to switch) Watch out for any build issues too. I hope the same stuff works fine with an AVD too as I haven’t tried that out actually. I do all my testing on my rooted Sony Xperia mini x10 Pro and the first image in this post is what you should get if you try to build the TuxologyClock project for your device.

Thats all Folks! Happy hacking!

Standard
Embedded, Linux

Qt Apps on Android! Part One : <3 is in the Air :)

Have you loved two tangentially apart technologies at the same time? Its like holding one girl’s hand while you woo another one 😉 Yeah something like that is the case with me. To my girl – “Its OK sweety, I’m just talking about Qt and Android :)”

There must have been a time when you would have thought, “Oh God, I wish I could just port all these apps I run on my desktop to my new android phone.” Or maybe you are one of hose who say, “I wish I could use my Android cell to prototype my new Qt based embedded device that I am making. It’d be something cool to show to those black shoes, red tie morons in the conference room.”

The Necessitas project comes to your aid guys. I shall be writing a short tutorial series on creating small Qt app like these :

in the speediest of ways and port it to your device. This part will consist of setting up the tools necessary for Qt application development on Android

Necessitas

Also known as Android Lighthouse project, this is the individually developed port of Qt for Android. Necessitas comes with a modified Qt Creator IDE for building, deploying and even debugging your applications directly for your Android device. You will be amazed to see the ease with which you can develop and debug your apps. Say thanks to BogDan Vatra and those unsung heroes who have brought this to you. Now lets begin.

Get Necessitas SDK

Get the Necessitas 0.3 online installer from here. I however downloaded the 0.1.1 version available as an offline install which serves the purpose well. Its available in old versions directory. The installation is pretty straight forward. Just run the installer and make sure that you install the SDK in /opt/necessitas. You may have to make your /opt 777 for sometime and then revert back to 755 once the installation is over.  The SDK mainly consists of the cross compiler for android on ARM and lots of cross compiled ARM libs for Qt. I have mentioned in previous posts how to do all that manually but here, its all ready for you 🙂 Once the installation is over, you will get a Necesitas Qt Creator in your applications. This is almost same as your traditional Qt Creator IDE. We shall move on to configure it now.

Configure Qt Creator

Requirements :

  • Install ant if required by yum install ant
  • Check whether you have JDK with java -version
  • Get Android SDK from here
  • Get Android NDK from here

Step 1

Extract the SDK and NDK at some locations and start Necessitas Qt Creator/Qt Creator for Android and go to Tools>Options. Click Qt4 tab and Add a new qmake path. Give this new qmake path from /opt/necessitas/Android/<qtversion>/bin/qmake This qmake will make the projects and makefiles cross-compile ready. Give some name to it – maybe Qt for Android

Step 2

Now that you have the new Qt setup, Click the Android tab on the left and specify the SDK and NDK target and set proper toolchain as shown below. Also set the ant location and hit Apply

If you are not having any Android device, then create a AVD to test your app. Lastly, some configuration is also required on your device.

Step 3

Now, we have almost everything ready for development on our device, however to run a Qt app we need libraries on the target device. For this, there are two options. Either while developing application, an option to use local Qt libs can be selected or a nifty tool called Ministro can be used. Ministro is an android application that can be downloaded from the Android market. This application performs a one time download of Qt libs from the net on the device as required by the application you have created. In a simple application mostly it will do a mostly 8Mb install of QtCore and QtGui modules.

The next post will describe how to create a small digital clock app (as shown above) using the Qt Creator, something about putting Style Sheets in Qt apps and then get it on your device! Keep experimenting.

Source : http://sourceforge.net/p/necessitas/home/necessitas/

Standard