<controls:Panorama>
    <controls:Panorama.Title>
        <Grid Margin="0,80,0,0">
            <Image Source="{StaticResource ApplicationLogo}"
                    HorizontalAlignment="Left"
                    Width="400" Height="50" />
        </Grid>
    </controls:Panorama.Title>
        ...
</controls:Panorama>

Once again I have played two roles: speaker and mentor. This time I have learned even more than I did during the Windows Phone CodeCamp in Estonia, because this time most of the applications were using latest Mango features and were more technically complex. Many applications have used different types of Push Notifications. Some have used socket programming, video brushes for barcode readings, XNA, SQL CE for data storing and many many more interesting features. I must admit that developers in Riga are very skilled, even younger students have shown amazing skills in programming.

Thank you Microsoft, Agu, Jaana, Valdis, Andres, Latvian .NET User Group and all the participants for such a great event!

As a lecturer I have delivered two Windows Phone related speeches: first one was about Sensors&Location Services(covering topics like Accelerometer, Gyroscope, Compass, Motion, A-GPS) and second about Execution Model&Storing Data.

Of course, coaching and mentoring were two of the most major challenges for this event. There were a lot of different questions, some of them were really tricky. For the first time in my life I have seen an application developed using Visual Basic.NET. That is definitely something you won’t see every day. Each of the teams have shown a strong passion for Windows Phone platform and bringing their unique ideas to life. Winner application (“Tee Info”, “Road Information”) was using Location Services(GPS) to calculate your current speed and displayed an alert in case you were approaching any of speed cameras on the road driving over the allowed speed limit.

I think that Code Camp was a huge success for our developer and Windows Phone community. I hope that each of the applications will reach the marketplace very soon. I would like to thank all the organizers, participants and fellow mentors for this great event!

private readonly GeoCoordinateWatcher _gcw = new GeoCoordinateWatcher();

private readonly Random _random = new Random();

public GpsSamplePage()
{
    InitializeComponent();

    bool isSimulation = true;
    if (!isSimulation)
    {
        _gcw.PositionChanged += (s, e) => GcwPositionChanged(e);
        _gcw.Start();
    }
    else
    {
        Observable.Timer(TimeSpan.FromSeconds(0), TimeSpan.FromSeconds(4))
        .Select(x =>
            new GeoPositionChangedEventArgs<GeoCoordinate>(
                new GeoPosition<GeoCoordinate>(DateTime.Now,
                    new GeoCoordinate()
                        {
                            // -90 <= latitude <= 90
                            Latitude = (_random.NextDouble() * 180.0) - 90.0,
                            // -180 <= longitude <= 180
                            Longitude = (_random.NextDouble() * 360.0) - 180.0
                        }

                ))).ObserveOnDispatcher().Subscribe(GcwPositionChanged);
    }
}

void GcwPositionChanged(GeoPositionChangedEventArgs<GeoCoordinate> e)
{
    Dispatcher.BeginInvoke(() =>
    {
        // thread safe
        tbLatitude.Text = e.Position.Location.Latitude.ToString();
        tbLongitude.Text = e.Position.Location.Longitude.ToString();
    });
}

As usually, without any introductions lets get directly to the development environment and to the previously created code. Before we begin, we need to remove one line of code from our View’s codebehind(constructor):

DataContext = IoCContainter.Get<NinjectSampleViewModel>();

Creating a ViewModelLocator

Now let’s create a very simple ViewModelLocator class and add it to our project. This class contains a method to return an instance of NinjectSampleViewModel from IoC Container with dependencies injected.

public class ViewModelLocator
{
    public NinjectSampleViewModel NinjectSampleVm
    {
        get { return IoCContainter.Get<NinjectSampleViewModel>(); }
    }
}

Adding ViewModelLocator as an Application Resource

Next step is to add this ViewModelLocator to the App.xaml as a Resource. It will give us an option to access it as a StaticResource from the Views. So add the following lines to App.xaml file:

<Application.Resources>
    <EugeneDotnetIoCSamples:ViewModelLocator x:Key="ViewModelLocator" />
</Application.Resources>

Adjusting the View

Finally, let’s open the View and modify that a little bit by adding the line bellow to phone:PhoneApplicationPage element:

