Attaching View.Model on the style properties throws runtime exception

Feb 27, 2011 at 1:49 PM
Edited Feb 27, 2011 at 1:50 PM

I'm trying to do the list-header with WP7 ListBox control.

However, attaching the View.Model property in the style didn't work. This would go into a runtime error. Said "Unknown namespace". But I did include the namespace.

Here's the code:

    <Style x:Key="HeaderListBox" TargetType="ListBox">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="Template">
                <ControlTemplate TargetType="ListBox">
                        <ScrollViewer x:Name="ScrollViewer"
                                      BorderBrush="{TemplateBinding BorderBrush}"
                                      BorderThickness="{TemplateBinding BorderThickness}"
                                      Background="{TemplateBinding Background}"
                                      Foreground="{TemplateBinding Foreground}"
                                      Padding="{TemplateBinding Padding}">
                                <ContentControl x:Name="ListHeader" cal:View.Model="{Binding ListHeader}" />

<ListBox x:Name="Items" ItemsSource="{Binding Items}"
         Style="{StaticResource HeaderListBox}">

I have no idea how to fix this. Any suggestions would be great.

Feb 27, 2011 at 3:23 PM

I'm afraid you have to use the CLR namespace: 




Feb 27, 2011 at 5:27 PM

I did.

After some mess around, somehow the runtime exception didn't show up again. However, there's still troubles with my design view.

See this:

I've also uploaded my test project:

Feb 28, 2011 at 2:33 AM

Sorry, I didn't notice that you were using


inside a ControlTemplate, which is very strange. Removing it, indeed, fixed the designer.
I'm not even sure it is *possible* to make it work View.Model into a template, since it has LOTS of side effects...

Could you please explain what are you trying to achieve, so that I could perhaps suggest an alternative approach?

Feb 28, 2011 at 7:46 AM

Basically, I want to make a screen and a ListBox sharing one ScrollViewer.

WP7 LongListSelector has this functionality (ListHeaderTemplate). However, I couldn't get it work with CM, since it used some unconventional ways to render its items.

Feb 28, 2011 at 11:32 AM

I'm not familiar with LongListSelector, so I wasn't aware of its binding oddities, nor I know if there is a way to overcome them.
You should be able to obtain the layout you explained in the picture doing something along this line:

class MainPageViewModel {
	public HeaderViewModel ListHeader { get; set; }
	public BindableCollection<TextViewModel> Items { get; set; }

<!-- MainPageView.xaml   -->
			<ContentControl x:Name="ListHeader" />
			<ItemsControl x:Name="Items">
						<TextBlock Text="{Binding Text}" />

CM will just pick and bind proper views based on naming conventions. Without convention, view would look like:

<!-- MainPageView.xaml   -->
			<ContentControl cal:View.Model="{Binding ListHeader}" />
			<ItemsControl ItemsSource="{Binding Items}">
						<TextBlock Text="{Binding Text}" />

(which is a valid option, too)

Does it help? 

Feb 28, 2011 at 6:13 PM

Thanks, this really helps.

And I found I can Message.Attach to MouseLeftButtonUp event in the item. While it's not the same as SelectedItemChanged event for ListBox, it still works pretty good on WP7 interface.

I've also found that adding ScrollViewer.VerticalScrollBarVisibility="Disabled" to the ListBox works, too. Not pretty but works for now.

Thanks again!