Freigeben über


Verwenden mehrerer SharePoint-Listen in einer Windows Phone-App

Erstellen Sie Windows Phone-Apps, die Daten aus mehreren SharePoint-Listen verwenden.

Sie können mehrere SharePoint-Listen in Ihrer app auf verschiedene Weise verwenden. Beim Erstellen einer Windows Phone-app basierend auf der Vorlage Windows Phone SharePoint List Application Angabe eines einzelnen Ziels SharePoint-Liste, aber die Architektur des resultierenden Projekts ist erweiterbar sein müssen, um die Integration von mehreren Listen zu berücksichtigen.

Wichtig

Wenn Sie eine App für Windows Phone 8 entwickeln, müssen Sie Visual Studio Express 2012 anstelle von Visual Studio 2010 Express verwenden. Alle Informationen in diesem Artikel betrifft mit Ausnahme der Entwicklungsumgebung Erstellen von apps für Windows Phone 8 und Windows Phone 7. > Weitere Informationen finden Sie unter Vorgehensweise: Einrichten einer Umgebung zum Entwickeln mobiler Apps für SharePoint.

Erstellen einer Lösung mit SharePoint-Listen basierend auf demselben Schema

Wenn Sie zwei SharePoint-Listen, die basierend auf dem gleichen Schema verfügen, können Sie nutzen Sie die Klassen, die durch die Vorlage Windows Phone SharePoint List Application implementiert und Objekte dieser Klassen speziell für jede Liste erstellen.

Angenommen, Sie verfügen über zwei SharePoint-Listen, die auf der Vorlage Kontaktliste basieren. Eine Liste, z. B. Marketingteam, enthält Mitglieder eines Marketingteams in Ihrer Organisation, und die andere Liste, Engineering Team, enthält Mitglieder eines Entwicklungsteams. Wenn Sie ein Projekt mithilfe der Windows Phone SharePoint-Listenanwendungsvorlage erstellen und die Marketingteamliste als Zielliste angeben, auf der das Projekt basieren soll, wird eine Instanz der ListDataProvider-Klasse (standardmäßig mit dem Namen DataProvider ) in der Implementierung der App-Klasse in der App.xaml.cs-Datei im Projekt erstellt. Dieses Objekt stellt die Liste (d. h. das Marketingteam) als Datenquelle für die App dar und stellt Vorgänge zum Zugreifen auf und Bearbeiten von Elementen in der Liste bereit. Eine Instanz der ListViewModel-Klasse wird auch für die Liste erstellt, auf der die App basiert. Dieses Objekt verfügt über einen Eigenschaftenmember (der auch den Namen DataProvider trägt), der auf eine bestimmte Instanz der ListDataProvider-Klasse festgelegt werden kann, wodurch die Datenquelle für die ListViewModel-Klasseninstanz eingerichtet wird.

Sie können eine zusätzliche Instanz der ListDataProvider-Klasse im Projekt erstellen, die als Datenquelle für die zweite Liste (Engineering-Team) in der App.xaml.cs-Datei dient. Das Objekt wird in den folgenden Code SecondaryDataProvider bezeichnet.

private static ListDataProvider m_SecondaryDataProvider;

public static ListDataProvider SecondaryDataProvider
{
    get
    {
        if (m_SecondaryDataProvider != null)
            return m_SecondaryDataProvider;

        m_SecondaryDataProvider = new ListDataProvider();
        m_SecondaryDataProvider.ListTitle = "Engineering Team";
        m_SecondaryDataProvider.SiteUrl = new Uri("http://contoso:2012/sites/samplesite/");

        return m_SecondaryDataProvider;
    }
}

Sie können dann Instanziieren Sie ein anderes Objekt der ListViewModel -Klasse (mit dem Namen, beispielsweise SecondaryViewModel) und dessen DataProvider -Eigenschaft, wie im folgenden Code SecondaryDataProvider -Objekt zuweisen.

private static ListViewModel m_SecondaryViewModel;

public static ListViewModel SecondaryViewModel
{
    get
    {
        if (m_SecondaryViewModel == null)
            m_SecondaryViewModel = new ListViewModel { DataProvider = App.SecondaryDataProvider };

        return m_SecondaryViewModel;
    }
    set
    {
        m_SecondaryViewModel = value;
    }
}

Wenn die gleichen Felder und Ansichten für die beiden Listen für Ihre Zwecke geeignet sind (und die beiden Listen die gleichen Spalten und Felder aufweisen), müssen Sie keine Änderungen an der Implementierung der ListDataProvider-Klasse (in der ListDataProvider.cs-Datei ) vornehmen.

Zum Anzeigen oder ändern Sie die Daten aus der zweiten Liste in Ihrem Projekt, müssen Sie jedoch hinzufügen, Formulare anzeigen des Projekts, die an gebunden und für diese SecondaryViewModelkonfiguriert sind. Sie können ihrem Projekt z. B. einen Ordner mit dem Namen "SecondaryViews" und eine SecondaryList.xaml-Datei hinzufügen, deren Markup dem der standardmäßigen List.xaml-Datei ähnelt, die von der Vorlage für die primäre Liste im Projekt generiert wird. Beachten Sie, dass Sie Ihr sekundäres Listenformular vom primären Listenformular in der App unterscheiden sollten, indem Sie einen Unterscheidungswert für das x:Class Attribut des PhoneApplicationPage Elements in der Datei SecondaryList.xaml angeben.

<phone:PhoneApplicationPage
    x:Class="MultipleSPListApp.SecondaryViews.ListForm"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="696"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"
    shell:SystemTray.IsVisible="True" x:Name = "ListViewPage">
...
</phone:PhoneApplicationPage>

