that’s whacked

Android UI… fragmentation?

Tuesday, Aug 3. 2010  –  Category: Android, Code, Musings, Rdio

Perhaps fragmentation isn’t the right word… but this issue certainly confuses me.  It seems trendy to throw about the term ‘platform fragmentation’ as it pertains to Android, so I’ll capitalise on that buzzword and go with that for now.  (To be fair, I’d love to be proven wrong and will happily eat my words if someone can point out a better way I should be addressing this).  While developing the Rdio Android app, I’ve been testing on a bunch of different devices and frankly, with generally stock widgets in use, I’m running into the problem where widgets look different on each device.  This wouldn’t be so much an issue, except often times the differences are visual/stylistic tweaks in things like background images or colours which cause our design assets (icons, text colour, etc.) to look bad on one or more devices.

Case in point: TabWidget.  Using a completely stock TabWidget on our app which has minSdkVersion 4 and targetSdkVersion 6, I get the following:

Android 2.2 on Nexus One

Android 2.1 + Sense UI on HTC Droid Incredible

Android 2.1 + Sense UI on HTC Hero

Android 2.1 + Motoblur on Motorola Droid X

In each above screenshot, the leftmost tab is selected (i.e. active/current), the centre tab is focused/pressed (i.e. my finger is currently holding it down but I haven’t released it, while the rightmost tab is unselected.

As you can see from the above images, things like the selected and unselected tab icons look fine on the Motoblur and Hero with Sense UI, but look like crap on the Droid Incredible with Sense UI and stock Android on the Nexus One.  Meanwhile text colour looks fine on Motoblur, looks passable on the stock Android, looks mostly awful on the Droid Incredible with Sense UI, and is completely unusable on the Hero with Sense UI.

One option we have available to us is to hardcode all our own widget styles, which means completely skipping the system look and feel.  This is great for the Rdio brand (i.e. we can use our own highlight colours, etc.).. but this is like going back to the days of the 1337 90s when we were all cool kids in college running Litestep, XFCE, GNOME, etc. and only apps with custom themes and skins.  At some point it gets old, we grow up, and we want apps that match the system styles.  I don’t mind mobile apps having their unique personality, but I don’t want widgets having their own custom look and feel.  I want a ListView in one Android app to look and behave like ListViews in other Android apps.  Ditto that for TabWidgets, Buttons, etc.

But how are we supposed to do that if there isn’t a standard widget style we can rely on?  Am I just missing something painfully obvious about system-wide styles I should be using?  And what about custom widgets?  For example, in the above screenshots, each album art is clickable and relies on a “button” like look and feel to it… but buttons on stock Android use orange focus/select/press states, while on Sense UI they use green, and on Motoblur they use red.  We need to make custom graphics (in this case a 9patch drawable) for this, so are we expected to make one version for every vendor?

What are other Android developers doing to get around these annoying vendor-specific extensions and styles to the Android UI?

Building & simulating Blackberry apps with the Blackberry SDK on Mac OS X

Wednesday, Jun 2. 2010  –  Category: Development, Rdio

As I recently blogged, I just started working at Rdio. Specifically I’m working on the Android app. A fair amount of code is shared between our Android & Blackberry app (since they both use a common platform of Java). Since I’ve been making changes to the Android code, I wanted to be able to build the Blackberry app to make sure I didn’t regress or break anything there.

I’ve got a shiny new MacBook Pro, and well… it just feels like sacrilege to be running Windows on this thing. So I set out to see if I could get the latest Blackberry SDK working on OS X. And… well, it works! Requisite screenshot:

I owe a huge amount to this blog post, which I used and simply updated and hacked around with the latest rev of the SDK… I can’t claim much creativity for my steps since it’s clearly a derivative of azizuysal’s work.

Downloads

• Eclipse 3.5 (I used the Eclipse IDE for Java Developers package)
• Blackberry SDK/JDE for Eclipse (As of the time of this writing, I got BlackBerryJDEPluginFull1.1.2.201004161203-16.exe)
• bb-ant-tools (I got bb-ant-tools-1.2.8-bin.zip)
• mpowerplayer (I got build 1185)

SDK & ant Setup

1. Install Eclipse wherever.  It doesn’t matter where.
2. Create a Blackberry directory for your Eclipse workspace and to hold the SDK.  I used /Users/stevel/ws/Blackberry.
3. Launch Eclipse and specify that directory (/Users/stevel/ws/Blackberry) as your workspace directory.
4. Launch a terminal and do the following:
   1. mkdir $HOME/ws/Blackberry/SDK
   2. cd /tmp
   3. unzip $HOME/Downloads/mpp-sdk-1185.zip mpp-sdk/osx/preverify/preverify
      unzip mpp-sdk-1185.zip mpp-sdk/osx/preverify/preverify
   4. unzip $HOME/Downloads/BlackBerryJDEPluginFull1.1.2.201004161203-16.exe
      1. (this will create two directories: InstallerData & Windows)
   5. unzip InstallerData/Disk1/InstData/Resource1.zip “C/ABS10/Components/EclipsePlugin/1.1.2/EclipsePlugin/installer/InstallAnywhere/InstallerData/EJDE\ Plugins1ae15a8ca04czgiasf.jar”
      1. (this will create a retardedly long subdirectory path, as you can see)
   6. unzip C/ABS10/Components/EclipsePlugin/1.1.2/EclipsePlugin/installer/InstallAnywhere/InstallerData/EJDE\ Plugins1ae15a8ca04czgiasf.jar
      1. (this will create two subdirectories: features & plugins)
   7. rm -rf C_ InstallerData Windows features
   8. cd $HOME/ws/Blackberry/SDK
   9. mkdir net.rim.ejde.componentpack5.0.05.0.0.25
   10. cd net.rim.ejde.componentpack5.0.05.0.0.25
   11. unzip /tmp/plugins/net.rim.ejde.componentpack5.0.05.0.0.25.jar
   12. mv /tmp/mpp-sdk/osx/preverify/preverify components/bin
   13. chmod +x components/bin/preverify
   14. cd ..
   15. mkdir bb-ant-tools-1.2.8-bin
   16. cd bb-ant-tools-1.2.8-bin
   17. unzip $HOME/Downloads/bb-ant-tools-1.2.8-bin.zip
   18. rm -rf /tmp/plugins /tmp/mpp-sdk
5. Now go back to Eclipse, and go to the Eclipse>Preferences menu
6. Go to Java>Build Path>User Libraries and click New
   1. Enter “Blackberry 1.1.2″ as the library name.
   2. Click Add Jars and select $HOME/ws/Blackberry/SDK/net.rim.ejde.componentpack5.0.05.0.0.25/components/lib/netrimapi.jar
   3. Then select Javadoc location and choose the $HOME/ws/Blackberry/SDK/net.rim.ejde.componentpack5.0.05.0.0.25/components/docs/api directory
7. Go to Ant>Runtime in the Eclipse preferences
   1. Under Global Entries, click Add External Jars
   2. Choose $HOME/ws/Blackberry/bb-ant-tools-1.2.8-bin/bb-ant-tools.jar
8. Click Okay and save the Preferences
9. Add $HOME/ws/Blackberry/SDK/net.rim.ejde.componentpack5.0.05.0.0.25/components/bin to your PATH via your .bashrc file

Building Hello World

1. Follow the exact steps (heck, use his sample code) in the blog I linked to above.  It works perfectly.
2. Only hitch is make sure to update the jde.home & simulator.home properties in your build.xml to the right paths of course.

Running the Simulator

1. Call me nuts, but I didn’t feel like install MacPorts.  Instead, I built my own Wine from source.  To do this, just follow the instructions here.  I installed it to /usr/local.
2. Grab winetricks and put it somewhere in your path (curl http://www.kegel.com/wine/winetricks > $HOME/bin/winetricks)
3. Install various winetricks packages:
   1. gdiplus msxml3 msxml4 msxml6
   2. (yes really, I had to install all 3 for some reason.  I have no idea why)
4. cd $HOME/ws/Blackberry/SDK/net.rim.ejde.componentpack5.0.0_5.0.0.25/components/simulator
5. cat 9550.bat | sed -e ‘s/^M//’ > 9550.sh
   1. note the ^M isn’t a literal ^M, it’s the ctrl code for <Return>, hit Ctrl-V and then the Return key to generate it.
6. Edit the 9550.sh file and make it look like:
   1. #!/bin/sh
   2. cd “dirname $0“
   3. /usr/local/bin/wine fledge.exe /app=Jvm.dll /handheld=9550 /session=9550 /app-param=DisableRegistration /app-param=JvmAlxConfigFile:9550.xml /data-port=0x4d44 /data-port=0x4d4e /pin=0x2100000A
7. Fixup the 9550.xml file

1. cat 9550.xml | sed -e ‘s/^M//’ > /tmp/foo
2. mv /tmp/foo 9550.xml