JAPF

This is the perfect time to take a look at what happened in the last few months as well as what’s on the roadmap for next year. So let’s start by taking a look at 2012…

Events

• In February I went to the TechDays in Paris. I was speaker in a session about Performance optimization for Windows Phone application

• In November, I gave a presentation about Windows Phone 8 at SFEIR Plays

Blog posts

The last year I blogged mostly about Windows Phone stuff. This is not a surprise as I’m busy (on my personal time…) working for my 2Day todo-list application. I’m finalizing a major release that should be submitted to the marketplace soon with a ton of new features and improvement (several blog posts should highlight some topics from a developer point of view).

Here is the full list of article (oldest first):

• If you like typing XAML you will love ReSharper 6.1 !
• ReSharper and code generation
• Windows Phone performance analysis & optimization during TechDays
• Developping an app for the Windows Phone platform
• Windows Phone vNext & Windows 8 next week
• Windows Phone Tango (7.1.1)
• Introducing the PivotIndicator control for Windows Phone
• WP7 performance tip: translate transforms
• MVVM framework explorer updated !
• Hello World, WinRT !
• A lap around Team Foundation Service online
• Hacking for fun: porting a Silverlight Windows Phone app to WinRT in 9hours
• Introducing 2Day: a fast & fluid todo-list WP7 app
• MVP 2012-2013 !
• Random ArgumentException in a Windows Phone 7 application
• SQL database version management in a Windows Phone 7 application
• Handling events in the items of a ListBox (Windows Developer Show podcast challenge)
• Animating item selection in a WP7 application
• Fun with ILDASM and ILASM: tweaking the code of an existing library
• Welcome Windows Phone 8.0 SDK
• Meet me at SFEIRPlays Paris 28/11 talking WP8
• Wanted: Windows Phone / Windows 8 developers for 2Day !
• Updating the live tiles when the exits: WP8 weirdness

Next year

2013 should very busy too

• In mid-February, I will speak again during the TechDays in Paris. The topic is the same as last year: performance optimization for Windows Phone applications. However, with Windows Phone 8 we’ve plenty of new topics to cover !
• In late-February I will fly to Redmond for the MVP Summit 2013. It will be my sedond time there. As aways, all the content will be under NDA… I will share a room with my friend Jose Fajardo I met at //BUILD/ 2011 !
• In March, I should setup an event with my company and Microsoft in Grenoble talking about Windows 8 and Windows Phone 8

I’m still deeply invested with 2Day so hopefully you should see more tips and tricks about Windows Phone. As a Windows 8 version is also on its way, that should give me many reasons to write new blog posts.

Happy new year dear readers !

After several requests, I finally took the time to update my MVVM Explorer Silverlight App !

Here is the changelog:

• update all download stats (based ONLY on CodePlex stats)
• refresh popularities
• remove StructuredMVVM (not available on CodePlex)
• add WinRT support (however, no toolkit seems to support if official yet)

Today I would like to share a nice control which is part of my mysterious Windows Phone 7 app which will be released later this month. I call this control the PivotIndicator control. It can be used in order to show the user all the items in a PivotControl on a single screen, as shortcuts. A small rectangle (which use the phone’s accent color as background) is animated when the current pivot item changes. The user can press any item to immediately go to the associated pivot item.

You can grab the source code here.

Here is a short video showing the control in action:

Play Video

Now let’s see the details…