Ersetzen Sie in der zugeordneten CodeBehind-Datei SecondaryList.xaml.cs alle Verweise auf App.MainViewModel durch Verweise auf App.SecondaryViewModel. Beispielsweise sollte der Konstruktor in der Datei wie folgt aussehen.

public ListForm()
{
    InitializeComponent();
    this.DataContext = App.SecondaryViewModel;
}

Ersetzen Sie außerdem alle Verweise in der CodeBehind-Datei durch App.DataProvider Verweise auf App.SecondaryDataProvider , und aktualisieren Sie alle Navigationspfade so, dass sie auf die entsprechenden sekundären XAML-Seiten verweisen. Wenn Sie ihrem Projekt auch ein sekundäres Neues Formular hinzufügen (z. B. SecondaryNewForm.xaml im Ordner SecondaryViews Ihres Projekts), würde der Handler in der SecondaryList.xaml.cs-Datei für das OnNewButtonClick-Ereignis dem folgenden Code ähneln.

private void OnNewButtonClick(object sender, EventArgs e)
{
    // Instantiate a new instance of NewItemViewModel and go to NewForm.
    App.SecondaryViewModel.CreateItemViewModelInstance = new NewItemViewModel { DataProvider = App.SecondaryDataProvider };
    NavigationService.Navigate(new Uri("/SecondaryViews/SecondaryNewForm.xaml", UriKind.Relative));
}

Schließlich können Sie applicationBar in der Datei List.xaml eine Schaltfläche hinzufügen, um die Seite SecondaryList.xaml anzuzeigen.

<phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
        <shell:ApplicationBarIconButton x:Name="btnNew" IconUri="/Images/appbar.new.rest.png" Text="New" Click="OnNewButtonClick"/>
        <shell:ApplicationBarIconButton x:Name="btnRefresh" IconUri="/Images/appbar.refresh.rest.png" Text="Refresh" IsEnabled="True" Click="OnRefreshButtonClick"/>
        <!--Add the following button to navigate to the secondary list (Engineering Team).-->
        <shell:ApplicationBarIconButton x:Name="btnSecondaryList" IconUri="/Images/appbar.upload.rest.png" Text="Engineering" IsEnabled="True" Click="OnSecondaryListButtonClick"/>
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

Fügen Sie in der zugeordneten Code-Behind-Datei, List.xaml.cs, einen Handler für das OnSecondaryListButtonClick -Ereignis in der Datei List.xaml deklariert.

private void OnSecondaryListButtonClick(object sender, EventArgs e)
{
    NavigationService.Navigate(new Uri("/SecondaryViews/SecondaryList.xaml", UriKind.Relative));
}

Benutzer Ihrer App können dann zwischen der Marketingteam und das Entwicklungsteam Liste navigieren. Da die zugrunde liegenden Listenschemas identisch sind, verarbeiten die von der Vorlage generierten Standardobjekte DataProvider und MainViewModel sowie die hinzugefügten SecondaryDataProvider- und SecondaryViewModel-Objekte alle Datentransaktionen, ohne dass Änderungen an der ListDataProvider.cs-Datei erforderlich sind.

Erstellen einer Lösung im Zusammenhang mit SharePoint-Listen basierend auf anderen schemas

Die Vorgehensweise im vorherigen Abschnitt Works so ein, dass wechselt (, die für SharePoint-Listen auf das gleiche Schema basiert,), aber der ListDataProvider -Klasse in der Windows Phone SharePoint List Application Vorlage für Entwickler zur Anpassung mehreren SharePoint-Listen bearbeitet, die nicht basieren auf dem gleichen Schema oder kann nicht enthalten dieselben Spalten und Felder, verfügbar ist.

Nehmen Sie an, wie im vorherigen Abschnitt, dass eine SharePoint-Liste Marketingteam (basierend auf der Listenvorlage Kontakte), mit der ein Marketingteam-Mitgliedern vorhanden ist. Nehmen Sie an auch, dass Sie eine zweite Liste, mit dem Namen Orders (basierend auf der Vorlage für benutzerdefinierte Listen), mit der Spalten und Feldtypen in Tabelle 1 aufgeführten verfügen.

Tabelle 1. Spalten und Felder für die Liste "Bestellungen"

Spalte Feldtyp Erforderlich
Product (d. h. Titel) Einzelne Textzeile (Text) Ja
Einzelpreis Währung Ja
Anzahl Zahl Keine (Standardwert: 0 (null))
ORDER-Wert Berechnet (Einzelpreis * Menge) Nein
Bestelldatum Datum und Uhrzeit (Datetime) Nein
Auftragsstatus Auswahl Nein
Kunde Einzelne Textzeile (Text) Nein

Wie im Beispiel im vorherigen Abschnitt können Sie ein separates ListDataProvider und eine andere ListViewModel -Objekt zum Verwalten der Orders-Liste instanziieren. Wird davon ausgegangen Sie, dass das instanziierte ListDataProvider -Objekt mit der Bezeichnung OrdersListDataProvider, wie im folgenden Code wird.

private static ListDataProvider m_OrdersListDataProvider;

public static ListDataProvider OrdersListDataProvider
{
    get
    {
        if (m_OrdersListDataProvider != null)
            return m_OrdersListDataProvider;

        m_OrdersListDataProvider = new ListDataProvider();
        m_OrdersListDataProvider.ListTitle = "Orders";
        m_OrdersListDataProvider.SiteUrl = new Uri("http://contoso:2012/sites/samplesite/"); // Specify a URL here for your server.

        return m_OrdersListDataProvider;
    }
}

Und wird davon ausgegangen, dass das instanziierte ListViewModel -Objekt für die Orders-Liste mit der Bezeichnung OrdersListViewModel, wie im folgenden Code wird.