DataContext="{Binding NinjectSampleVm, Source={StaticResource ViewModelLocator}}"

This line binds NinjectSampleVm to DataConext property of View using ViewModelLocator resource.

Results

The result should be similar to the result from the previous tutorial, but now the ViewModel is inserted via ViewModelLocator. I think this approach is suitable for a large application development, because it allows you to decouple ViewModel with dependencies injected to a single ViewModelLocator class to use it for testability(i.e Unit Tests). Also this approach significantly decreases the amount of code inside your application.

You can find the source code inside EugeneDotnetWPSamples.IoC Project inside EugeneDotnetWPSamples GitHub project:

Anyone who has a passion for Windows Phone platform, mobile development is welcome to join me and other WP7 enthusiasts at Tallinna Polütehnikum(Tallinn, Estonia) for 2-day Code Camp on 19-20 Nov. You will have a chance to develop your own Windows Phone application with support from mentors, test it on a real device and win prizes including 1-year MSDN Ultimate subscription. You can develop applications on your own or you can join a team, it is totally up to you.

More information could be found here(in Estonian): WP koodilaager (Eneta)

Before making the tutorial, I will mention few facts regarding Ninject in general.

• Ninject is a famous dependency injector .NET
• You can download Ninject from their Website
• You can extend Ninject functions with Extensions
• Ninject is also supported by Silverlight and Windows Phone 7
• Ninject supports Constructor, Properties and Method injection
• Ninject supports 4 injection scopes: Scope, Singleton, Thread, Transient

But let us not waste much time on facts and get directly to our tutorial for Windows Phone.

Setup

Download Ninject for Windows Phone from the following website. Create new default Windows Phone project in Visual Studio and add Ninject for Windows Phone references(DLLs) there.

Creating simple Data Providers

Lets assume our product has both test and production environments. Each of them has it’s own implementation inherited from a single interface: ITextDataProvider.

public interface ITextDataProvider
{
    string GetText();
}

And the implementations are:

public class ProductionDataProvider : ITextDataProvider
{
    public string GetText()
    {
        return "production text";
    }
}

public class TestTextDataProvider : ITextDataProvider
{
    public string GetText()
    {
        return "test text";
    }
}

Creating IoC Container

Container is also pretty simple. It consists of an instance of StandardKernel class, Initialize method and generic Get method, which returns an instance with injected elements based on Type parameter. Initialize method simply binds different implementations depending on current project Build action(Debug, Release) to ITextDataProvider type.

public static class IoCContainter
{
    private static readonly IKernel Kernel = new StandardKernel();

    public static void Initialize()
    {
        #if DEBUG

        Kernel.Bind<ITextDataProvider>().To<TestTextDataProvider>();

        #else

        Kernel.Bind<ITextDataProvider>().To<ProductionDataProvider>();

        #endif
    }

    public static T Get<T>()
    {
        return Kernel.Get<T>();
    }
}

Initializing IoC Container

Now we need to initialize IoC container somewhere and probably the most suitable location for that would be App.xaml.cs events: Application_Launching and Application_Activated that run every time the application starts.

// Code to execute when the application is launching (eg, from Start)
// This code will not execute when the application is reactivated
private void Application_Launching(object sender, LaunchingEventArgs e)
{
    IoCContainter.Initialize();
}

// Code to execute when the application is activated (brought to foreground)
// This code will not execute when the application is first launched
private void Application_Activated(object sender, ActivatedEventArgs e)
{
    IoCContainter.Initialize();
}

Creating ViewModel

Hopefully, you are already introduced to Model-View-ViewModel(MVVM) pattern that is quite popular in Silverlight world. If not, then there is plenty of information in the internet. For the ViewModel you need to add a property of ITextDataProvider type and add an [Inject] attribute to it. This property will be injected inside Kernel. Also you need to enter a very basic Property that returns a text to be displayed in UI.

public class NinjectSampleViewModel
{
    [Inject]
    public ITextDataProvider TextDataProvider { get; set; }

    public string TextToDisplay
    {
        get { return TextDataProvider.GetText(); }
    }
}

Creating View