• How to use it?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
 
    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
        <TextBlock x:Name="ApplicationTitle" Text="PIVOT INDICATOR" Style="{StaticResource PhoneTextNormalStyle}"/>
        <TextBlock x:Name="PageTitle" Text="demo" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
    </StackPanel>
 
    <!-- here is the PivotIndicator control -->
    <control:PivotIndicator
        Grid.Row="1"
        Pivot="{Binding ElementName=pivot}">
        <control:PivotIndicator.HeaderTemplate>
            <DataTemplate>
                <!-- this the datatemplate used for each item in the PivotIndicator
                        the DataContext is a PivotItemViewModel in our case -->
                <TextBlock 
                    Text="{Binding Title}"
                    HorizontalAlignment="Center"/>
            </DataTemplate>
        </control:PivotIndicator.HeaderTemplate>
    </control:PivotIndicator>
 
    <Grid x:Name="ContentPanel" Grid.Row="2" Margin="12,0,12,0">
        <controls:Pivot x:Name="pivot" ItemsSource="{Binding PivotItems}">
            <controls:Pivot.HeaderTemplate>
                <DataTemplate>
                    <!-- this is the datatemplate used for the header of the pivot item -->
                    <TextBlock Text="{Binding Title}"/>
                </DataTemplate>
            </controls:Pivot.HeaderTemplate>
            <controls:Pivot.ItemTemplate>
                <DataTemplate>
                    <!-- this is the datatemplate of the content of the pivot item -->
                    <TextBlock
                        Text="{Binding Content}"
                        FontSize="40"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center"/>
                </DataTemplate>
            </controls:Pivot.ItemTemplate>
        </controls:Pivot>
    </Grid>
</Grid>

• How it works?

• SplitPanel: this is a panel (it derives from Panel) which arrange its children on a single line, and where each item has the same width. The width is computed as the total available width divided by the number of items
• PivotRectange: this is a small control which contains a rectangle. The rectangle uses the phone’s accent color. Its position is animated based on the currently selected index.
• PivotIndicator: is the control you will use. It is made of an ItemsControl with a SplitPanel as ItemsPanelTemplate and the PivotRectangle

Source code is documented so you might want to dig in it for more details

Update 26th 7:37PM: Nokia keynote live tomorrow morning at 8:30 CET. Live webcast here: http://www.nokia.com/global/about-nokia/webcast-mwc/webcast/

The coming week should be pretty interesting for any folks interested in Microsoft technologies. The Mobile World Congress will take place in Barcelona from Monday to Friday.

Windows Phone

On the mobile space, we can expect first official information about Windows Phone Tango. Tango is expected to be a version of the OS dedicated to low-end devices. From the various leaks that occurred in the last weeks we already have some ideas of what Tango might look likes:

• ability to import and export contacts directly from the SIM card
• ability to send multiple images in a single MMS
• more languages supported (120, whereas Mango supports “only” 35)
• ability to run on devices with only 256MB or RAM

None of those information have been confirmed yet but it’s only a matter of hours now

Windows 8

On wednesday 29th Microsoft will hold a special event in Barcelona for the release of Windows 8 Consumer Preview.

The Consumer Preview will be available for download to anybody and should be feature complete. I’m expecting a lot from this release as the Developer Preview was quite incomplete regarding XAML development (for example Blend was only able to target HTML WinRT projects).

Visual Studio 11

With the release of Windows 8 Consumer Preview, Microsoft confirmed this week that we are also going to have access to Visual Studio 11.

Visual Studio 11 will include most of the extensions currently available in the Productivity Power Tools for Visual Studio 2010. The XAML designer will be shared with Blend (hopefully that we will to better performance & less design-time issues). There are tons of other changes, improvements and new features…

For more details, you can check out those posts: Introducing the new developer experience part 1 & part 2.

Of course I’ll try to play with all those new toys as soon as possible. So you should expect more blog post this week !

In about 2 weeks now, I’ll have the chance to be part of the French TechDays in Paris as a speaker. This year, I’ll own a session called “Windows Phone performance analysis & optimisation” with my colleague Charlotte.

The agenda looks like the following:

• why performance analysis ?
• device vs emulator
• leveraging WP7 threads
• using the VS profiler for WP7
• tips and tricks

During the session we will use a “real” app we’re working on for a few months now (I’ll share more details after the session). We have some cool tips that haven’t been shared anywhere before, so if performance is a topic of interest for you, stat tuned !

Click on the following image for a link to the TechDays website:

I’m planning to share the most of the content of this session on my blog soon after the event.

Don’t hesitate to stop by and say hi…

