Freigeben über

Weiterführende Themen: Dynamisches Laden einer neuen Seite in die Silverlight-Anwendung

  • Artikel

Dd185500.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(de-de,Expression.40).png

Sie können Inhalte auf unterschiedliche Art und Weise in eine Microsoft Silverlight-Anwendung laden. Bei diesem Verfahren werden Objekte für Inhaltsseiten erstellt. Eines der Objekte wird dann geladen, um den Inhalt anzuzeigen, wenn ein Benutzer auf eine Schaltfläche klickt. Weitere Lösungen finden Sie in der Silverlight-Dokumentation Dd185500.xtlink_newWindow(de-de,Expression.40).png in MSDN und auf der Silverlight Community-Website Dd185500.xtlink_newWindow(de-de,Expression.40).png (möglicherweise in englischer Sprache).

So laden Sie eine Seite zur Laufzeit

  1. Öffnen Sie in einem Silverlight-Projekt mit mehreren Inhaltsseiten die Startseite (in der Regel Page.xaml). Angenommen, Sie verfügen in diesem Verfahren über zwei Inhaltsseiten namens UserControl1.xaml und UserControl2.xaml.

    tip noteTipp:

    Zum Hinzufügen neuer Inhaltsseiten klicken Sie im Menü Datei auf Neues Element.

  2. Klicken Sie im Werkzeugpanel auf Objekte Dd185500.0d8b8d29-1af9-418f-8741-be3097d76eab(de-de,Expression.40).png, und wählen Sie das Rahmen-Layoutpanel Dd185500.be354518-c54c-4f86-9c57-0b4a9d384b3e(de-de,Expression.40).png aus. Zeichnen Sie mit der Maus ein Border-Objekt auf die Zeichenfläche.

    Dd185500.b9dabf44-71aa-43cb-b4eb-f020a21b8756(de-de,Expression.40).png

    tip noteTipp:

    Wenn das neue Border-Objekt ausgewählt ist, können Sie die Darstellung ändern, indem Sie im Eigenschaftenpanel die Eigenschaften unter Pinsel und Darstellung ändern. Sie können beispielsweise die BorderBrush -Eigenschaft auf Pinsel mit Volltonfarbe Dd185500.3a66ec96-47bb-47fc-8876-6b9456feec3a(de-de,Expression.40).png und die BorderThickness -Eigenschaft auf den Wert 2 festlegen.

  3. Klicken Sie mit der rechten Maustaste unter Objekte und Zeitachsen auf das [Border]-Objekt, wählen Sie Umbenennen aus, und ändern Sie dann den Namen des Objekts in PageContainer, sodass Sie später in der CodeBehind-Datei auf dieses Objekt verweisen können.

  4. Klicken Sie im Panel Objekte und Zeitachsen auf das LayoutRoot-Objekt, um es zum aktiven Objekt zu machen. Um das LayoutRoot-Objekt wird ein gelber Rahmen angezeigt und alle neuen Objekte, die Sie auf der Zeichenfläche zeichnen, werden untergeordnete Elemente von LayoutRoot.

  5. Klicken Sie im Werkzeugpanel auf Schaltfläche Dd185500.05df1779-a68f-436b-b834-a91b7995a3ec(de-de,Expression.40).png, und zeichnen Sie auf der Zeichenfläche außerhalb des PageContainer-Objekts eine Schaltfläche.

    tip noteTipp:

    Nachdem Sie ein Steuerelement gezeichnet haben, das Text anzeigt, können Sie den Text ändern. Drücken Sie F2, um den Textbearbeitungsmodus zu aktivieren. Beenden Sie den Textbearbeitungsmodus, indem Sie die ESC-TASTE drücken.

  6. Wählen Sie im Panel Objekte und Zeitachsen das [Button]-Objekt aus.

  7. Klicken Sie im Eigenschaftenpanel auf Ereignisse Dd185500.6c67bb3b-e8a2-4a63-bad5-54d5c15b04dd(de-de,Expression.40).png, um von der Eigenschaftenansicht in die Ereignisansicht zu wechseln.

    tip noteTipp:

    Um im Eigenschaftenpanel zur Eigenschaftenansicht zurückzukehren, klicken Sie auf Eigenschaften Dd185500.cee1494c-ef95-4dd4-9fbc-9d02edfa78b7(de-de,Expression.40).png.

  8. Doppelklicken Sie in das Textfeld neben dem Click -Ereignis. Von Microsoft Expression Blend wird ein Name ( Button_Click ) für einen Ereignishandler generiert, der aufgerufen wird, wenn der Benutzer in der ausgeführten Anwendung auf die Schaltfläche klickt.

    Der Code für den Ereignishandler wird von Expression Blend in die Zwischenablage und dann das Projekt in Microsoft Visual Studio 2010 geöffnet, falls dieses installiert ist.

    Wenn kein Code-Editor installiert ist, öffnen Sie die CodeBehind-Datei für das Benutzersteuerelement in einem Text-Editor, und fügen Sie den folgenden Code ein:

    private void Button_Click(object sender, RoutedEventArgs e)
{

}

    Private Sub Button_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