Final step is to create a View(or Page) to display the results. I have created a default Windows Phone XAML page for that and slightly modified ContentPanel element by adding a TextBlock with Text property Binding inside.

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <TextBlock x:Name="tbText" Text="{Binding TextToDisplay}" />
</Grid>

As for the codebehind I have also modified it a little bit with assigning DataContext property with our ViewModel using IoCContainer class.

public NinjectSampleView()
{
    InitializeComponent();
    DataContext = IoCContainter.Get<NinjectSampleViewModel>();
}

Results

After running the application you will see either “production text” or “test text” displayed depending on your Build Action.

You can find the source code inside EugeneDotnetWPSamples.IoC Project inside EugeneDotnetWPSamples GitHub project:

/// <summary>
/// Method to make a POST call to a HTTPS url
/// </summary>
/// <param name="url">HTTPS url</param>
/// <param name="requestBody">content for a request</param>
private void MakeHTTPSPostCall(string url, string requestBody)
{
    HttpWebRequest webRequest = WebRequest.CreateHttp(url);
    webRequest.Method = "POST";
    webRequest.BeginGetRequestStream(
        requestResult =>
        {

            using (Stream postStream = webRequest.EndGetRequestStream(requestResult))
            {
                if (requestBody != null)
                {
                    byte[] byteArray = Encoding.UTF8.GetBytes(requestBody);
                    postStream.Write(byteArray, 0, requestBody.Length);
                }
            }
            webRequest.BeginGetResponse(
                responseResult =>
                {
                    try
                    {
                        using (var response =
                            (HttpWebResponse) webRequest.EndGetResponse(responseResult))
                        using (var streamResponse = response.GetResponseStream())
                        using (var streamRead = new StreamReader(streamResponse))
                        {
                            var responseString = streamRead.ReadToEnd();
                            var success = response.StatusCode == HttpStatusCode.OK;

                            // do something here with response...
                        }
                    }
                    catch (Exception ex)
                    {

                    }
                },
                null);
        },
        null);
}

Keep in mind that if your call does not have any content(request body) you still can not skip EndGetRequestStream part(shown bellow), because otherwise you will most likely get a HTTP 404 NotFound exception. Actually, any server-side error translates to a HTTP 404 on
the client.

using (Stream postStream = webRequest.EndGetRequestStream(requestResult))
{
...
}

First of all, I will create a default page, add a Rectangle control to ContentPanel (Grid) and apply a new instance of TranslateTransform to rectangle’s RenderTransform property. If you are familiar with Silverlight, then you, probably, know that Rectangle control inherit from UIElement.

Rectangle rect = new Rectangle
    {
        Fill = new SolidColorBrush(Colors.Green),
        RenderTransform = new TranslateTransform()
    };
ContentPanel.Children.Add(rect);

Next step is to create a method to produce a reusable Storyboard. This method will take UIElement as parameter and return a new instance of Storyboard. Notice that within the storyboard I have modified TranslateTransform.Y property of UIElement using PropertyPath.

public Storyboard CreateAndApplyStoryboard(UIElement targetElement)
{
    Storyboard sb = new Storyboard();

    DoubleAnimation animation =
        new DoubleAnimation {From = 0, To = 700};

    Storyboard.SetTarget(animation, targetElement);
    Storyboard.SetTargetProperty(animation,
        new PropertyPath("(UIElement.RenderTransform).(TranslateTransform.Y)"));

    sb.Children.Add(animation);
    return sb;
}

Finally, to try that Storyboard in action, simply, call Begin method for a storyboard instance. Check my code bellow:

Storyboard sb = CreateAndApplyStoryboard(rect);
sb.Begin();

Now you can create a new instance of such storyboard for every instance that derives from UIElement class.

I want to change the gray color of a grid to orange.I was able to change the thickness by changing the margin but do you know how to change the color of the grid? So, for example:

<Grid Background="Black"  Margin="5,5,5,5">
    <StackPanel Width="318" Orientation="Horizontal">
        <StackPanel Width="145" Orientation="Vertical">
            <TextBlock TextWrapping="Wrap" Text="{Binding Text}" FontSize="20"/>
            <Image Source="{Binding Photopath}" Opacity="{Binding Dimness}"/>
        </StackPanel>
    </StackPanel>