Resharper is an amazing tool for any .Net developers. The latest version 6.1 has been released just a couple of weeks ago and I wanted to share with you a brief overview of the new workflow available in the XAML world !

Visual Studio 2010 introduced 2 new design time properties: d:DesignInstance and d:DesignData. Those properties can be used in order to specify a design time DataContext in order to have more help during the creation of a binding.

For example, when you create a binding using the Property dialog of VS2010 you can browse your DataContext to select the right property (image from this blog post from Karl Shifflet):

Resharper 6.1 is now able to use those metadata in order to improve the experience you have while typing XAML (which I personally do a LOT!). Here is how it works:

• you create a new ViewModel with a simple property (this property has just get/set because we don’t need much more in the context of this post…)

• you setup a binding in your view

At this point the ReSharper magic comes into play…

• ReSharper warns you the DataContext is unknown

• Offer the ability to fix this

• Note that like in C#, you can very easily resolve namespace issues

• Then notice that the warning is gone (the Title property is no longer underlined)

• You can now add a new binding

• You can then ask ReSharper to create the property in your ViewModel

• Choosing the first option will get you to the ViewModel definition

Now that I’ve upgraded my installation to version 6.1, I think this is a must have !

That’s all for today ! Hope it helps

Next Wednesday (November 9th), I’ll be at the Microsoft Days 11 as a member of the Ask The Expert team. I’ll be playing with the Samsung Slate I got at //BUILD/, discussing WPF, Silverlight, Windows Phone 7 and Windows 8.

Don’t hesitate to stop by and say hi if you’re coming to this event !

This blog post is part of my BUILD series.

I’m having a very busy week here in Anaheim ! I’m meeting many new people and had the chance to enjoy the conference from the inside. I’m also playing with this new Windows 8 slate Microsoft gave us ! I’m not going to do a blog post trying to summarize everything because there is just so much to say.I’m going to try to share my point of view on what I’ve seen here.

Our new platform

The original picture shown during the keynote to introduce the new platform was this one:

There has been a lot of confusion about that because of having XAML with C# in the Metro Style Apps without any reference to the CLR… Doug Steven did a pretty great job (blog post is here) by discussing with key people from the engineering team of Microsoft and creates this new more accurate picture:

Here is a quick summary:

• there is only one CLR
• .Net framework 4.5 is used in both Metro apps and Classic apps
• it’s the same MSIL for Metro apps and Classic apps
• in the Metro platform, we have a subset of the .Net framework (for example no OpenFileDialog…)

New opportunities

Before //BUILD we had already many choices to choose our development environment. we now have even more:

• WPF and managed code for classic desktop apps
• Silverlight in a web environment
• Silverlight out of browser
• WinRT + XAML for Metro apps
• WinRT + HTML for Metro apps

I personally think that Silverlight in a web browser has not a great future. Microsoft just announced for example that the immersive version of IE will not run any plugins (so no Silverlight in the Metro UI) and we ‘ll know Microsoft is pushing HTML5 very strongly.

For classic desktop apps we have 2 options: WPF and Silverlight. Each of them has advantages and the choice we’ll have to do will depend on our constraints (deployment, business needs, connectivity…). I think there is room for the 2 platforms there.

For the Metro UI, you can choose between XAML and HTML. Microsoft told us they will keep a good feature parity between the 2 options. If you choose XAML and managed code you’ll be able to leverage a subset of the .Net framework.

I think another important aspect is that Metro will be available on Windows 8 only. Even though this new version of the OS might have a fast deployment rate (thanks to the slates), in many companies I don’t think it will be that fast.This, plus the fact that some LOB apps will not benefit the Metro UI leaves a lot of work to do in the desktop applications world (where we have both WPF and SL)… For WPF, we now have a new version coming in .Net 4.5. You can check out the new stuff here in the documentation.

In my next blog post I’m going to try to go deeper in the new WinRT/XAML world and see how it looks like for us, WPF and Silverlight developers.

I just updated my MVVM frameworks explorer Silverlight application. You can find the updated application here.

Here is the top 5 of MVVM frameworks supporting WPF, Silverlight and Windows Phone 7:

