Starter Compatible

Xamarin Starter Edition holds a special place in my heart as it allows anyone to try out Xamarin for FREE to build full apps and publish them to the app store! There are some limitations, but I am extremely proud to say that My StepCounter is 100% Starter Compatible just like the iOS version! By leveraging an ADO.NET database and a few other optimizations I have plenty of room to continue to grow the application.

Open Source

I basically put everything on GitHub that I work on and My StepCounter is no different. Michael James’ has officially excepted my pull request to merge Android into his main repo. We have added full documentation, license, support forums, and a whole bunch more awesome. Head over to the main repo at: https://github.com/MichaelJames6/My-StepCounter

Learning Experience

I have been documenting my experience this entire time as I have been developing and I have a few more things to cover still as I explore all the new APIs with C#. Here is a recap of what I have blogged about so far:

• Project Goals & Using Step Sensors
• Binding Services to Activities
• Make Pretty UIs with fonts & full screen styles

Here is what is still to come:

• Animations in Android
• Leveraging an ADO.NET database
• Project Retrospective

A Special Thanks

I have to thank a few people who helped me out with this project:

• Jérémie Laval - for some android help and testing. Also he launched an awesome new Android app today called Bikr, you should check it out if you cycle!
• Michael James - for starting My StepCounter!
• All my beta testers!
• Android Design Community - for the awesome UI ideas
• My Translators: Jérémie, PatrikSelin, rasumseeg, jramirezdev, claudiut, d1m0nh, & fsdachs for helping me launch the app with Finnish, German, French, Romanian, and Spanish support! More to come soon, feel free to contribute

I hope you give My StepCounter a try and I would love your feedback! My StepCounter uses the built in step sensor on select devices running Android 4.4+. This means as of today I support 85 devices (20+ are unique)! Here is the full list of supported devices: Nexus 5, G2 Mini, G Pro 2, Vu3, L90, G Flax, G2, K91, Moto X, Secret Up, Secret IP, Galaxy S5, Galaxy S4, Noe 3, Tab Pro 8.4, Galaxy Round, Z2 Table, Z1, Z2, Z2 Ultra, Z1 Compact.

This is a joint release with Jérémie Laval’s Bikr Android app, check it out too!

Transparent ActionBar

I Wanted to ensure that the full screen was being utilized for this app, but still wanted to take advantage of the unique actions that I can put in the ActionBar. Luckily Android is highly customizable with styles and themes. To create a transparent actionbar you need to override your themes.ActionBar style and give the android:background and android:backgroundStacked a transparent colors. Additionally I wanted to only show the title and then style the TextStyle to be a bit larger and also use a sans-serif-light.

This bit of code results in a stunning and beautiful look:

Pretty Fonts

I was really impressed with the font selection and usage on the iOS version and I wanted to bring that over to Android. Since I am targeting Android 4.4 I can use all of the nice Roboto fonts built in. If I was targeting an older version I could have used my Roboto.TextView control, however all I need to do is set the android:fontFamily to:

• san-serif
• sans-serif-light
• sans-serif-condensed
• sans-serif-thin

These are all great fonts and when combined with a nice background I get a nice visual look:

Fancy Background

In the iOS version Michael created a custom ProgressView that would change the background RGB based on the percentage that you passed into it. I was actually able to re-use nearly all of this code and put it into a shared file. The main difference was just what property I was settings and how I was creating a new color:

As we can see I have to do a lot of #if defs, but it is nice to re-use all of this RGB arrays so we get the same color on the device. The screenshot I showed earlier you saw a blue background, but what I didn’t show you was how I created this. What I actually did was make my root view the ProgressView, which is a FrameLayout, and then I overlaid another FrameLayout with a blue background on it.

This blue frame layout will be animated later, but here are a few screen shots of what the progress view looks like as I move it:

No Boundaries

After having a few people test out the app I got some instant feedback, which was that I should extend the views up to the System Bar and Navigation Bar. This is a brand new feature in Android 4.4 so why not take advantage of it! It was actually really simple. The first thing I needed to do was add android:windowTranslucentNavigation=“true” and android:windowTranslucentNavigation=“true” to my style:

Now to ensure that any content on the bottom of the screen didn’t overlap there is an important property to set, which is: android:fitsSystemWindows=“true”. I had to wrap my two text views in a FrameLayout which is where I set this property:

And here you have it the final UI:

So there is my base UI with the same ProgressView that we are using on iOS now on Android with pretty fonts as well. Next up is Animations!