</Grid>

If you would like to change the Background color of your grid then, simply, modify Background attribute of the grid (Background=”Black”, as you did that in your code).

If you want to change the color of a Grid’s border color or thickness you have to place your grid inside a Border element. Check my sample bellow:

<Border BorderThickness="5" BorderBrush="Orange">
    <Grid Background="Black"  Margin="5,5,5,5">
        <StackPanel Width="318" Orientation="Horizontal">
            <StackPanel Width="145" Orientation="Vertical">
                <TextBlock TextWrapping="Wrap" Text="{Binding Text}" FontSize="20"/>
                <Image Source="{Binding Photopath}" Opacity="{Binding Dimness}"/>
            </StackPanel>
        </StackPanel>
    </Grid>
</Border>

I hope that answers your question.

My long summer vacation has now come to an end. I have restored my energy levels and I am ready to continue blogging. My next series of posts will be covering Inversion Of Control (IoC) possibilities in Windows Phone environment. For this and also for my future posts I will use Windows Live Writer. I’ve heard a lot of good feedback regarding this tool, so, I think, I will give it a try.

Implementation

Probably it is one of the easiest approaches for sharing values between several different Windows Phone 7 pages. Actually, not only pages, but you can share properties between all parts of your application. For this purpose you can use an object of App class (App.xaml.cs).

I have added a custom property to App.xaml.cs:

public string Parameter { get; set; }

To store a value for this property you can use the following line of code from any part of your application:

var a = App.Current as App;
a.Parameter = "something";

Same code can be used to read a value of that property in another part of your application:

var a = App.Current as App;
myTextBlock.Text = a.Parameter;

Advantages

First of all, the parameter or property is shared not only between two pages, but it is accessible from any part of your application. Secondly, it is easier to store and restore the value during the Tombstoning events if it is a part of App.xaml.cs class, because by default Tombstoning events are handled by the same class.

Disadvantages

Actually, this approach doesn’t have many downsides or maybe I was not able to find them. One problem, which I had using this way of passing values, is that it is sometimes hard to define the right time to remove a value from a property. Always keep in mind the performance and memory usage considerations while developing for a mobile device.

Is trial version or full version?

Few months ago I have written a post Determining license mode in Windows Phone 7 apps and bellow is a property taken from that post. You can simulate if application is running in Emulator in trial mode by modifying “emulatorIsTrial” variable.

private const bool _emulatorIsTrial = false;

public bool IsTrialMode
{
    get
    {
        if (Microsoft.Devices.Environment.DeviceType
               == Microsoft.Devices.DeviceType.Emulator)
        {
            return _emulatorIsTrial;
        }
        return (new LicenseInformation().IsTrial());
    }
}

Is low memory device?

To take advantage of devices that have more than 256 Mb of RAM available I have created a special property in one of my previous posts. This property helps you to determine a total number of available memory on device. Here’s what this property looks like:

private const bool _emulatorIsLowMemory = false;

public bool IsLowMemoryDevice
{
    get
    {
        if (Microsoft.Devices.Environment.DeviceType
            == Microsoft.Devices.DeviceType.Emulator)
        {
            return _emulatorIsLowMemory;
        }
        else
        {
            return (long)DeviceExtendedProperties.GetValue("DeviceTotalMemory")
                <= 268435456;
        }
    }
}

Is light or dark theme?

Finally, here is a property from my last post to detect if user has selected a dark or light theme background in Windows Phone settings.

public bool IsLightTheme
{
    get
    {
        return (Visibility)Resources["PhoneLightThemeVisibility"]
            == Visibility.Visible;
    }
}

Currently, you are able to pick one theme among “light” and “dark”. Notice that “dark” theme is considered as more battery-friendly theme. Now I am going to show two properties I use to detect both themes. Usually I use only one of them per project.

public bool IsLightTheme
{
    get
    {
        return (Visibility)Resources["PhoneLightThemeVisibility"]
            == Visibility.Visible;
    }
}

public bool IsDarkTheme
{
    get
    {
        return (Visibility)Resources["PhoneDarkThemeVisibility"]
            == Visibility.Visible;
    }
}