1. MVVM Light (61k downloads)
2. nRoute (19k downloads)
3. Caliburn Micro (18k downloads)
4. Simple MVVM toolkit (5k downloads)
5. Catel (5k downloads)

In the last few years, we’ve seen the WPF and Silverlight community embracing the MVVM methodology. As one of the early adopters of MVVM (one of my first post about the subject was late 2008), I’ve seen the pattern evolving both in the web community and with developers I’ve met in my daily life.

Today, I’d like to share with you a simple concept I try to stick to when I’m doing WPF, Silverlight or Windows Phone 7 development. It can be summarized as “Enough ViewModel is enough”.

The simple idea behind this slogan is that there ARE stuff which are view-related and SHOULD NOT be embedded in the ViewModel layer. I’ve seen too many developers going the “100% viewmodel way” which means for them absolutely no code-behind without any dispensation.

For example, I came across this code. It’s the ViewModel layer associated to a simple view where the user fills various input and has immediate feedback about the progress (like “75% of the fields are completed”). If by the way you’re interested in implementing this behavior you can check out this article I wrote on CodeProject)

The following code is simplified to the sake of the article:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

public class ViewModel
{
    // data field acts as the model object behind the VM layer
    private Data data;
 
    // missing code...
    // public properties used by the view using databinding
 
    public ViewModel()
    {
        // very simplified for this article...
        this.data = new Data();
        this.data.SelectedValuesChanged += new EventHandler(data_SelectedValuesChanged);
    }
 
    public void UpdateProgress()
    {
        // some code...
    }
 
    void data_SelectedValuesChanged(object sender, EventArgs e)
    {
        this.UpdateProgress();
        this.Initialize();
    }
 
    public void Initialize()
    {
        var item = this.data.GetItem("id1");
        if (item != null)
        {
            item.PropertyChanged += new PropertyChangedEventHandler(item_PropertyChanged);
            item.SelectedValuesChanged += new EventHandler(item_SelectedValuesChanged);
            foreach (var value in item.Values)
                value.PropertyChanged += new PropertyChangedEventHandler(item_PropertyChanged);
        }
 
        item = this.data.GetItem("id2");
        if (item != null)
        {
            item.PropertyChanged += new PropertyChangedEventHandler(item_PropertyChanged);
            item.SelectedValuesChanged += new EventHandler(item_SelectedValuesChanged);
            foreach (var value in item.Values)
                value.PropertyChanged += new PropertyChangedEventHandler(item_PropertyChanged);
        }
    }
 
    void item_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
    {
        this.UpdateProgress();
    }
 
    void item_SelectedValuesChanged(object sender, EventArgs e)
    {
        this.UpdateProgress();
    }
}

The idea is simple, as soon as the user changes a value in the View, we must compute the current progress. Because the ViewModel have several levels, we end-up having to register to every single PropertyChanged event which leads to cumbersome code. By the way, this code can also creates memory leaks since we register a lot of event handlers without removing them, but that’s another discussion…

Here is my way to solve this problem:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

public partial class View : UserControl
{
    private readonly ViewModel viewmodel;
 
    public View()
    {
        InitializeComponent();
 
        this.viewmodel = new ViewModel();
 
        this.AddHandler(
            FocusManager.LostFocusEvent,
            new RoutedEventHandler(this.OnLostFocus),
            true);
    }
 
    private void OnLostFocus(object sender, RoutedEventArgs e)
    {
        this.viewmodel.UpdateProgress();
    }      
}

What is wrong with this way ? The View has code-behind ? That’s not a big deal: the code is more readable, maintainable. It makes also more sense: when a view-related operation occurs (in this case, focus has changed), update the progress.

The simple message I’d like to spread is the fact that there is nothing wrong with the fact to have sometime, a little bit of code-behind in your view if that facilitates your architecture. There is no need to create a complicated infrastructure with behaviors, commands or bindings just to keep the view empty if that does not make sense.

Another great example in a real application is available in the Advanced MVVM book by Josh Smith.