Services have a few ways of notifying applications that data has changed. We can either use a broadcast and a receiver to parse the data or we can create a bound service from our main activity. The latter is what we will want to do as I don’t trust the speed of the broadcast receiver compared to a nice bound service which gives our activity full access to the services properties. This is sort of what it looks like:

Luckily the Xamarin documents have great documentation on bound services so it was really easy to implement. We need to create 3 different things:

• StepServiceBinder: Is set in our activity when it requests a BoundService and gives it access to the Service
• StepServiceConnection: Our activity starts a connection which does the binding to the ServiceBinder.
• StepService: This is our service, now doing all the processing!

This code is pretty straight forward actually, which all it does is pass in a reference to the service or a reference to the activity which it wants to bind to:

Our service now is pretty powerful and doesn’t have to do anything special to become a bound service, it will just automatically bind. However one thing that I wanted to have happen was for my Main Activity to be able to get property change notifications so it knows when to update the UI when we step. So all I needed to do was have my Service implement INotifyPropertyChanged and I created a public property called StepsToday which will have an up to date count of total steps taken:

Now all I had to do was go back to my MainActivity and OnStart I will attempt to bind to my service, OnStop will unbind, and when my StepServiceBinder gets set from the StepServiceConnection I will register for PropertyChangedNotifications:

And there you have it I am now able to get property changed notifications from my background service! Now of course I will want to start this service when the Activity starts, but I will also want to start the service when the user reboots their phone so I don’t loose any information. I will need to give my app it’s only permission it required which is ReceiveBootCompleted:

Then I will go ahead and create a boot receiver which will start my service automatically:

I am all set, now just to calculate proper steps and animate the UI!

If you want to learn more about bound services please watch Nina Vyedin video from Monkey Space.

Backgrounding/Multitasking in Mobile - Nina Vyedin from Monkey Square on Vimeo.

Introduced with Android 4.4 was a new step sensor hardware support, which happens to be supported on my Moto X. So naturally as an Android development lover I wanted to test out these new APIs and create My StepCounter for Android. My goal is pretty simple:

• Track Daily Steps with new APIs
• Keep the same look, feel, and animations
• Maintain Starter Compatibility
• Maximize code re-use from iOS version
• Add support for browsing history

So with this in my mind and a Southwest plane ride back from Arizona without internet I started my journey on bring My StepCounter to Android.

Step Counter & Step Detector

Android 4.4 introduced 2 new sensors apis for step tracking: TYPE_STEP_DETECTOR This sensor triggers an event each time the user takes a step. Upon each user step, this sensor delivers an event with a value of 1.0 and a timestamp indicating when the step occurred.

TYPE_STEP_COUNTER

This sensor also triggers an event upon each detected step, but instead delivers the total accumulated number of steps since this sensor was first registered by an app.

These 2 types seem extremely similar, but the documentation says something very important:

"Be aware that these two step sensors don’t always deliver the same results. The TYPE_STEP_COUNTER events occur with a higher latency than those from TYPE_STEP_DETECTOR, but that’s because the TYPE_STEP_COUNTER algorithm does more processing to eliminate false positives. So the TYPE_STEP_COUNTER may be slower to deliver events, but its results should be more accurate."

So I wanted to test them out for accuracy. For testing I put my main logic in an Activity, although I know I would probably want to put this in a background service at some point. To be able to get notification sensors I had to implement ISensorEventListener, which has 2 methods in it: OnAccuracyChanged: called when the accuracy changes. OnSensorChanged: called when the sensor gets an update.

Before I could start testing out these sensors I wanted to make sure that my app could use them and have a way of detecting if the device my app was running on was compatible. So I had to add a little xml to the AndroidManifest.xml and also created a little helper method:

Now to take advantage of these sensors. I didn’t have to do anything for the accuracy changed since I was not interested in that, but for Sensor changed I had to either increase my step count for the step detector or calculate the total for the step counter so I could test accuracy:

With this code in place the only thing left to do was to register for the sensors. This involves grabbing the SensorManager and attempting to get the default sensor for the specific type and then registering the listener. It has multiple delay types, but normal seems to be the way to go:

Now that my sensors are all setup the last thing to do is put in a little UI to do some testing:

There you have it my very first step counter!…. Alright well it isn’t nearly done at all, but this was just Part 1! Here is what I have mapped out currently on my timeline:

• Part 2: Step Counting in a Bound Service
• Part 3: Pretty UI
• Part 4: Pretty Animations
• Part 5: Saving Info to ADO.NET Database
• Part 6: Shipping this app!