trentacular

Have you ever wondered what that historical marker says that you just passed while driving down the road? Well, there’s an app for that, if you live in Texas.

Please cut to the chase and give me the links

• WP7 Fanboys – Open in the WP7 Marketplace
• iPhone/iPad Fanboys – Open in the App Store

Texas Road Side History was first thought up by my colleague Derek Martin as one of four applications our Slalom Consulting Dallas office developed during a one day Windows Phone 7 “lock in”.

One of our goals was to learn how to make use of Microsoft’s SQL Azure and Azure Web roles. Using SQL Azure, we took advantage of the Geography data type and the STDistance function to query for historical markers by proximity. We next exposed a WCF Web service for executing the proximity query. And lastly, generated an OData endpoint using WCF Data Services for all of our basic data access needs.

After several iterations of submissions and rejections to the WP7 Marketplace, Texas Road Side History was finally approved. Microsoft’s approval process was very impressive. Each time we received a rejection, it came with a very thorough report with the reasoning and the exact steps needed in order to make the application comply. It is clear that Microsoft is focused not on the quantity of apps in the Marketplace, but on the quality.

After our “lock-in”, I caught the mobile bug and wanted to see what iOS was all about. Dabbling a bit with Objective-C, I quickly turned to MonoTouch – which left me with just iOS APIs to ramp up on. For some of the details on consuming the WCF and OData services, read my previous two posts here and here.

Submission to the Apple App Store via iTunes Connect was a bit less impressive, albeit, faster time to market (4 days after submitting). The iTunes Connect site took a bit of getting used to. Fortunately, the app was approved on first submission; which is unfortunate in the sense that I can not report on the quality of an App Store rejection report.

Texas Road Side History has proved to be a well-rounded mobile app for getting our feet wet in the mobility space. Whether you are a history nut or just curious to see what our first mobile app looks like, I hope you’d give it a spin and let me know what you think.

Stumbling here because you are having trouble updating a service reference in your Windows Phone 7 application? Are you getting a warning that reads something like this?

Custom tool warning: Cannot import wsdl:portType

Error: Could not load type 'System.Runtime.Serialization.DataContractSet' from assembly 'System.Runtime.Serialization, Version=2.0.5.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e'.

Or this?

Custom tool warning: No endpoints compatible with Silverlight 3 were found. The generated client class will not be usable unless endpoint information is provided via the constructor.

I’ve had this problem several times now, and each time I’m stumped why this happens. So I am writing down what causes this once and for all so that I don’t keep forgetting. Here it goes …

Frequently I am wanting to consume OData feeds within my apps. An easy way to do so is to use the Open Data Protocol Client Library available on CodePlex. The library contains the System.Data.Services.Client.dll assembly that you reference in your Windows Phone application project.

This assembly is trouble when trying to mix with service reference generation. I’ve seen posts that talk about deselecting the “Reuse Types in Referenced Assemblies” option when generating the reference, but this is not exactly a solution I am happy with. What if I do want to reuse types?

The best workaround I’ve come up with so far is to generate my service references in a separate Windows Phone Class Library project that does not reference the System.Data.Services.Client.dll. I then add a project reference to this class library in the WP7 application project. Finally, I need to copy the system.serviceModel entries generated in the class library’s ServiceReferences.ClientConfig file to the WP7 application’s ServiceReferences.ClientConfig file.

It is also probably not a bad idea to include any OData generated proxies along with the System.Data.Services.Client.dll in a separate Windows Phone Class Library project as well.

I hope this post saves you some headache as it will for me time and time again.

I’ve recently adopted MVVM Light as my MVVM framework of choice for both Silverlight and Windows Phone 7 development. Why use frameworks like MVVM Light? First and foremost, to achieve clear separation of concerns between the application UI and the backing data. While this goal seems fairly elementary, pulling this off in practice can be quite challenging due to how Microsoft has designed some of the native controls. The Bing Maps control is one good example.

In my scenario (which I would guess is a fairly common scenario), I am data binding multiple locations as push pins on the map. Clicking on a push pin should cause the application to navigate to a details page (a responsibility of the view), but also the corresponding view model for the details page needs to be notified of the location in context. This is where things get a little tricky and the MVVM Light EventToCommand behavior and Messenger features come to the rescue.

To begin, I’ve put together a simple map view shown below. Notice the two interaction triggers on the map push pin. The second trigger is the navigate action … straightforward enough. The first trigger is the MVVM Light EventToCommand behavior that invokes a command called ‘SelectCommand’ on the bound location.

