Windows 8.1 Masked TextBox Behavior

Shortcut to the MaskedTextBoxBehavior on GitHub.

Lack of control

One of my (and several others’) main complaints about the Windows Store App dialect of XAML is the lack of many features/controls that we found in WPF and even Silverlight’s dialect.  Windows 8.1 XAML added some back in (like a Date Picker) but one major lacking control is a Masked Text Box where the user’s input could be guided through a mask (like entering in a phone number).  While WPF lacked one, there were plenty of example out there of people that built them (yaay open source) as well as third party options.  Yet Windows Store Apps had none with the exception of a couple commercial products (DevExpress, for example).  I personally felt there should be one out there in the open source world … so I made one (yaay open source).

Control behaviors

One cool thing I like about XAML controls is the ability to extend the behavior of the control without sub-classing through the use of behaviors.  This allows the developer to use whatever object-oriented hierarchy they want and still pile on different/additional functionality of the control.  This was the approach I choose to take for (my attempt to) add a masked input behavior to Windows Store XAML’s TextBox.

More lack of control

I mistakenly thought this would be a relatively straight-forward task but Windows 8.1 once-again removed some useful functionality like the Preview events, etc. I was left with three events: KeyUp, KeyDown, and TextChanged.  It would have been real nice to use the KeyDown/KeyUp events but I was only provided a “VirtualKey” which was going to make things even more cumbersome so I had no choice but to use TextChanged.  Problem is, TextChanged gives me the text after the user has already entered it.  Time to get creative …

Regular Expressions, Oh My!

Instead of writing my own pattern matching / string parsing logic I decided to rely on Regex processing within the .NET Framework.  However, I didn’t want users of this control to have any needful knowledge of the inner logic so I created a straight-forward expression syntax (like ###-##-####) and generated a regular expression syntax from it.  At this point, it was just a matter of handling most of the fringe cases, copy/paste, etc.

Go and get it! Critique it! Fix it!

In the spirit of righting the wrong I tossed my simple version of this behavior up on GitHub with usage instructions, etc.  It is likely there are better ways of handling things to I welcome any and all contributions and critiques on this!

Leave a comment here if you find it useful!

Advertisements

Steel City Codefest 2014 – The Checkpoint

Finally getting around to posting about my experience at this year’s Steel City Codefest where I worked with a team of my colleagues to whip up a prototype of an app for a non-profit organization: TheCheckpoint.org.

THE PROJECT

This particular project was to create a mobile app (cross-platform) for veterans to locate and review/rate resources and services. While this doesn’t sound like a particularly flashy application to work on, we felt it was one with more need than the others (plenty of teams volunteering for other projects) and the challenge was really to try to make something useful and interesting.

THE TEAM AND THE TECH

Initially I had no plans to participate in Codefest but a few of my colleagues at work were joining in so I figured I would give it a shot.  We all have many years of experience working on a variety of technologies but we all shared a common background for C#/.NET so we decided to leverage Xamarin’s cross-platform native app framework so that we could all contribute as equally as possible.  Since we were targeting both iPhone and Android we felt that we were too limited by a hybrid-mobile solution and didn’t have a big enough team to go full native (Objective-C and Java) so Xamarin fit right in the middle.

Additionally, we wanted to share as much code as possible (really the only way to recoup the cost of tools/platforms like Xamarin) so we decided to incorporate MvvmCross, a framework for Xamarin allowing us to only need to re-write the view layer and share all the way down through the ViewModels and so on.

THE PROCESS

While we had done some initial planning after work, we pretty much came in with a blank slate ready to get started.  As I was the only one with a MacBook, I was on the hook for ripping out the iPhone version, Geoff had some Android experience so he was tackling that, Mark started working through integration with FourSquare, and since our designer was a no-show, Steve got stuck with the UX/UI design work and also kicking in on the ViewModels.

15 straight hours of coding later and out pops a prototype of an app:

20140224_142409000_iOS 20140224_142417000_iOS 20140224_142421000_iOS

WHAT’S NEXT

I am planning on finishing this app as soon as I get a chance to get working on it.  To help, I am working with Jared from Checkpoint to apply for some grant money to cover the cost of licenses (Xamarin), services (some mobile backend-as-a-service) and some time/help/kindness of others!