End Sub

    Weitere Informationen zu Interoperabilität von Visual Studio 2010 mit Expression Blend finden Sie unter Ändern einer CodeBehind-Datei.

  9. Zum Wechseln zwischen den zwei im Border-Objekt PageContainer angezeigten Inhaltsseiten erstellen Sie Instanzen der Seiten im Arbeitsspeicher und fügen dann im Ereignishandler dem PageContainer-Objekt eine der Seiten hinzu. Fügen Sie beispielsweise den folgenden fettgedruckten Code in Ihre CodeBehind-Datei ein. "UserControl1" und "UserControl2" sind die Namen von zwei weiteren Inhaltsseiten in Ihrem Projekt.

    tip noteTipp:

    Ein Border-Steuerelement kann nur über ein untergeordnetes Objekt verfügen. Bei einem Steuerelement, das mehr als ein untergeordnetes Element enthalten kann , z. B. ein Raster-Layoutpanel Dd185500.c76bbf09-1922-4f45-8d92-9c8ae64ca4a4(de-de,Expression.40).png, kann der Code geringfügig abweichen.

    		 
    private UserControl1 uc1 = new UserControl1();
    

    private UserControl2 uc2 = new UserControl2();
    

    private bool atUC2 = false;
    

private void Button_Click(object sender, RoutedEventArgs e)
{

      if (atUC2)
    

      {
    

        this.PageContainer.Child = uc1;
    

      }
    

      else
    

      {
    

        this.PageContainer.Child = uc2;
    

      }
    

      atUC2 = !atUC2;
    
}

    Private uc1 As UserControl1 = New UserControl1()
    

    Private uc2 As UserControl2 = New UserControl2()
    

    Private atUC2 As Boolean = False
    

Private Sub Button_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

    If atUC2 Then
    

        Me.PageContainer.Child = uc1
    

      Else
    

        Me.PageContainer.Child = uc2
    

      End If
    

      atUC2 = Not atUC2
    
End Sub

  10. Testen Sie Ihr Projekt (F5), und klicken Sie auf Ihre Schaltfläche. UserControl1 und UserControl2 werden in den PageContainer-Rahmen geladen.

    Dd185500.635377b3-9d34-40f7-89c4-c743582d38e5(de-de,Expression.40).png

Problembehandlung

  • Wenn Sie die Fehlermeldung "Die CodeBehind-Datei kann nicht geändert werden. Die folgende Klasse wurde nicht gefunden" erhalten, wenn Sie im Ereignispanel in Expression Blend doppelklicken, müssen Sie möglicherweise in den externen Code-Editor (in der Regel Microsoft Visual Studio) wechseln, um die Projektmappe neu zu laden. Beim Neuladen werden die neuen Dateien berücksichtigt, die die fehlende Klasse definieren.

  • Wenn in Visual Studio 2010 die Fehlermeldung "Cannot load the solution" (Lösung kann nicht geladen werden) angezeigt wird, ist Microsoft Silverlight Tools für Visual Studio 2010 Dd185500.xtlink_newWindow(de-de,Expression.40).png möglicherweise nicht installiert. Installieren Sie die Werkzeuge, und versuchen Sie im Ereignispanel in Expression Blend doppelzuklicken.

  • Wenn der Inhalt der dynamisch geladenen Seiten nicht angezeigt wird, ist der PageContainer-Rahmen möglicherweise nicht groß genug, um den gesamten geladenen Inhalt aufzunehmen. Vergrößern Sie den PageContainer-Rahmen, oder legen Sie die Layouteigenschaften in den dynamisch geladenen Seiten auf die folgenden Einstellungen fest:

    • Breite = Auto

    • Höhe = Auto

    • Margin-Eigenschaften = 0

  • Wenn die Schaltfläche nicht mehr angezeigt wird, sobald Sie darauf klicken, haben Sie das Button-Objekt möglicherweise dem PageContainer-Rahmen und nicht dem LayoutRoot-Objekt untergeordnet. (Der hinzugefügte Code ersetzt das untergeordnete Objekt des Border-Objekts PageContainer.) Ziehen Sie im Panel Objekte und Zeitachsen das Button-Objekt in das LayoutRoot-Panel, um das Objekt aus dem PageContainer-Rahmen hinaus zu verschieben.

  • Wenn Sie statt einer Schaltfläche ein neues Objekt erstellen, um das Laden von Seiten auszulösen, und dann in Expression Blend den Namen des Button_Click -Ereignishandlers in das neue Objekt in der Ereignisansicht Dd185500.6c67bb3b-e8a2-4a63-bad5-54d5c15b04dd(de-de,Expression.40).png des Eigenschaftenpanels kopieren, erhalten Sie möglicherweise im Webbrowser eine Fehlermeldung, wenn Sie Ihr Projekt testen (F5). Dieser Fehler kann durch eine falsche Signatur für den Ereignishandler ausgelöst werden, die nicht dem neuen Objekttyp entspricht. Die Signatur für einen Button-Ereignishandler Click entspricht ungefähr der folgenden Signatur:

    private void Button_Click(object sender, RoutedEventArgs e)

    Private Sub Button_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

    Die Signatur für einen MouseLeftButtonDown -Ereignishandler entspricht ungefähr der folgenden Signatur:

    private void Path_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)

    Private Sub Path_MouseLeftButtonDown(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseButtonEventArgs)

    Sie können dieses Problem lösen, indem Sie im Textfeld neben dem korrekten Ereignishandler in der Ereignisansicht Dd185500.6c67bb3b-e8a2-4a63-bad5-54d5c15b04dd(de-de,Expression.40).png des Eigenschaftenpanels doppelklicken, um eine neue Methode mit der richtigen Signatur in der CodeBehind-Datei zu erstellen.

Nächste Schritte

Copyright © 2011 Microsoft Corporation. Alle Rechte vorbehalten.