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!

MacBook Pro 13 Retina + Windows 8.1 Boot Issue

Just unboxed a new MBP 13″ Retina and started the Bootcamp process to dual boot with Windows.  Once I finally got to installing Win 8.1, I rebooted to complete the setup and all I got was a black screen with a blinking cursor.  Searching around I saw lots of options for setting up a repair disk, etc. but being a fresh install I just wanted it to work “out-of-the-box.”  So I continued to investigate…

I suspected the issue had something to do with the hybrid GPT/MBR partition that Bootcamp creates so what I did was re-launch the Windows 8.1 setup (from USB) and deleted the (OS X created) BOOTCAMP partition and let the Windows installer create it.  Now works like a champ.

 

Meta-Meta-Programming … and I like it

I have a client that needs to rapidly create websites that are similar in functionality but needs to make changes to the data model (sometimes significant changes) and have the UI get updated with it, turning around a change within the day.

For this, I decided to base a solution around ASP.NET Dynamic Data for two main reasons: 1. It’s scaffolding concept and 2. The “generated code” has been tested already, shortening the testing cycle as rapid changes are released.

Of course, the out of the box user experience with Dynamic Data leaves much to be desired and is a little too simple for our needs so it requires some customization.  Once the customizations are done, they can be re-used over and over again but ONLY if they are written against a meta model so that they can apply to any entity on our model, not just coded against known entities, etc.

So what’s “Programming”?

In the normal case, programming is simply putting down the instructions required to make our applications work.  This still holds true in Dynamic Data and other “frameworks” … we are just walled into a set of constraints and conventions.

So what’s “Meta-Programming”?

In Dynamic Data, when creating customizations we have to interrogate the meta-data about the model and code against that instead of directly against the known model. We already have the Type object in .NET to discover much of what we need about the model (data type, field names, etc.) and we can enrich this model with attributes for information like descriptive names, validation rules and so forth.

This makes typical “programming” tasks more challenging starting with simple tasks like presenting the data on the screen to querying the data source without actually knowing the model ahead of time.  LINQ queries change from a simple query syntax to expression trees.  Once you get in the right mindset … it’s kinda of fun.

So what’s “Meta-Meta-Programming”?

This is where the real fun starts.  In Dynamic Data, we are using Model-First Entity Framework to essentially drive the entire application.  This generates the model, which we mark up with the metadata so we can “meta-program” around it.  But what if we can also generate the metadata?

By default, the Entity Object code generator creates decent classes which match the model, play nice in OOP and who’s persistence is managed though the generated ObjectContext. But there are lots of fields on the Entity Model which are largely untouched. What if we could “program” the entire application through the Model and with maybe a little side of metadata on the attributes?

To begin to accomplish this, we ditched the default code generation and downloaded (Nuget rocks) the EF5 Entity Object T4 template.  We then began to generate our metadata through addition fields on the model (DefaultValue, Is Nullable, Documentation).  So the T4 template with these additional fields become our meta-meta-programming tasks, we meta-program the UI to react to the metadata, and we toss in some good old fashioned programming when we get sick of expression trees and reflections.

I may write about the T4 template we created but just contact me if you want a copy in the meantime.

Pittsburgh Tech Fest: iOS Best Practices slides & code

Pittsburgh Tech Fest was great this year! It was a perfect opportunity to learn about some different technologies and techniques.  I’d like to give a special thanks to Dave and Eric for doing an awesome job organizing the event and the speakers.

For those that are interested, below are the links to the talk I did on iOS Best Practices: Avoid the Bloat and feel free to comment or ask any questions on this post!

Code before refactoring: https://github.com/JAgostoni/iOS-Best-Practices/tree/master/UglyApp
Code after refactoring: https://github.com/JAgostoni/iOS-Best-Practices/tree/master/NotSoUglyApp
Code as presented at Pittsburgh Tech Fest: https://github.com/JAgostoni/iOS-Best-Practices/tree/master/PghTechFest

PowerPoint Slides: iOS Best Practices – Pittsburgh Tech Fest
PDF Slides: iOS Best Practices (PDF) – Pittsburgh Tech Fest

Thanks again to those that attended my talk!

Creating the Sports Schedules App for the iPhone

I finally released my first real iPhone application in the app store that I did not create specifically for a client. The app is called Sports Schedules (great name, eh?) and is available via the Apple App Store here: bit.ly/SportsAppStore.

First, a quick background

I really do enjoy watching any Pittsburgh sports and it is pretty easy to remember to watch a Steelers football game.  But when it came to college hoops or hockey I frequently forgot about the games and missed them. Being pretty busy with work as well as (the more full time) entertaining my 5 year old I really didn’t leave much mental capacity for remembering there was a game that night.