public object CustomBackground
{
    get
    {
        if (...background should be an image...)
        {
            // bind Image
            return new ImageBrush
                   {
                       ImageSource = new BitmapImage(new Uri(..image url...))
                   };
        }

        if (...background should be a brush...)
        {
            // bind Brush
            return new SolidColorBrush(Colors.Blue);
        }

        // bind color hex (RGB hex or RGB+Alpha hex)
        return "#FFFFFFFF";
    }
}

You can bind this property to Background using standard approaches to Data Binding in Silverlight.

<Grid Background="{Binding CustomBackground}">
...
</Grid>

Basically, we need to detect low memory devices to determine what amount of memory is at our disposal and take advantage of it. For example, we can show high quality images on devices, which have more than 256 MB of memory installed and low quality images (i.e in Panorama control) for other devices.

Detecting and simulating low memory devices

To determine a total amount of available memory you need to use DeviceExtendedProperties class with GetValue method and pass “DeviceTotalMemory” key there. That method will return an amount of memory in bytes. This number should not be greater than 256 Megabytes (268435456 Bytes) for low memory devices. To simulate such device in emulator I will simply use a boolean variable (true – for low memory device, false – for other devices).

private const bool EmulatorIsLowMemory = false;

public bool IsLowMemoryDevice
{
    get
    {
        if (Microsoft.Devices.Environment.DeviceType
            == Microsoft.Devices.DeviceType.Emulator)
        {
            return EmulatorIsLowMemory;
        }
        else
        {
            return (long)DeviceExtendedProperties.GetValue("DeviceTotalMemory")
                <= 268435456;
        }
    }
}

Memory Consumption

According to Windows Phone 7 Application Certification Requirements document we should use “ApplicationPeakMemoryUsage” key for DeviceExtendedProperties to query the peak of memory usage. There is a nice tutorial on MSDN of that process. Here is the code I use for this purpose:

long peak = (long)DeviceExtendedProperties.GetValue("ApplicationPeakMemoryUsage")

Additional information

• Windows Phone 7 Application Certification Requirements v1.4
• DeviceExtendedProperties Class
• Device Status for Windows Phone

Lately in one of my Windows Phone 7 projects I had to replace ListBox with ItemsControl, but ItemsControl does not offer UI virtualization for child items by default, so I had to add the same VirtualizingStackPanel to ItemsPanelTemplate element. Also I have modified the Template element to be able to add and access ScrollViewer for ItemsControl.

<ItemsControl>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.Template>
        <ControlTemplate TargetType="ItemsControl">
                <ScrollViewer>
                    <ItemsPresenter/>
                </ScrollViewer>
        </ControlTemplate>
    </ItemsControl.Template>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <!-- place your controls here-->
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

Additional information

• Attached Properties Overview (MSDN)
• Data Binding in Silverlight (MSDN)

First of all, we need to create a default Windows Phone 7 application project. After that we will create a converter, XAML page with textblock control and add a data binding there. Now let’s discuss each of those steps in details.

Creating a Converter

Within our project we need to create a new converter class. Let’s call it TextBlockInlineConvertor. This class must implement IValueConverter interface from System.Windows.Data, which is a requirement for any Silverlight converter class. This interface includes two methods: Convert and ConvertBack. To make this tutorial as simple as possible I am going to use only Convert method and transform only one type of tags: <br />. We are going to split text using this tag into separate Run elements (inline element of TextBlock) and insert a LineBreak element in between. Here is my implementation of IValueConverter interface:

public class TextBlockInlineConvertor : IValueConverter
{
    public object Convert(object value, Type targetType,
        object parameter, CultureInfo culture)
    {
        var inlines = new List<Inline>();
        if (value != null)
        {
            // parse text
            var textLines =
                value.ToString().Split(
                    new string[] { "<br/>" }
                    , StringSplitOptions.RemoveEmptyEntries);

            // add inlines and linebreaks
            foreach (string line in textLines)
            {
                inlines.Add(new Run() { Text = line});
                if (textLines.ToList().IndexOf(line) < textLines.Length - 1)
                {
                    inlines.Add(new LineBreak());
                }
            }
        }
        return inlines;
    }

