Baby Time – My first entry into the WP7 Marketplace

LargePCTile   SelectWeek   PickWeek CurrentWeek

Yesterday morning, my first Windows Phone application was accepted into the Marketplace.  It’s a pretty simple application that helps moms-to-be keep track of their baby’s development before they are born.

Why Baby Time?
We are currently expecting a baby girl and it seemed like every other day, my wife would ask me about which week she was on at the moment.  Also, as each week passed, she would go on the web and check for the expected baby weight/length as well as what was going on this week.  At the moment I was working on another (bigger) WP7 app an I thought that it would be fun to put something together for her.  Once I got started, a few other ideas came to mind (such as international measures) and the app was on its way.

Technology
Earlier in summer, at Jax Code Camp, I went to a session on the Caliburn.Micro framework, and I was hooked!  I worked on a couple of Silverlight apps this year where we used another framework and Caliburn.Micro just seemed like it was so much lighter to use and it was a lot easier to accomplish my “no code-behind” goal.  It also has great support for Tombstoning, and a few other features.  So I decided to give it a try for this project and it was a great decision. 
For my controls, I used the Silverlight Toolkit (WP7 version) since I needed a nice calendar control.  I used the standard Panorama control for my “week picker” and then plain standard textblock controls and buttons for everything else.
My data is stored in an xml file, which is an embedded resource, and I used LINQ to XML to load the data into my data object.

All in all, since I am pretty comfortable with Silverlight, the development experience was really good and felt very natural.  Granted, this is not the most advanced application in the world, but still, i would imagine that it would’ve been a ton more work on other platforms.  The hardest thing for me was to come up with my graphics, but that’s mostly because i’m very graphically-challenged 🙂

Some show-and-tell
As I mentioned, my “week picker” uses a panorama control. The items in the panorama are data-driven based on what weeks I have defined in my XML file.  So I used the ItemTemplate to define what each item should look like and bound the Panorama Control to a List in my ViewModel.  Yes…simple!

        <controls:Panorama x:Name="panoWeek" Grid.Row="1" 
                           ItemsSource="{Binding WeekNumbers}" 
                           DefaultItem="{Binding WeekNumber}">
            <controls:Panorama.HeaderTemplate>
                <DataTemplate>
                    <TextBlock Text=""/>
                DataTemplate>
            controls:Panorama.HeaderTemplate>
            <controls:Panorama.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock TextAlignment="Center" FontSize="300" Text="{Binding}" Foreground="#FF1BA1E2"/>
                    StackPanel>
                DataTemplate>
            controls:Panorama.ItemTemplate>
        controls:Panorama>

And my ViewModel property (yes, Caliburn.Micro is that cool):

        public List<int> WeekNumbers
        {
            get
            {
                return BabyData.AvailableWeeks;
            }
        }

The calendar control was really easy to use.  I was not able to figure out how to hook up the control to Caliburn.Micro (I know, I’m a n00b) , so I ended up using the standard Binding sintax for that:

<toolkit:DatePicker x:Name="StartDate" Value="{Binding StartDate, Mode=TwoWay}"  />

And then to finish off, I had to send out an email and browse to my website. Note that this “magically” works because I named my buttons “Email” and “BrowseToM2E” respectively:

        public void Email()
        {
            EmailComposeTask task = new EmailComposeTask();
            task.To = EmailAddress;
            task.Subject = "Questions about BabyTime";
            task.Show();
        }

        public void BrowseToM2E()
        {
            WebBrowserTask task = new WebBrowserTask();
            task.URL = CompanyUrl;
            task.Show();
        }

Conclusion: It’s really easy to build a Windows Phone 7 application, especially if you already know .NET and Silverlight!

Here’s a quick recording of the app in action:

<\/param><\/embed><\/object><\/div>“;” alt=””>

About esteban

Esteban is the Founder and Chief Technologist at Nebbia Technology, an ALM consulting and Azure-powered technology company. He is a software developer with a passion for ALM, TFS, Azure, and software development best practices. Esteban is a Microsoft Visual Studio ALM MVP and ALM Ranger, Pluralsight author, and the president of ONETUG (Orlando .NET User Group).


Leave a Reply

Your email address will not be published. Required fields are marked *

Are you human? *