Click here to Skip to main content
15,893,588 members
Articles / Desktop Programming / WPF

WPF/MVVM Quick Start Tutorial

Rate me:
Please Sign up or sign in to vote.
4.92/5 (699 votes)
10 Oct 2012CPOL11 min read 1.8M   61K   651  
A quick example of MVVM in WPF
<Window x:Class="Example6.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:Example6"
        Title="Example 6" Height="464" Width="530" >
    <Window.DataContext>
        <!-- Declaratively create an instance of our Album View Model-->
        <local:AlbumViewModel />
    </Window.DataContext>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Menu Grid.Row="0" Grid.ColumnSpan="3">
            <MenuItem Header="Test">
                <MenuItem Header="Update Artist" Command="{Binding UpdateAlbumArtists}" />
                <MenuItem Header="Add Artist" Command="{Binding AddAlbumArtist}" />
                <MenuItem Header="Update Songs" Command="{Binding UpdateSongTitles}" />
            </MenuItem>
        </Menu>
        <Label Grid.Column="0" Grid.Row="1" Content="Example 6 - collection" />
        <Label Grid.Column="0" Grid.Row="2" Content="Update works!" />
        <Button Grid.Column="1" Grid.Row="1" Content="Add new artist" Command="{Binding AddAlbumArtist}" />
        <ListView Grid.Column="1" Grid.Row="2" Grid.ColumnSpan="2" ItemsSource="{Binding Songs}" >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <Label Content="{Binding ArtistName}" />
                        <Label Content="{Binding SongTitle}" FontSize="10" />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Grid.Column="2" Grid.Row="1" Content="Update Artist Name" Command="{Binding UpdateAlbumArtists}" />
        <Button Grid.Column="3" Grid.Row="1" Content="Update Song Titles" Command="{Binding UpdateSongTitles}" />
    </Grid>
</Window>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
United Kingdom United Kingdom
Jack of all trades.

Comments and Discussions