Silverlight-getting-started

提供:Dev Guides
移動先:案内検索

Silverlight-はじめに

この章では、Silverlightの実際の例を見ていきます。 私たちは2つのことが必要です-

  • まず、Webページが必要です。 Silverlightは、リッチインターネットアプリケーションを対象としています。Webページの一部としてWebブラウザー内で実行するように設計されています。 ページには、Silverlightプラグインをロードするための適切なタグを組み込む必要があります。 また、Silverlightがインストールされているかどうかを検出するロジックを含めることもできます。また、Silverlightが存在しない場合にフォールバックユーザーインターフェイスを提供できます。
  • 次に必要なのは、Silverlightコンテンツ自体です。 このチュートリアルでは、Silverlightの.NETプログラミングモデルに焦点を当てます。 XAML、Silverlightユーザーインターフェイスを定義するために使用するモックアップ言語、およびC#で記述された.NETコードの混合を含むコンパイル済みSilverlightアプリケーションを作成します。

Webページを作成する

Silverlightの使用を開始する最も簡単な方法は、サーバー側コードのないHTMLページを使用して通常のWebサイトを作成することです。 非常に簡単な例を見てみましょう。

ステップ1 *- *Visual Studio を開きます。 [*ファイル]メニューをクリックし、[新規作成]をポイントして、[プロジェクト]をクリックします。

Webページの作成

ステップ2 *-*新しいプロジェクト*ダイアログボックスが開きます。 *テンプレート*で、 Visual C#を選択し、 *Silverlight をクリックします。 右側のペインで、Silverlightアプリケーションを選択します。

Silverlightアプリケーションの選択

プロジェクト名とハードドライブ上の場所を入力してプロジェクトを保存し、[OK]をクリックしてプロジェクトを作成します。

Silverlightプロジェクト自体は、Silverlightコンテンツを構築するだけであり、そのコンテンツは、Webアプリケーション全体を構成する多くの資産の1つに過ぎません。

*OK* をクリックしてください。

ステップ3 *-[Silverlightアプリケーションをホストする]チェックボックスをオンにします。 デフォルトはASP.NET Webアプリケーションプロジェクトです。

新しいSilverlightアプリケーション

  • ステップ4 *-MS-Visual Studioは、SilverlightプロジェクトとASP.NET Webアプリケーションの2つのプロジェクトを作成しました。 現在、ASP.NET Webアプリケーションが必要です。 以下に示すように、これは[ソリューションエクスプローラー]ウィンドウで確認できます。

ソリューションエクスプローラー

HTTPを介してコンテンツを提供できるものは何でも実行できますが、これは Visual Studio であり、ASP.NET Webテクノロジーを理解しているため、それが私たちに与えるものです。

Silverlightが特定のサーバー側テクノロジに依存しないことを示すために、この .aspx ファイルを削除して、プレーンな静的HTMLファイルのみを残します。

  • ステップ5 *-FirstExampleTestpage.aspxを右クリックします。 オプションのリストから、[削除]をクリックします。

FirstExampleTestpage.aspx

ステップ6 *- *FirstExampleTestPagelStart ページとして設定します。

FirstExampleTestpagel

*MainPage.xaml* ファイルは、Silverlightコンテンツのユーザーインターフェイスを定義します。 XAMLコードを直接記述することも、 *Toolbox* を使用してさまざまなUI要素をドラッグアンドドロップすることもできます。

ステップ7 *-以下に示すのは *MainPage.xaml の単純なコードで、 ButtonTextBlockStackPanel 内で定義されています。

<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>

ステップ8 *-この例では、 *ClickMe_Click という名前のイベント処理メソッドを作成済みであることを前提としています。 MainPage.xaml.cs ファイルでは次のようになります。

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";
      }
   }
}
  • ステップ9 *-インストールされている任意のブラウザーでSilverlightアプリケーションを実行できます。

Silverlightアプリケーションの実行

  • ステップ10 *-上記のコードをコンパイルして実行すると、次のWebページが表示されます。

コンパイル済み実行済み

ステップ11 *- *Click Me ボタンをクリックすると、以下に示すように TextBlock のテキストが更新されます。

テキスト更新

UI要素をさらに追加して、上記の例を実行することをお勧めします。