Wpf Bind View to ViewModel add to wpf window

Question

I have a view that contains a ItemsControl with some textblocks inside to display the name and other information. in my window I am adding the view to the window as follows and in the code behind of the window i am binding the datacontext of the view to the view model in the MainWindow Loaded event as follows ViewOwnerSideBar.DataContext = viewModel The application compiles but when I run it I dont get data? I checked my viewmodel and I do have data in my collection that I am returning. Does anyone have any good examples of how to do this. I am going to have a sidebar view and a main view on the right displaying the details of the owner.

This is my View

<UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="/Resources/ColorsAndBrushes.xaml"/>
            <ResourceDictionary Source="/Resources/DefaultStyles.xaml"/>

        </ResourceDictionary.MergedDictionaries>

    </ResourceDictionary>

</UserControl.Resources>

<DockPanel >
    <ScrollViewer VerticalScrollBarVisibility="Auto" >
        <ItemsControl Width="250"
                      VerticalAlignment="Stretch"
                      BorderThickness="0"
                      ItemsSource="{Binding Path=AllOwners}">
        <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="2">
                        <Border Margin="2 2 0 0"
                                CornerRadius="4"
                                Background="Gray"
                                Opacity=".5" />
                        <Border BorderBrush="{StaticResource redBrush}"
                                BorderThickness="2"
                                CornerRadius="4"
                                Background="White"
                                Margin="0 0 2 2"
                                Padding="3">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition />
                                    <RowDefinition />
                                    <RowDefinition />
                                </Grid.RowDefinitions>

                                <TextBlock Grid.ColumnSpan="2"
                                           FontWeight="Bold"
                                           Text="{Binding FullName}" />

                                <TextBlock Grid.Row="1"
                                               Text="   FirstName: " />
                                <TextBlock Grid.Row="1"
                                               Grid.Column="1"
                                               Text="{Binding FirstName}" />

                                <TextBlock Grid.Row="2"
                                               Text="   Email: " />
                                <TextBlock Grid.Row="2"
                                               Grid.Column="1"
                                               Text="{Binding Email}" />
                            </Grid>
                        </Border>
                        <Button Style="{StaticResource openButton}" />
                    </Grid>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
    </ItemsControl>
    </ScrollViewer>
</DockPanel>

This is my window

<DockPanel>

    <v:HeaderTopBar DockPanel.Dock="Top"></v:HeaderTopBar>
        <!--<uc:SearchBar DockPanel.Dock="Top" />-->

    <StatusBar DockPanel.Dock="Bottom">
        <StatusBarItem DockPanel.Dock="Right">
            <Slider x:Name="zoomSlider"
                    Width="125"
                    Value="1"
                    Minimum=".5"
                    Maximum="2" />
        </StatusBarItem>

        <StatusBarItem DockPanel.Dock="Right">
            <TextBlock>Zoom:</TextBlock>
        </StatusBarItem>

        <StatusBarItem>
            <TextBlock Text="{Binding StatusText}" />
        </StatusBarItem>
    </StatusBar>

    <Expander DockPanel.Dock="Left"
              ExpandDirection="Right"
              IsExpanded="True"
              BorderThickness="0 1 1 1"
              BorderBrush="Gray"
              Margin="0 2 0 0"
              Padding="2">
        <Expander.Header>
            <TextBlock Text="Contacts"
                       FontSize="14"
                       FontWeight="Bold">
              <TextBlock.LayoutTransform>
                <RotateTransform Angle="90" />
              </TextBlock.LayoutTransform>
            </TextBlock>
        </Expander.Header>
        <v:OwnerSideBar/>

    </Expander>

    <TabControl x:Name="tabs"
                Grid.Column="2"
                Margin="5 0">
        <TabControl.LayoutTransform>
            <ScaleTransform ScaleX="{Binding ElementName=zoomSlider, 
                                             Path=Value}"
                            ScaleY="{Binding ElementName=zoomSlider, 
                                             Path=Value}" />
        </TabControl.LayoutTransform>
    </TabControl>

</DockPanel>

Answer 1

Firstly, ensure that the AllOwners collection you are binding to is an ObservableCollection.

Also, check the Output window in Visual Studio when executing, look for First chance exceptions being caught. This will be a clue as to where your binding problem will be.

I like to put a textblock on the View bound to the Items.Count property on the ItemsControl so that you can see if it is binding and not rendering anything or not binding correctly.

Give the ItemsControl a name, then put a textblock in:

<TextBlock Text="{Binding ElementName=itemControl1,Path=Items.Count}/>

Answer 2

This might be something you already looked at, but you might have a binding typo, did you check your output window to see if you get any trace messages?

And I guess I'm blind but I don't see where your usercontrol is in the xaml of the second entry.