starten sie kostenlos
Dieser Artikel wurde noch nicht bewertet - Dieses Thema bewerten.

Verwenden der portablen Klassenbibliothek mit Model-View-View Model

.NET Framework 4.5

Sie können .NET Framework Portable Klassenbibliothek verwenden, um das Muster Model-View-View Model zu implementieren (MVVM) und Assemblys auf mehrere Plattformen freizugeben.

MVVM ist ein Anwendungsmuster, das die Benutzeroberfläche von der zugrunde liegenden Geschäftslogik isoliert. Sie können die Modell- und Ansichtsmodellklassen in einem Portable Klassenbibliothek-Projekt in Visual Studio 2012 implementieren und erstellen dann Ansichten, die für unterschiedliche Plattformen angepasst werden. Dieser Ansatz ermöglicht es Ihnen, das Datenmodell und die Geschäftslogik nur einmal schreiben und verwendet diesen Code in .NET Framework, von Silverlight, Windows Phone und von Windows Store-App, wie in der folgenden Abbildung dargestellt.

Übertragbar mit MMM-Diagramm

Dieses Thema bietet keine allgemeinen Informationen über das MVVM-Muster. Es enthält nur Informationen darüber, wie Portable Klassenbibliothek zum Implementieren von MVVM verwendet wird. Weitere Informationen über MVVM finden Sie im MVVM-Schnellstart in der MSDN Library.

Wenn die Zielplattform des Portable Klassenbibliothek-Projekts, .NET Framework 4.5, ..NET für Windows Store-Apps, Silverlight oder Windows Phone 7.5 ist, sind die folgenden Klassen zum Implementieren des MVVM-Musters verfügbar:

Zum Implementieren von MVVM erstellen Sie in der Regel das Modell und das Ansichtsmodell in einem Portable Klassenbibliothek-Projekt, da ein Portable Klassenbibliothek-Projekt nur auf portable Projekte verweisen kann. Das Modell und das Ansichtsmodell können sich im gleichen Projekt oder in verschiedenen Projekten befinden. Wenn Sie verschiedene Projekte verwenden, fügen Sie einen Verweis vom Ansichtsmodellprojekt zum Modellprojekt hinzu.

Nachdem Sie das Modellprojekt und das Ansichtsmodellprojekt kompiliert haben, verweisen Sie in der App, in der sich die Ansicht befindet, auf die entsprechenden Assemblys. Wenn die Ansicht nur mit dem Ansichtsmodell interagiert, müssen Sie nur auf die Assembly verweisen, die das Ansichtsmodell enthält.

Hh563947.collapse_all(de-de,VS.110).gifModell

Im folgenden Beispiel wird eine vereinfachte Modellklasse gezeigt, die sich in einem Portable Klassenbibliothek-Projekt befinden kann.

C#
VB
Kopieren 

using System;

namespace SimpleMVVM.Model
{  
    public class Customer
    {
        public int CustomerID
        {
            get; 
            set;   
        }

        public string FullName
        {
            get;
            set;
        }

        public string Phone
        {
            get; 
            set;
        }
    }
}

Das folgende Beispiel zeigt eine einfache Möglichkeit zum Füllen, Abrufen und Aktualisieren der Daten in einem Portable Klassenbibliothek-Projekt. In einer realen App rufen Sie die Daten aus einer Quelle wie einem Windows Communication Foundation (WCF)-Dienst ab.

C#
VB
Kopieren 

using System;
using System.Collections.Generic;
using System.Linq;

namespace SimpleMVVM.Model
{
    public class CustomerRepository
    {
        private List<Customer> _customers;

        public CustomerRepository()
        {
            _customers = new List<Customer>
            {
                new Customer(){ CustomerID = 1, FullName="Dana Birkby", Phone="394-555-0181"},
                new Customer(){ CustomerID = 2, FullName="Adriana Giorgi", Phone="117-555-0119"},
                new Customer(){ CustomerID = 3, FullName="Wei Yu", Phone="798-555-0118"}
            };
        }

        public List<Customer> GetCustomers()
        {
            return _customers;
        }

        public void UpdateCustomer(Customer SelectedCustomer)
        {
            Customer customerToChange = _customers.Single(c => c.CustomerID == SelectedCustomer.CustomerID);
            customerToChange = SelectedCustomer;
        }
    }
}

Hh563947.collapse_all(de-de,VS.110).gifAnsichtsmodell

Beim Implementieren des MVVM-Musters wird häufig eine Basisklasse für Ansichtsmodelle hinzugefügt. Das folgende Beispiel zeigt eine Basisklasse.

C#
VB
Kopieren 

using System;
using System.ComponentModel;

namespace SimpleMVVM.ViewModel
{
    public abstract class ViewModelBase : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged(string propName)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propName));
            }
        }
    }
}

Mit dem MVVM-Muster wird häufig eine Implementierung der ICommand-Schnittstelle verwendet. Im folgenden Beispiel wird eine Implementierung der ICommand-Schnittstelle veranschaulicht.

C#
VB
Kopieren 

using System;
using System.Windows.Input;

namespace SimpleMVVM.ViewModel
{
    public class RelayCommand : ICommand
    {
        private readonly Action _handler;
        private bool _isEnabled;

        public RelayCommand(Action handler)
        {
            _handler = handler;
        }