private static ListViewModel m_OrdersListViewModel;

public static ListViewModel OrdersListViewModel
{
    get
    {
        if (m_OrdersListViewModel == null)
            m_OrdersListViewModel = new ListViewModel { DataProvider = App.OrdersListDataProvider };

        return m_OrdersListViewModel;
    }
    set
    {
        m_OrdersListViewModel = value;
    }
}

Das Schema für die Orders-Liste unterscheidet sich von der Liste Marketingteam. Sie können die Unterschiede berücksichtigen, indem Sie code zur ListDataProvider.cs-Datei hinzufügen, insbesondere zur CamlQueryBuilder-Klasse .

public static class CamlQueryBuilder
{
    static Dictionary<string, string> ViewXmls = new Dictionary<string, string>()
    {
      {"View1",   @"<View><Query><OrderBy><FieldRef Name='Title' />
                    <FieldRef Name='FirstName'  /></OrderBy></Query><RowLimit>30</RowLimit><ViewFields>{0}</ViewFields></View>"},
      {"View2",   @"<View><Query><OrderBy><FieldRef Name='ID' /></OrderBy></Query><RowLimit>30</RowLimit>
     <ViewFields>{0}</ViewFields></View>"}
    };

    static string View1Fields = @"<FieldRef Name='Title'/><FieldRef Name='FirstName'/>
   <FieldRef Name='JobTitle'/><FieldRef Name='Email'/><FieldRef Name='Comments'/>";
    static string View2Fields = @"<FieldRef Name='Title'/><FieldRef Name='Unit_x0020_Price'/><FieldRef Name='Quantity'/>
            <FieldRef Name='Order_x0020_Value'/><FieldRef Name='Order_x0020_Date'/>
            <FieldRef Name='Status'/><FieldRef Name='Customer'/>";

    public static CamlQuery GetCamlQuery(string viewName)
    {
        string viewXml = ViewXmls[viewName];
        // Add ViewFields to the ViewXml depending on the view.
        switch (viewName)
        {
            case "View2":
                viewXml = string.Format(viewXml, View2Fields);
                break;
            case "View1":
            default:
                viewXml = string.Format(viewXml, View1Fields);
                break;
        }
        return new CamlQuery { ViewXml = viewXml };
    }
}

Hier wird dem ViewXmlsDictionary-Objekt für die Liste Orders ein zweiter Eintrag mit dem Schlüsselwert "View2" hinzugefügt. (Beachten Sie, dass die Schlüsselwerte für Einträge, die dem ViewXmls-Wörterbuch in der CamlQueryBuilder-Klasse hinzugefügt werden, eindeutig (in der Lösung) sein müssen, damit die Zwischenspeicherlogik in der Vorlage ordnungsgemäß funktioniert.) Zeichenfolgenvariablen ( View1Fields und View2Fields) werden verwendet, um die Liste der Felder für jede Ansicht zu speichern. Abhängig vom Wert des Parameters viewName an die GetCamlQuery -Methode übergeben, wird Sie dann die entsprechende CAML-Abfrage-XML-Zeichenfolge erstellt.

Klicken Sie, wie im vorherigen Abschnitt, Ansicht Formulare für die Liste, diesmal gebunden, auf die Objekte OrdersListViewModel und OrdersListDataProvider erstellen können. Als Beispiel, das XAML für ein Listenformular speziell für die Orders-Liste mit dem Namen OrdersList.xaml, ähnlich wie das Markup in der Datei List.xaml von der Vorlage für die primäre Liste in der app generiert würde, außer dass würde, nennen Sie das PivotItem -Steuerelement, das die Liste "View2" rendert (anstelle der Standardeinstellung "View1") und legen Sie die Deklaration Binding für das ItemsSource -Attribut des ListBox -Steuerelements in der Listenelemente auf "View2" wie in der folgenden gerendert werden Markup (der nur das Markup für das Stammraster der Seite angezeigt wird).

    <Grid x:Name="LayoutRoot" Background="Transparent" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls">
        <!--Pivot Control-->
        <ProgressBar x:Name="progressBar" Opacity="1" HorizontalAlignment="Center" VerticalAlignment="Top"
               Height="30" Width="470" IsIndeterminate="{Binding IsBusy}" Visibility="{Binding ShowIfBusy}" />
        <Grid x:Name="ContentPanel" Grid.Row="0" Width="470">
            <controls:Pivot Name="Views" Title="Orders" LoadedPivotItem="OnPivotItemLoaded">
                <!--Pivot item-->
                <controls:PivotItem Name="View2" Header="All Orders">
                    <!--Double line list with text wrapping-->
                    <ListBox x:Name="lstBox1" Margin="0,0,-12,0" SelectionChanged="OnSelectionChanged" ItemsSource="{Binding [View2]}">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Vertical" Margin="10">
                                    <TextBlock Name="txtTitle" Text="{Binding [Title]}" TextWrapping="NoWrap"
                                          Style="{StaticResource PhoneTextTitle2Style}" />
                                    <TextBlock Name="txtUnitPrice" Text="{Binding [Unit_x0020_Price]}"
                                         TextWrapping="NoWrap" Style="{StaticResource PhoneTextNormalStyle}" />
                                    <TextBlock Name="txtQuantity" Text="{Binding [Quantity]}"
                                         TextWrapping="NoWrap" Style="{StaticResource PhoneTextNormalStyle}" />
                                </StackPanel>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>
                </controls:PivotItem>
            </controls:Pivot>
        </Grid>
    </Grid>

Eine bequeme Möglichkeit zum Erstellen eines geeigneten XAML-Markups besteht darin, die Windows Phone SharePoint-Listenanwendungsvorlage zu verwenden, um ein separates Projekt basierend auf der Liste Orders zu generieren und dann den generierten XAML-Code aus diesem Projekt mit mehreren Listen in das Projekt zu kopieren. Dabei muss der Name des PivotItem-Steuerelements (standardmäßig "View1") in "View2" geändert werden, und die Bindungsdeklaration des ListBox-Steuerelements wie hier gezeigt geändert werden. Sie müssen auch alle Verweise in der zugeordneten CodeBehind-Datei für das Formular ändern, um die entsprechenden ListViewModel - und DataProvider-Objekte anzugeben (z. B. OrdersListViewModel und OrdersListDataProvider).

Diese Vorgehensweise funktioniert, weil in der zugeordneten Code-Behind-Datei (mit dem Namen, in diesem Fall OrdersList.xaml.cs), die verschiedene Ereignishandler, die Methoden des ListDataProvider -Objekts (in diesem Fall OrdersListDataProvider) Liste Daten mit den Namen der PivotItem Zugriff auf Aufrufen als anzugeben, verwenden Sie die gewünschte Ansicht steuern. Beispielsweise der OnPivotItemLoaded -Ereignishandler ruft die LoadData -Methode des OrdersListViewModel -Objekts, das von der ListViewModel -Klasse instanziiert (und diese Methode ruft wiederum die LoadData -Methode des OrdersListDataProvider -Objekts), übergeben Sie den Namen des Steuerelements PivotItem (hier "View2") als Wert des Parameters ViewName an die-Methode. Diese denselben Wert wird letztendlich (als Wert des Parameters viewName ) an die in der geänderten Implementierung der CamlQueryBuilder -Klasse oben gezeigten GetCamlQuery -Methode übergeben.

Ein anderer Ansatz für eine Lösung unter Verwendung von SharePoint-Listen basierend auf anderen schemas

Als Alternative zum Ansatz im vorherigen Abschnitt können Sie die Vorlage Windows Phone SharePoint List Application verwenden, erstellen Sie eine Windows Phone-app-Projekt in einer Projektmappe Microsoft Visual Studio 2010 basierend auf einer bestimmten SharePoint-Liste, und fügen Sie die Projekte basierend auf anderen Listen, um die gleiche Lösung erstellt. Dieser Ansatz ermöglicht Ihnen die Vorlage zum Generieren von Formularen, die speziell für jede Liste SharePoint nutzen. Anschließend können Sie die Lösung anpassen, je nach Bedarf steuern, wie Benutzer mit den Listen interagieren. Führen Sie die Verfahren in diesem Abschnitt vor, die diesen Ansatz.

Wird für die folgenden Verfahren vorausgesetzt, steht Ihnen eine SharePoint-Liste mit dem Namen Orders (basierend auf der Vorlage für benutzerdefinierte Listen), und die Spalten und Feldtypen wie in Tabelle 1 im vorherigen Abschnitt dargestellt. Darüber hinaus wird vorausgesetzt, Sie haben eine andere SharePoint-Liste (erneut, basierend auf der Vorlage für benutzerdefinierte Listen), mit dem Namen Kunden, und die Spalten und Feldtypen in Tabelle 2 gezeigt.

Tabelle 2. Spalten und Felder für die Kundenliste

Spalte Feldtyp Erforderlich
Kundenname (d. h., Titel) Einzelne Textzeile (Text) Ja
Rufnummer Einzelne Textzeile (Text) Nein
E-Mail-Adresse Einzelne Textzeile (Text) Nein
Firma Einzelne Textzeile (Text) Nein

In den folgenden Verfahren erstellen Sie eine Windows Phone-app, die beide dieser Listen verwendet. Die primäre Liste in der app ist die Kunden-Liste. Wenn Sie die Details für einen bestimmten Kunden in dem Formular anzeigen anzeigen, ist eine Schaltfläche auf dem Formular enthalten, die Benutzer alle Aufträge (aus der Orders-Liste) zugeordnet dieses Kunden anzeigen können.

Erstellen des Komponentenprojekts für die Lösung

  1. Erstellen Sie eine App für Windows Phone mithilfe der Windows Phone SharePoint-Listenanwendungsvorlage, indem Sie eine SharePoint-Liste angeben, die basierend auf den Spalten- und Feldertypen aus Tabelle 2 definiert wird. In den Verfahren in diesem Abschnitt wird davon ausgegangen, dass der Name der Liste in das Projekt ist "Kunden" und der Name des Projekts ist "CustomersSPListApp". (Informationen zum Erstellen einer App basierend auf der Vorlage Windows Phone SharePoint-Listenanwendung finden Sie unter Vorgehensweise: Erstellen einer Windows Phone SharePoint-Listen-App .)

  2. Wählen Sie im Visual Studio, DateiHinzufügen, Neues Projekt.

    Das Dialogfeld Neues Projekt hinzufügen wird angezeigt.

  3. Wählen Sie im Dialogfeld Neues Projekt hinzufügen unter dem Knoten Visual c# den Silverlight für Windows Phone-Knoten.

  4. Wählen Sie im Bereich Vorlagen die Vorlage Windows Phone SharePoint List Application.

  5. Benennen der app, beispielsweise OrdersSPListApp, und klicken Sie dann auf OK.

  6. Führen Sie das unter Vorgehensweise: Erstellen einer Windows Phone SharePoint-Listen-App beschriebene Verfahren aus, um ein weiteres Windows Phone-App-Projekt zu erstellen. Geben Sie dabei eine SharePoint-Liste an, die basierend auf den Spalten und Feldtypen definiert ist, die in Tabelle 1 als Zielliste für das Projekt angezeigt werden. Sie haben zwei Projekte jetzt in Ihrer Lösung, mit der Bezeichnung "CustomersSPListApp" und "OrdersSPListApp" (Wenn Sie die Namenskonventionen in diesem Verfahren folgen).

  7. Wählen Sie im Projektmappen-Explorer den Projektknoten CustomerSPListApp ein.

  8. Wählen Sie im Menü ProjektVerweis hinzufügen aus.

    Das Dialogfeld Verweis hinzufügen wird angezeigt.

  9. Klicken Sie auf der Registerkarte Projekte wählen Sie das Projekt OrdersSPListApp in der Lösung, und wählen Sie dann auf die Schaltfläche OK. Das Projekt wird unter dem Knoten Verweise des Projekts CustomersSPListApp hinzugefügt.

Konfigurieren Sie anschließend die beiden Projekte in der Lösung an. Sie konfigurieren im Wesentlichen das OrdersSPListApp-Projekt (basierend auf der Orders-Liste) als "Suche" Projekt für das CustomerSPListApp-Projekt (basierend auf der Liste für Kunden) ausgeführt werden.

So konfigurieren Sie das Projekt OrdersSPListApp

  1. Ändern Sie die Navigationspfade in den Formularen anzeigen des Projekts OrdersSPListApp, um den primären Namespace des Projekts ("OrdersSPListApp") und die Bezeichnung "Komponente" enthalten. Ändern Sie beispielsweise im Handler für das OnNewButtonClick-Ereignis in der List.xaml.cs-Datei des OrdersSPListApp-Projekts den Aufruf der Navigate-Methode des NavigationService-Objekts wie folgt:

    NavigationService.Navigate(new Uri("/Views/NewForm.xaml", UriKind.Relative));
    

    in:

    NavigationService.Navigate(new Uri("/OrdersSPListApp;component/Views/NewForm.xaml", UriKind.Relative));
    

    Die einfachste Möglichkeit, diese Änderungen vornehmen ist den Befehl Quick Replace im Projekt OrdersSPListApp verwendet.

  2. Wählen Sie im Projektmappen-Explorer den Projektknoten OrdersSPListApp ein.

  3. Drücken Sie STRG + H, um das Dialogfeld Quick Replace anzuzeigen.

  4. Geben Sie in das Feld Suchen nach Text an, der folgende Text genau wie er hier angezeigt wird:

    Uri("/Views/
    
  5. Geben Sie den folgenden Text in das Textfeld Ersetzen durch genau wie hier angezeigt:

    Uri("/OrdersSPListApp;component/Views/
    
  6. Stellen Sie sicher, dass das Aktuelle Projekt in der Dropdownliste Suchen in ausgewählt ist.

  7. Wählen Sie Alle ersetzen.

  8. Speichern Sie alle geänderte Dateien im Projekt.

  9. Fügen Sie der App.xaml.cs-Datei des OrdersSPListApp-Projekts eine Membereigenschaft hinzu. Wählen Sie im Projektmappen-Explorer unter dem Projektknoten OrdersSPListApp die Datei App.xaml aus.

  10. Drücken Sie F7, um die zugehörige CodeBehind-Datei App.xaml.cs zur Bearbeitung zu öffnen.

  11. Fügen Sie innerhalb der Codeblock (abgegrenzt durch öffnende und schließende geschweifte Klammern), der die partiellen Klasse App implementiert wird, den folgenden Code ein.

    public static string CustomerName { get; set; }
    
  12. Wählen Sie im Projektmappen-Explorer unter dem Projektknoten OrdersSPListApp die Datei List.xaml aus.

  13. Drücken Sie F7, um die zugehörige CodeBehind-Datei List.xaml.cs zur Bearbeitung zu öffnen.

  14. Ändern des OnNavigatedTo -ereignishandlers in der Datei analysiert die QueryString -Eigenschaft des NavigationContext -Objekts, um den Wert der in Schritt 4 deklarierten Variablen CustomerName festzulegen. Sie können auch die Header -Eigenschaft des Steuerelements PivotItem des Listenformulars entsprechend den Namen des Kunden für die Nutzung durch die Benutzer festlegen. Der geänderte Handler sollte wie folgt aussehen.

    protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);
    
        if (this.NavigationContext.QueryString.ContainsKey("CustomerName"))
        {
            App.CustomerName = NavigationContext.QueryString["CustomerName"];
        }
    
        // Also set the value of the Header property for the PivotItem to match the customer name.
        if (!string.IsNullOrWhiteSpace(App.CustomerName))
        {
            this.View1.Header = App.CustomerName;
        }
    
        App.MainViewModel.ViewDataLoaded += new EventHandler<ViewDataLoadedEventArgs>(OnViewDataLoaded);
        App.MainViewModel.InitializationCompleted += new EventHandler<InitializationCompletedEventArgs>(OnViewModelInitialization);
    }
    
  15. Fügen Sie die Variable CustomerName als Argument im Aufruf der LoadData-Methode im OnPivotItemLoaded-Ereignishandler in der List.xaml.cs-Datei hinzu. Die Implementierung der OnPivotItemLoaded -Ereignishandler sollte wie folgt aussehen.

    private void OnPivotItemLoaded(object sender, PivotItemEventArgs e)
    {
        if (!App.MainViewModel.IsInitialized)
        {
            //Initialize ViewModel and Load Data for PivotItem upon initialization.
            App.MainViewModel.Initialize();
        }
        else
        {
            //Load Data for the currently loaded PivotItem.
            App.MainViewModel.LoadData(e.Item.Name, App.CustomerName);
        }
    }
    

    Die LoadData-Methode der ListViewModel-Klasse in der Vorlage ist beispielsweise so definiert, dass optionale Parameter akzeptiert werden können.

  16. Fügen Sie auch die CustomerName -Variable als Argument im Aufruf der LoadData -Methode in der OnViewModelInitialization -Ereignishandler hinzu. Die Implementierung der OnViewModelInitialization -Ereignishandler sollte wie folgt aussehen.

    private void OnViewModelInitialization(object sender, InitializationCompletedEventArgs e)
    {
        this.Dispatcher.BeginInvoke(() =>
        {
            //If initialization has failed, show error message and return.
            if (e.Error != null)
            {
                MessageBox.Show(e.Error.Message, e.Error.GetType().Name, MessageBoxButton.OK);
                return;
            }
            App.MainViewModel.LoadData(((PivotItem)Views.SelectedItem).Name, App.CustomerName);
            this.DataContext = (sender as ListViewModel);
        });
    }
    
  17. Fügen Sie die Variable CustomerName als Argument im Aufruf der RefreshData-Methode im OnRefreshButtonClick-Ereignishandler in der List.xaml.cs-Datei hinzu. Die Implementierung der OnRefreshButtonClick -Ereignishandler sollte wie folgt aussehen.

    private void OnRefreshButtonClick(object sender, EventArgs e)
    {
        if (Views.SelectedItem == null)
            return;
    
        if (!App.MainViewModel.IsInitialized)
        {
            //Initialize ViewModel and Load Data for PivotItem upon completion.
            App.MainViewModel.Initialize();
        }
        else
        {   //Refresh Data for the currently loaded PivotItem.
            App.MainViewModel.RefreshData(((PivotItem)Views.SelectedItem).Name, App.CustomerName);
        }
    }
    

    Wie bei der LoadData -Methode wird die RefreshData -Methode auch definiert, um optionale Parameter angenommen werden. Beachten Sie, dass die vorherigen drei Schritte, die einzige Änderung an den Ereignishandler generiert mit der Vorlage ist das Hinzufügen der Variablen CustomerName als Argument für den Anruf an die Methoden LoadData oder RefreshData.

  18. Wenn Benutzer auf das Listenformular für die Orders-Liste auf die Schaltfläche neu in Ihrer app auswählen können, sollte das Feld Kunde in das neue Formular bereits den Namen des Kunden, enthalten, da die Liste der Aufträge angezeigt, die dem Benutzer basierend auf den Namen des Kunden gefiltert wurde. Neue Aufträge aus der gefilterten Liste hinzugefügt sollte der Name des Kunden zugeordnet sein, auf denen die Liste gefiltert wird. Um den Wert der Variablen CustomerName an das neue Formular zu übergeben, ändern Sie das OnNewButtonClick -Ereignis, um den Wert als Zeichenfolge in der Pfad zum neuen Formular enthalten wie im folgenden Code dargestellt.

    private void OnNewButtonClick(object sender, EventArgs e)
    {
        //Instantiate a new instance of NewItemViewModel and go to NewForm.
        App.MainViewModel.CreateItemViewModelInstance = new NewItemViewModel { DataProvider = App.DataProvider };
    
        if (!string.IsNullOrWhiteSpace(App.CustomerName))
        {
            NavigationService.Navigate(new Uri("/OrdersSPListApp;component/Views/NewForm.xaml?CustomerName=" +
                                                                                App.CustomerName, UriKind.Relative));
        }
        else
        {
            NavigationService.Navigate(new Uri("/OrdersSPListApp;component/Views/NewForm.xaml", UriKind.Relative));
        }
    }
    
  19. Überprüfen Sie die Abfragezeichenfolge für einen Kundennamen im OnNavigatedTo -Ereignishandler für das neue Formular und falls es zur Verfügung steht, weisen Sie das Feld Kunde, der das Ansichtsmodell für das Formular. Wählen Sie im Projektmappen-Explorer unter dem Projekt OrdersSPListApp die Datei NewForm.xaml aus, und drücken Sie F7, um die zugehörige CodeBehind-Datei NewForm.xaml.cs zur Bearbeitung zu öffnen.

  20. Ändern des OnNavigatedTo -ereignishandlers in der Datei mit den folgenden Code übereinstimmt.

    protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);
    
