Silverlight - Erste Schritte

In diesem Kapitel sehen wir uns ein Arbeitsbeispiel für Silverlight an. Wir brauchen zwei Dinge -

• Zunächst benötigen wir eine Webseite. Silverlight ist für umfangreiche Internetanwendungen gedacht. Es kann in einem Webbrowser als Teil einer Webseite ausgeführt werden. Die Seite muss ein geeignetes Tag enthalten, um das Silverlight-Plug-In zu laden. Es kann auch die Logik enthalten, um zu erkennen, ob Silverlight installiert ist, und kann eine Fallback-Benutzeroberfläche bereitstellen, wenn es nicht vorhanden ist.

• Das zweite, was wir brauchen, ist der Silverlight-Inhalt selbst. Dieses Tutorial konzentriert sich auf das .NET-Programmiermodell für Silverlight. Wir werden eine kompilierte Silverlight-Anwendung erstellen, die eine Mischung aus XAML, der Modellsprache, mit der wir Silverlight-Benutzeroberflächen definieren, und in C # geschriebenem .NET-Code enthält.

Erstellen Sie eine Webseite

Der einfachste Weg, um mit Silverlight zu beginnen, besteht darin, eine normale Website mit HTML-Seiten und ohne serverseitigen Code zu erstellen. Schauen wir uns ein sehr einfaches Beispiel an.

Step 1 - Öffnen Visual Studio. Drücke denFile Menü, zeigen Sie auf New und dann klicken Project.

Step 2 - A. New ProjectDas Dialogfeld wird geöffnet. UnterTemplates, wählen Visual C# und dann click Silverlight. Wählen Sie im rechten Bereich Silverlight-Anwendung.

Geben Sie einen Projektnamen und einen Speicherort auf Ihrer Festplatte ein, um Ihr Projekt zu speichern, und klicken Sie dann auf OK um das Projekt zu erstellen.

Das Silverlight-Projekt selbst wird nur den Silverlight-Inhalt erstellen, und dieser Inhalt ist nur ein Aktivposten unter vielen, aus denen die gesamte Webanwendung bestehen wird.

Klicken OK.

Step 3 - Überprüfen Sie die Host the Silverlight application checkbox. Der Standardwert ist ein ASP.NET-Webanwendungsprojekt.

Step 4- MS-Visual Studio hat zwei Projekte erstellt, das Silverlight-Projekt und eine ASP.NET-Webanwendung. Jetzt benötigen wir eine ASP.NET-Webanwendung. Sie können dies in der sehenSolution Explorer Fenster wie unten gezeigt.

Alles, was den Inhalt über HTTP bereitstellen kann, reicht aus, aber das ist es Visual Studiound es versteht die ASP.NET-Webtechnologie, und das ist es, was es uns gibt.

Um zu demonstrieren, dass Silverlight nicht von einer bestimmten serverseitigen Technologie abhängt, löschen wir diese .aspx Datei, wobei nur die statische HTML-Datei übrig bleibt.

Step 5- Klicken Sie mit der rechten Maustaste auf FirstExampleTestpage.aspx. Klicken Sie in der Liste der Optionen aufDelete.

Step 6 - Einstellen FirstExampleTestPage.html als die Start Seite.

Das MainPage.xamlDatei definiert die Benutzeroberfläche für Silverlight-Inhalte. Entweder können Sie XAML-Code direkt schreiben oder Sie können auch verwendenToolbox verschiedene UI-Elemente ziehen und ablegen.

Step 7 - Unten ist ein einfacher Code in MainPage.xaml in dem a Button und ein TextBlock sind innerhalb der definiert StackPanel.

<UserControl x:Class = "FirstExample.MainPage" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   mc:Ignorable = "d" 
   d:DesignHeight = "300" d:DesignWidth = "400">  
   
   <Grid x:Name = "LayoutRoot" Background = "White"> 
      <StackPanel> 
		
         <TextBlock x:Name = "TextMessage"  
            Text = "Hello World!"  
            Margin = "5">
         </TextBlock> 
			
         <Button x:Name = "ClickMe"  
            Click = "ClickMe_Click"  
            Content = "Click Me!"  
            Margin = "5"> 
         </Button> 
			
      </StackPanel> 
   </Grid> 
	
</UserControl>

Step 8 - In diesem Beispiel wird davon ausgegangen, dass Sie eine Ereignisbehandlungsmethode mit dem Namen erstellt haben ClickMe_Click. So sieht es in der ausMainPage.xaml.cs Datei.

using System.Windows; 
using System.Windows.Controls;
  
namespace FirstExample { 

   public partial class MainPage : UserControl { 
	
      public MainPage() { 
         InitializeComponent(); 
      } 
	  
      private void ClickMe_Click(object sender, RoutedEventArgs e) { 
         TextMessage.Text = "Congratulations! you have created your first Silverlight Applicatoin"; 
      } 
   } 
}

Step 9 - Eine Silverlight-Anwendung kann auf allen installierten Browsern ausgeführt werden.

Step 10 - Wenn der obige Code kompiliert und ausgeführt wird, wird die folgende Webseite angezeigt.

Step 11 - Wenn Sie jetzt auf klicken Click Me Schaltfläche, wird der Text in der aktualisiert TextBlock Wie nachfolgend dargestellt.

Wir empfehlen Ihnen, das obige Beispiel auszuführen, indem Sie weitere UI-Elemente hinzufügen.