        public bool IsEnabled
        {
            get { return _isEnabled; }
            set
            {
                if (value != _isEnabled)
                {
                    _isEnabled = value;
                    if (CanExecuteChanged != null)
                    {
                        CanExecuteChanged(this, EventArgs.Empty);
                    }
                }
            }
        }

        public bool CanExecute(object parameter)
        {
            return IsEnabled;
        }

        public event EventHandler CanExecuteChanged;

        public void Execute(object parameter)
        {
            _handler();
        }
    }
}

Im folgenden Beispiel wird ein vereinfachtes Ansichtsmodell gezeigt.

C#
VB
Kopieren 

using System;
using System.Collections.Generic;
using SimpleMVVM.Model;

namespace SimpleMVVM.ViewModel
{
    public class CustomerViewModel : ViewModelBase
    {
        private List<Customer> _customers;
        private Customer _currentCustomer;
        private CustomerRepository _repository;

        public CustomerViewModel()
        {
            _repository = new CustomerRepository();
            _customers = _repository.GetCustomers();

            WireCommands();
        }

        private void WireCommands()
        {
            UpdateCustomerCommand = new RelayCommand(UpdateCustomer);
        }

        public RelayCommand UpdateCustomerCommand
        {
            get;
            private set;
        }

        public List<Customer> Customers
        {
            get { return _customers; }
            set { _customers = value; }
        }

        public Customer CurrentCustomer
        {
            get
            {
                return _currentCustomer;
            }

            set
            {
                if (_currentCustomer != value)
                {
                    _currentCustomer = value;
                    OnPropertyChanged("CurrentCustomer");
                    UpdateCustomerCommand.IsEnabled = true;
                }
            }
        }

        public void UpdateCustomer()
        {
            _repository.UpdateCustomer(CurrentCustomer);
        }
    }
}

Hh563947.collapse_all(de-de,VS.110).gifAnsicht

Sie können von einer .NET Framework 4.5-App, einer App im Windows Store, einer Silverlight-App oder Windows Phone 7.5-App auf die Assembly verweisen, die das Modellprojekt und das Ansichtsmodellprojekt enthält. Anschließend erstellen Sie eine Ansicht, die mit dem Ansichtsmodell interagiert. Im folgenden Beispiel wird eine vereinfachte WPF (Windows Presentation Foundation)-App gezeigt, die Daten aus dem Ansichtsmodell abfragt und aktualisiert. Sie können in Silverlight-Apps, Windows Phone-Apps oder Apps im Windows Store ähnliche Ansichten erstellen.

XAML
Kopieren 

<Window x:Class="SimpleWPF.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:viewModels="clr-namespace:SimpleMVVM.ViewModel;assembly=SimpleMVVM.ViewModel"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <viewModels:MainPageViewModel x:Key="ViewModel" />
    </Window.Resources>
    <Grid DataContext="{Binding Source={StaticResource ViewModel}}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
        </Grid.RowDefinitions>
        <TextBlock Height="23" Margin="5" HorizontalAlignment="Right" Grid.Column="0" Grid.Row="0" Name="textBlock2" 
                   Text="Select a Customer:" VerticalAlignment="Top" />
        <ComboBox Height="23" HorizontalAlignment="Left" Grid.Column="1" Grid.Row="0" Name="CustomersComboBox" VerticalAlignment="Top" Width="173" 
                  DisplayMemberPath="FullName" SelectedItem="{Binding Path=CurrentCustomer, Mode=TwoWay}" ItemsSource="{Binding Path=Customers}" />
        <TextBlock Height="23" Margin="5" HorizontalAlignment="Right" Grid.Column="0" Grid.Row="1" Name="textBlock4" Text="Customer ID" />
        <TextBlock Height="23" Margin="5" HorizontalAlignment="Right" Grid.Column="0" Grid.Row="2" Name="textBlock5" Text="Name" />
        <TextBlock Height="23" Margin="5" HorizontalAlignment="Right" Grid.Column="0" Grid.Row="3" Name="textBlock9" Text="Phone" />
        <TextBlock Height="23" HorizontalAlignment="Left" Grid.Column="1" Grid.Row="1" Name="CustomerIDTextBlock" 
                   Text="{Binding ElementName=CustomersComboBox, Path=SelectedItem.CustomerID}" />
        <TextBox Height="23" HorizontalAlignment="Left" Grid.Column="1" Grid.Row="2" Width="219" 
                 Text="{Binding Path=CurrentCustomer.FullName, Mode=TwoWay}" />
        <TextBox Height="23" HorizontalAlignment="Left" Grid.Column="1" Grid.Row="3" Width="219" 
                 Text="{Binding Path=CurrentCustomer.Phone, Mode=TwoWay}" />
        <Button
            Command="{Binding UpdateCustomerCommand}"
            Content="Update" Height="23" HorizontalAlignment="Right" Grid.Column="0" Grid.Row="4" 
            Name="UpdateButton" VerticalAlignment="Top" Width="75" />
    </Grid>
</Window>
Fanden Sie dies hilfreich?
(1500 verbleibende Zeichen)

Community-Beiträge

HINZUFÜGEN
Microsoft führt eine Onlineumfrage durch, um Ihre Meinung zur MSDN-Website zu erfahren. Wenn Sie sich zur Teilnahme entscheiden, wird Ihnen die Onlineumfrage angezeigt, sobald Sie die MSDN-Website verlassen.

Möchten Sie an der Umfrage teilnehmen?
Informationen zur Datensicherheit
© 2013 Microsoft. Alle Rechte vorbehalten.