        if (this.NavigationContext.QueryString.ContainsKey("CustomerName"))
        {
            this.viewModel["Customer"] = NavigationContext.QueryString["CustomerName"];
        }
    
        viewModel.ItemCreated += new EventHandler<ItemCreatedEventArgs>(OnItemCreated);
    }
    
  21. Fügen Sie in der CamlQueryBuilder-Klasse in der ListDataProvider.cs-Datei im Projekt OrdersSPListApp eine WHERE-Klausel zum Feld Customer in der CAML-Abfrage hinzu, die zum Abrufen von Elementen aus der Liste Bestellungen verwendet wird, um die Liste nach einem bestimmten Kundennamen (aus der Variablen CustomerName ) zu filtern. Fügen Sie einen Parameter an die GetCamlQuery -Methode in der Klasse für die Übergabe von des Kundennamens ein. Die geänderte CamlQueryBuilder Klasse sollte wie folgt aussehen.

    public static class CamlQueryBuilder
    {
        static Dictionary<string, string> ViewXmls = new Dictionary<string, string>()
        {
            {"View1", @"<View><Query>{0}</Query><RowLimit>30</RowLimit><ViewFields>{1}</ViewFields></View>"}
        };
    
        static string ViewFields = @"<FieldRef Name='Title'/><FieldRef Name='Unit_x0020_Price'/><FieldRef Name='Quantity'/><FieldRef Name='Order_x0020_Value'/><FieldRef Name='Order_x0020_Date'/><FieldRef Name='Status'/><FieldRef Name='Customer'/>";
    
        public static CamlQuery GetCamlQuery(string viewName, string customerName)
        {
            string queryClause = string.Empty;
    
            // Create appropriate Query Clause, depending on customerName parameter.
            if (string.IsNullOrWhiteSpace(customerName))
            {
                queryClause = "<OrderBy><FieldRef Name='ID' /></OrderBy>";
            }
            else
            {
                queryClause = string.Format("<Where><Eq><FieldRef Name='Customer' /><Value Type='Text'>{0}</Value></Eq></Where>", customerName);
            }
    
            // Add Query Clause and ViewFields to ViewXml.
            string viewXml = ViewXmls[viewName];
            viewXml = string.Format(viewXml, queryClause, ViewFields);
    
            return new CamlQuery { ViewXml = viewXml };
        }
    }
    
  22. Ändern Sie die LoadDataFromServer-Methode in der ListDataProvider.cs Datei, um nach dem Argument CustomerName zu suchen und das Argument an die GetCamlQuery-Methode zu übergeben. Die geänderte-Methode sollte wie folgt aussehen.

    private void LoadDataFromServer(string ViewName, Action<LoadViewCompletedEventArgs>
                                                  loadItemCompletedCallback, params object[] filterParameters)
    {
        string customerName = string.Empty;
        string cacheKey = ViewName;
    
        // Parse the optional parameters:
        if (filterParameters.Length > 0)
        {
            customerName = filterParameters[0].ToString();
            cacheKey += "-" + customerName;
        }
    
        CamlQuery query = CamlQueryBuilder.GetCamlQuery(ViewName, customerName);
        ListItemCollection items = Context.Web.Lists.GetByTitle(ListTitle).GetItems(query);
        Context.Load(items);
        Context.Load(items, listItems => listItems.Include(item => item.FieldValuesAsText));
    
        Context.ExecuteQueryAsync(
            delegate(object sender, ClientRequestSucceededEventArgs args)
            {
                base.CacheView(cacheKey, items);
                loadItemCompletedCallback(new LoadViewCompletedEventArgs { ViewName = ViewName, Items = base.GetCachedView(cacheKey) });
            },
            delegate(object sender, ClientRequestFailedEventArgs args)
            {
                loadItemCompletedCallback(new LoadViewCompletedEventArgs { Error = args.Exception });
            });
    }
    
  23. Ändern Sie ebenso die LoadData-Methode in der ListDataProvider.cs-Datei , um den CustomerName-Parameter zu verarbeiten.

    public override void LoadData(string ViewName, Action<LoadViewCompletedEventArgs>
                                                               loadViewCompletedCallback, params object[] filterParameters)
    {
        string customerName = string.Empty;
        string cacheKey = ViewName;
    
        // Parse the optional parameters:
        if (filterParameters.Length > 0)
        {
            customerName = filterParameters[0].ToString();
            cacheKey += "-" + customerName;
        }
    
        List<ListItem> CachedItems = GetCachedView(cacheKey);
        if (CachedItems != null)
        {
            loadViewCompletedCallback(new LoadViewCompletedEventArgs { ViewName = ViewName, Items = CachedItems });
            return;
        }
    
        LoadDataFromServer(ViewName, loadViewCompletedCallback, filterParameters);
    }
    
  24. Hinzufügen einer Schaltfläche Abbrechen auf das ApplicationBar -Element in der Datei List.xaml im Projekt OrdersSPListApp. Klicken Sie im Projektmappen-Explorer unter dem Knoten OrdersSPListApp wählen Sie die Datei List.xaml, und drücken SieUMSCHALT + F7um die Datei zur Bearbeitung im Designer zu öffnen.

  25. Fügen Sie XAML, um die Schaltfläche Abbrechen innerhalb des Tags <phone:PhoneApplicationPage.ApplicationBar> deklarieren, wie im folgenden Markup gezeigt.

    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton x:Name="btnNew"
                     IconUri="/Images/appbar.new.rest.png" Text="New" Click="OnNewButtonClick"/>
            <shell:ApplicationBarIconButton x:Name="btnRefresh" IconUri="/Images/appbar.refresh.rest.png"
                     Text="Refresh" IsEnabled="True" Click="OnRefreshButtonClick"/>
            <shell:ApplicationBarIconButton x:Name="btnCancel" IconUri="/Images/appbar.cancel.rest.png" Text="Cancel" IsEnabled="True" Click="OnCancelButtonClick" />
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>
    
  26. Die List.xaml-Datei im Projektmappen-Explorer ausgewählt und drücken SieF7um die zugeordneten Code-Behind-Datei List.xaml.cs, zur Bearbeitung zu öffnen.

  27. Innerhalb der Codeblock (abgegrenzt durch öffnende und schließende geschweifte Klammern), der die partiellen Klasse ListForm implementiert wird, fügen Sie den folgenden Ereignishandler für das OnCancelButtonClick -Ereignis hinzu.

    private void OnCancelButtonClick(object sender, EventArgs e)
    {
        NavigationService.Navigate(new Uri("/CustomersSPListApp;component/Views/DisplayForm.xaml", UriKind.Relative));
    }
    
  28. Speichern Sie die Dateien im Projekt.