<phone:PhoneApplicationPage
                            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                            xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
                            xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
                            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                            xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
                            xmlns:ic="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions"
                            xmlns:Maps="clr-namespace:Microsoft.Phone.Controls.Maps;assembly=Microsoft.Phone.Controls.Maps"
                            xmlns:gs="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WP7"
                            xmlns:c="clr-namespace:Trentacular.Phone.Converters"
                            x:Class="Trentacular.Phone.MainPage"
                            FontFamily="{StaticResource PhoneFontFamilyNormal}"
                            FontSize="{StaticResource PhoneFontSizeNormal}"
                            Foreground="{StaticResource PhoneForegroundBrush}"
                            SupportedOrientations="Portrait"
                            Orientation="Portrait"
                            DataContext="{Binding Main, Source={StaticResource Locator}}">
 
    <phone:PhoneApplicationPage.Resources>
        <c:GeoCoordinateConverter x:Key="GeoCoordinateConverter" />
    </phone:PhoneApplicationPage.Resources>
 
    <Grid x:Name="LayoutRoot">
        <Maps:Map ZoomLevel="10" Center="{Binding Path=MapCenter, Mode=TwoWay}">
            <Maps:MapItemsControl ItemsSource="{Binding NearbyLocations}">
                <Maps:MapItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Maps:Pushpin Location="{Binding Converter={StaticResource GeoCoordinateConverter}}" >
                            <i:Interaction.Triggers>
                                <i:EventTrigger EventName="MouseLeftButtonDown">
                                    <gs:EventToCommand Command="{Binding Path=SelectCommand}" />
                                    <ic:NavigateToPageAction TargetPage="/Details.xaml"/>
                                </i:EventTrigger>
                            </i:Interaction.Triggers>
                        </Maps:Pushpin>
                    </DataTemplate>
                </Maps:MapItemsControl.ItemTemplate>
            </Maps:MapItemsControl>
        </Maps:Map>
    </Grid>
 
</phone:PhoneApplicationPage>

For the sake of brevity, I am going to skip the Main view model, which contains a MarkerViewModel-typed ObservableCollection property called NearbyLocations that gets bound to by the MapItemsControl’s ItemsSource property shown above.

Now lets take a look at the MarkerViewModel class that serves as the view model for a single location on the map represented by a push pin. Notice the implementation of the SelectCommand property, which simply fires a PropertyChangedMessage. This will allow the details view model which listens for this particular message to update its context when the push pin is clicked.

        public class MarkerViewModel : ILocation
        {
            public Marker Marker { get; set; }
 
            public double Latitude
            {
                get { return Marker.Latitude; }
            }
 
            public double Longitude
            {
                get { return Marker.Longitude; }
            }
 
            private ICommand _selectCommand;
            public ICommand SelectCommand
            {
                get
                {
                    if (_selectCommand == null)
                    {
                        _selectCommand = new RelayCommand(() =>
                            {
                                var messenger = Messenger.Default;
                                messenger.Send(
                                    new PropertyChangedMessage<Marker>(null, Marker, "SelectedMarker")
                                    );
                            });
                    }
                    return _selectCommand;
                }
            }
        }

Finally, in the constructor of the Details view model we register to listen for the Marker-typed PropertyChangedMessage message.

    public class DetailsViewModel : ViewModelBase
    {
        public DetailsViewModel()
        {
            if (IsInDesignMode)
            {
                Marker = new Marker
                {
                    ID = 1,
                    Title = "Design Mode Marker Title"
                };
            }
            else
            {
                Messenger.Default.Register>(this,
                    message =>
                    {
                        DispatcherHelper.CheckBeginInvokeOnUI(() =>
                        {
                            Marker = message.NewValue;
                        });
                    });
            }
        }

        public const string MarkerPropertyName = "Marker";
        private Marker _marker;
        public Marker Marker
        {
            get { return _marker; }
            set
            {
                if (_marker == value)
                    return;

                var oldValue = _marker;
                _marker = value;

                // Update bindings, no broadcast
                RaisePropertyChanged(MarkerPropertyName);
            }
        }
    }

To sum up, I’ve demonstrated two really great features of the MVVM Light framework – the EventToCommand behavior and the Messenger features – and how these features can be used to successfully pull off the MVVM pattern with the Windows Phone 7 Bing Maps control.