Well … I have this nice smartphone so I perhaps I’ll put it to work for me, right? So I launched the App Store app and searched for Sports Schedules. I was faced with the very standard problem of finding a useful app in a sea of apps that didn’t do what I wanted. To top I off, there wasn’t an app simply called Sports Schedules so I figured I would just go ahead and create it.

Other apps

There are certainly other apps out there which have schedules for sports in them. First, each sport and even many teams have apps specific to them, but I really didn’t want a bunch of one off apps. Next, there were apps like ESPN, etc. While they have schedules in them … I really wasn’t impressed with the way the information was organized. Lastly, there are apps which simply put events on your calendars and I wasn’t really pleased with that scenario either.

Design

The first thing I was concerned with was creating some a nice, simple design for the application.  I started with some wireframe mockups using Balsamiq (great tool) so that I could initially focus on the information flow within the application.  Since it isn’t (initially) a large app this didn’t take much time: I wanted a dashboard showing the week at-a-glance, and the ability to add and remove teams

Next, I wanted to spend some time skinning this wireframe as I wanted to focus on creating a visually appealing app.  This reinforced the fact that I am a TERRIBLE designer.  I spent hours creating what I thought was an acceptable design and showed it to  my wife.  Trying to be nice she said: “It looks like you did it your self … can’t you buy a design on the Internet or something?”  Thankfully … you can … and I did!

Data

Now that I had proven my lack of design skills, I decided it wasn’t worth putting too much time into the app until I was able to locate a source of the data for the schedules.  Initially, I had thought about just entering it myself or paying someone a few bucks to enter the data into a database manually and keep it updated.  The problem is, that does not scale and is in no way reliable.  Instead, I started the search for a source of the data as an online service.  After searching for well over a week and contacting many many sales people (still gettin’ those emails) I finally found a source for the data … data that is not free and not cheap, as it turns out.  Before fronting the cash, I decided I better actually create the app first.

Developing the app

Once committed to creating the app, the problem became finding time to actually sit down and develop it.  I set a self-imposed deadline of “May” to try to keep motivated. With a full time job and a family this was indeed the most challenging part.  However, I managed to push through it and get the code written so I was able to move on to the next phase, the services.

Services

Next I needed to decide how to get the data updated on the app.  I didn’t want to spend a lot of money on servers but also I wanted to be able to scale up easily.  Elastic cloud computing seemed to make sense but last I had checked cloud services were a little pricey.  Lucky for me, Amazon started their deal where new customers get a pretty good share of EC2 instances and EBS storage free for a year so my decision was pretty easily made.

Next, I needed to decide whether or not to use a Windows instance or a Linux instance.  In a previous life, I did a fair amount of work on Linux but in recent years I was far more productive in Windows so that was my original choice.  The thought was that if I wanted to expand with some web applications I would have a nice .NET and SQL instance setup.  However, I quickly realized that Windows instances in Amazon are not nearly as economical as Linux instances so I scrapped that idea and setup an Amazon AMI Linux instance.  Frankly, the fact that the Windows instance uses a minimum of 30 GB of EBS storage and the Linux instance only 6 GB solidified that plan.

For better scalability and performance I decided to generate static XML data files for the iPhone app to download from.  This would mean fewer resources used on the Linux instance and would enable me to leverage Amazon’s CDN if necessary to better distribute the content.  As a result, I actually have no real web services serving up the content.

Integration

With the plan for services underway, I now needed to figure out how to get the data from my provider into a format suitable for the app.  As an Integration Architect on many projects I learned a lot of patterns and techniques as well as best practices for this sort of problem.  The primary take away is to decouple the data source from the apps in the event I need to replace it or even aggregate the data from multiple sources.  Also, having worked extensively with BizTalk I saw great value in leveraging an integration platform but BizTalk is far too pricey for my problem.  I decided to investigate free/open source integration solutions.

There are several FOSS integration platforms out there: WSO2, Mule, JitterBit, etc.  JitterBit caught my attention for a few reasons: it was simple, it had just the features I needed, and the installation was relatively lightweight.  It also came with a decent development environment.  JitterBit allowed me to very quickly integrate the XML data source with my database (PostgreSQL) and then to output the static XML files.

More app development

Now that I had a steady stream of data coming in from the provider, I needed to finish the coding in the application.  Hooking up to the XML content was a pretty standard academic exercise as was adding in some small features and fixing bugs.

App Store

The part I dreaded most was submitting to the App Store.  One can spend a lot of time and a lot of money just to have Apple reject the app for some completely unforeseen reason.  In nearly all occasions, when I submit to the App Store I get rejected at least once.

I submitted the app fully expecting to get rejected … what I didn’t plan on was that I would be the one doing the rejecting.  In two occasions while waiting for approval I found bugs and needed to reject my own app.  After re-submitting it … twice … I was very pleasantly surprised when my app was approved after nearly EXACTLY one week.

After all the effort, my app was finally in the App Store and working well … maybe a few bugs that need squashed … but overall a pretty smooth launch.