Nun, bleibt sie zum Hinzufügen einer Schaltfläche zum Anzeigeformular in CustomersSPListApp Projekts, um die Aufträge mit einem bestimmten Kunden anzuzeigen.

So konfigurieren Sie das Projekt CustomersSPListApp

  1. Wählen Sie im Projektmappen-Explorer unter dem Knoten für das Projekt CustomersSPListApp die DisplayForm.xaml-Datei aus.

  2. Taste(n)UMSCHALT + F7(oder doppelklicken Sie auf die Datei) auf die Datei zur Bearbeitung im Designer zu öffnen.

  3. Fügen Sie XAML-Deklarationen für ein Steuerelement Button innerhalb einer StackPanel Containersteuerelements nach der letzten StackPanel Steuerelement-Container für das letzte Feld des Listenelements, wie im folgenden Markup hinzu.

    <Grid x:Name="LayoutRoot" Background="Transparent" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls">
        <StackPanel>
            <ProgressBar Background="Red" x:Name="progressBar" Opacity="1" HorizontalAlignment="Center"
              VerticalAlignment="Top" Height="15" Width="470" IsIndeterminate="{Binding IsBusy}"
                Visibility="{Binding ShowIfBusy}" />
            <ScrollViewer HorizontalScrollBarVisibility="Auto" Height="700">
                <Grid x:Name="ContentPanel" Width="470">
                    <StackPanel Margin="0,5,0,5">
                        <StackPanel HorizontalAlignment="Left" Orientation="Horizontal" Margin="0,5,0,5">
                            <TextBlock TextWrapping="Wrap" Width="150" HorizontalAlignment="Left"
                                            Style="{StaticResource PhoneTextNormalStyle}">Title :</TextBlock>
                            <TextBlock Width="310" HorizontalAlignment="Left" Name="txtTitle"
                                    Text="{Binding [Title]}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSubtleStyle}" />
                                    </StackPanel>
                        <StackPanel HorizontalAlignment="Left" Orientation="Horizontal" Margin="0,5,0,5">
                            <TextBlock TextWrapping="Wrap" Width="150" HorizontalAlignment="Left"
                                        Style="{StaticResource PhoneTextNormalStyle}">Contact Number :</TextBlock>
                            <TextBlock Width="310" HorizontalAlignment="Left" Name="txtContact_x0020_Number"
                                        Text="{Binding [Contact_x0020_Number]}" TextWrapping="Wrap"
                                        Style="{StaticResource PhoneTextSubtleStyle}" />
                        </StackPanel>
                        <StackPanel HorizontalAlignment="Left" Orientation="Horizontal" Margin="0,5,0,5">
                            <TextBlock TextWrapping="Wrap" Width="150" HorizontalAlignment="Left"
                                      Style="{StaticResource PhoneTextNormalStyle}">E-mail Address :</TextBlock>
                            <TextBlock Width="310" HorizontalAlignment="Left" Name="txtE_x002d_mail_x0020_Address"
                                  Text="{Binding [E_x002d_mail_x0020_Address]}" TextWrapping="Wrap"
                                              Style="{StaticResource PhoneTextSubtleStyle}" />
                        </StackPanel>
                        <StackPanel HorizontalAlignment="Left" Orientation="Horizontal" Margin="0,5,0,5">
                            <TextBlock TextWrapping="Wrap" Width="150" HorizontalAlignment="Left"
                                      Style="{StaticResource PhoneTextNormalStyle}">Company :</TextBlock>
                            <TextBlock Width="310" HorizontalAlignment="Left" Name="txtCompany"
                                      Text="{Binding [Company]}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSubtleStyle}" />
                        </StackPanel>
                        <StackPanel Margin="0,60,0,5"><Button Content="Get Orders" Height="70" Name="OrdersButton" Width="400" Click="OnButtonOrdersClick" /></StackPanel>
                    </StackPanel>
                </Grid>
            </ScrollViewer>
        </StackPanel>
    </Grid>
    
  4. Die DisplayForm.xaml-Datei im Projektmappen-Explorer ausgewählt und drücken SieF7um die zugeordneten Code-Behind-Datei DisplayForm.xaml.cs, zur Bearbeitung zu öffnen.

  5. Innerhalb der Codeblock (abgegrenzt durch öffnende und schließende geschweifte Klammern), der die partiellen Klasse DisplayForm implementiert wird, fügen Sie den folgenden Ereignishandler für das OnButtonOrdersClick -Ereignis hinzu.

    private void OnOrdersButtonClick(object sender, RoutedEventArgs e)
    {
        this.NavigationService.Navigate(new Uri("/OrdersSPListApp;component/Views/List.xaml?CustomerName=" +
                                                                     viewModel["Title"], UriKind.Relative));
    }
    
  6. Speichern Sie die Datei.

Wenn Sie die Projektmappe erstellen und an den Windows Phone-Emulator bereitstellen, wird das Listenformular für die Liste der Kunden angezeigt. Wenn Sie ein Element in der Liste, um das Anzeigeformular für einen bestimmten Kunden anzeigen auswählen, sehen Sie eine Schaltfläche, um die Bestellungen dieses Kunden anzeigen (Abbildung 1) zugeordneten abrufen.

Abbildung 1: Anzeigeformular für Kunden

Anzeigeformular für Kunden

Wenn Sie die Schaltfläche Get Orders in diesem Formular anzeigen auswählen, werden die Aufträge für den Kunden in der Liste Form aus dem OrdersSPListApp-Projekt in der Projektmappe (Abbildung 2) angezeigt.

Abbildung 2: Formular der Auftragsliste

Formular der Auftragsliste

Aus diesem Formular (das Listenformular für die Orders-Liste) können Sie hinzufügen, bearbeiten oder Löschen von Bestellungen für einen Kunden. Wenn Sie die Schaltfläche Abbrechen geklickt haben, navigieren Sie zum Listenformular für die Liste der Kunden zurück. In einer einzelnen Phone-app können Sie die Listenelemente aus zwei SharePoint-Listen verwalten.

Siehe auch