    public object ConvertBack(object value, Type targetType,
        object parameter, CultureInfo culture)
    {
        return value;
    }
}

Creating a Page

Next step is to add a XAML page. Of course, you can also use MainPage.xaml created by default. Within XAML page let’s add our converter as Framework element resource just before LayoutRoot grid element.

<FrameworkElement.Resources>
        <ResourceDictionary>
            <bindings:TextBlockInlineConvertor x:Key="inlineConverter" />
        </ResourceDictionary>
</FrameworkElement.Resources>

Pay attention that you need to declare a namespace in phone:PhoneApplicationPage. In my case it is:

xmlns:bindings="clr-namespace:EugeneDotnetWP7Samples.Bindings"

Now we need to add an attached property to codebehind. This attached property will allow us to bind a list to Textblock Inlines property using OnInlineListPropertyChanged event. You can read more about attached properties at MSDN (check link above).

public static string GetInlineList(TextBlock element)
{
    if (element != null)
        return element.GetValue(ArticleContentProperty) as string;
    return string.Empty;
}

public static void SetInlineList(TextBlock element, string value)
{
    if (element != null)
        element.SetValue(ArticleContentProperty, value);
}

public static readonly DependencyProperty ArticleContentProperty =
    DependencyProperty.RegisterAttached(
        "InlineList",
        typeof(List<Inline>),
        typeof(TextBlockBindingSamplePage),
        new PropertyMetadata(null, OnInlineListPropertyChanged));

private static void OnInlineListPropertyChanged(DependencyObject obj,
    DependencyPropertyChangedEventArgs e)
{
    var tb = obj as TextBlock;
    if (tb != null)
    {
        // clear previous inlines
        tb.Inlines.Clear();

        // add new inlines
        var inlines = e.NewValue as List<Inline>;
        if(inlines != null)
        {
            inlines.ForEach(inl => tb.Inlines.Add((inl)));
        }
    }
}

After you build the project you can add attached property to a TextBlock control in XAML. I have added a TextBlock to XAML page inside ContentPanel grid.

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <TextBlock x:Name="tbInlines"
        bindings:TextBlockBindingSamplePage.InlineList="{Binding CustomText
        , Converter={StaticResource inlineConverter}}"
        />
</Grid>

And now it is the right time for our final step. As you have probably noticed TextBlock is using CustomText as a binding property. Now we need to somehow add this property to the DataContext. For this tutorial I will not implement a special ViewModel class according to MVVM pattern principles, but instead I will simply create a property inside XAML page codebehind and assign the page to DataContext in constructor. CustomText property contains a text which can be used to test our application.

public string CustomText
{
    get { return @"Windows Phone<br/>is<br/>really cool!"; }
}

public TextBlockBindingSamplePage()
{
    InitializeComponent();
    DataContext = this;
}

Result

After you run the application you will notice that our text in custom format was successfully transformed to TextBlock Inlines containing Run and LineBreak elements using converter.

Basically during this year I have realized that MVP activities are all about sharing, you share your experience, knowledge, thoughts, ideas using different channels like technical blogs, social media, forums, screencasts, websites and offline presentations. Of course, those activities take a lot of my valuable personal time, but I hope they will save some of yours Anyway I am looking forward to new contribution and development opportunities in 2011/2012.

I haven’t had much time to prepare my speech due to my workload, but, at least, I think the demo part went smoothly. I have prepared a demo for each part of my presentation. This time there were around 50-60 offline and online participants. I would like to thank Eneta community, IT College and Microsoft for supporting this event. As usually, it was a very pleasant experience for me and, hopefully, for others too.

During the presentation I have covered the following topics:

• General information about Touch support and Gestures for Windows Phone 7
• Touch: Mouse Events (+Demo)
• Touch: Manipulation Events (+Demo)
• Touch: Static class Touch (+Demo)
• General information about Windows Phone 7 sensors
• Sensors: Accelerometer (+Demo including simulating coordinates using Reactive Extentions)
• Sensors: GPS / A-GPS (+Demo including simulating coordinates using Reactive Extentions)

You can check the following resources to find out more about my presentation:

• Video Recording
• Slides
• Source Code (for Demo)