©民俗の知恵
私は、Silverlightでほぼ一杯になりましたが、それを修正したいと思っています。
それでは始めましょう。
私たちがすること:
1.こんにちは、World!
2.単純なコンポーネント
ステップ#1。 前提条件
だから私たちは何が必要なのでしょう。
- Visual Studio 2008 SP1
SP1がない場合は、ここで入手してください。
完全インストール: www.microsoft.com/downloads/details.aspx?familyid=27673C47-B3B5-4C67-BD99-84E525B5CE61&displaylang=en
それ自体がすべてをダウンロードするアップデーター:
www.microsoft.com/downloads/details.aspx?familyid=FBEE1648-7106-44A7-9649-6D9F6D58056E&displaylang=en
- VS 2008のSilverligtツール:
私たちはここに取ります:
www.microsoft.com/downloads/details.aspx?FamilyId=c22d6a7b-546f-4407-8ef6-d60c8ee221ed&displaylang=en
これとそれの両方を入れます。
詳細はこちらをご覧ください: silverlight.net/GetStarted
ステップ#2。 ハローワールド
一般に、この手順は省略できます。silverlight.net/ GetStartedには、すべてを詳細に説明するビデオチュートリアルがありますが、まあまあです。
実際、すべてが始まるところです。
それで、スタジオを開いて、新しいプロジェクトを作成します。
ファイル->新規->プロジェクト
ツリーでVisual C#を探していますが、Silverlightは既にその中にあります。 次に、Silverlightアプリケーションを選択します。
プロジェクトの名前はHelloWorldです。

はい、作成します。 次に、Silverlightアプリケーションを起動する2つの方法を提供します。 ビルド時にSilverlightをホストするテストページを自動的に生成するを選択します(メモリがデバッグのためにサーバーを実行し続けるのが残念なので選択します)。
また、いくつかの自動生成ファイルがあります。
- App.xaml-Silverlightアプリケーションによって使用され、アプリケーションのグローバルイベントや、開始することに関心のない何かを決定します。
- Page.xaml-アプリケーションの視覚的な「プレゼンテーション」。 App.xamlはPageのインスタンスを作成します
そのため、Page.xamlを開き、Studio Toolboxを開いて、TextBlockをToolBoxからxamlのあるウィンドウにドラッグします。
TextBlockテキストを追加します。
< TextBlock >
< TextBlock.Text > Hello, World! </ TextBlock.Text >
</ TextBlock >
* This source code was highlighted with Source Code Highlighter .
F6、次にF5を押します。 クジラ。 喜ぶ。

シンプルでありふれたものでした。
次のステップは、私たちの神がOOPであるため、コンポーネントを実行することです。
ステップ#3。 コンポーネントを作成する
Silverlightクラスライブラリ
プラグインクラスライブラリを作成することから始めましょう。
1.ファイル->新規->プロジェクト
2. Visual C#-> Silverlightクラスライブラリ
名前-MyClassLib
時計のコンポーネントを作成します。 理由はわかりませんが、したいです。
そこで、スタジオが作成したclass1.csファイルの名前をClocs.csに変更します。
コンポーネントは、それぞれ視覚的である必要があり、ControlクラスのClocksを継承します。
それから少しシャーマニズム。 (多くの血がかかりました)
コンポーネントに視覚的な表現を持たせるために、次のことを行います。
Themesフォルダーを作成し、その中にgeneric.xamlファイルを作成します
これは、コンポーネントのデフォルトの「テーマ」です。 その中で次のことを規定しています。
< ResourceDictionary
xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:my ="clr-namespace:MyClassLib;assembly=MyClassLib" >
< Style TargetType ="my:Clocks" >
< Setter Property ="Template" >
< Setter.Value >
< ControlTemplate TargetType ="my:Clocks" >
< Canvas x:Name ="RootElement" />
</ ControlTemplate >
</ Setter.Value >
</ Setter >
</ Style >
</ ResourceDictionary >
*このソースコードは、 ソースコードハイライターで強調表示されました。
デフォルトのテンプレートを作成しました。このテンプレートに手を差し伸べて、そこからCanvasへのリンクを取得し、そこに描画します。
そこで、Clockクラスを編集して、その中のCanvasへの参照を取得します。
namespace MyClassLib
{
[TemplatePart(Name=Clocks.RootElement,Type= typeof (Canvas))]
public class Clocks : Control
{
private const string RootElement = "RootElement" ;
private Canvas rootElement;
public Clocks()
{
this .DefaultStyleKey = typeof (Clocks);
}
public override void OnApplyTemplate()
{
base .OnApplyTemplate();
this .rootElement = this .GetTemplateChild(RootElement) as Canvas;
}
}
}
* This source code was highlighted with Source Code Highlighter .
クジラ。 次に、「ああ** t! うまくいきます!」
コンストラクターで、サイズ変更イベントのリスナーを設定します。
this .SizeChanged += new SizeChangedEventHandler(Clocks_SizeChanged);
* This source code was highlighted with Source Code Highlighter .
そして、Rectangleへのリンクを持つフィールドと、それを作成および描画するメソッドを追加します。
private Rectangle rect;
private void CreateContent()
{
this .rect = new Rectangle();
this .rect.Fill = new SolidColorBrush(Color.FromArgb(0xFF, 0xCC, 0xCC, 0xCC));
this .rootElement.Children.Add( this .rect);
}
private void Render()
{
this .rect.Width = this .ActualWidth;
this .rect.Height = this .ActualHeight;
}
* This source code was highlighted with Source Code Highlighter .
3.3。 コンポーネントを完成させる
ここで、クラスとクジラに時計付きのTextBlockを添付します!
完全なクラスコード:
using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Threading;
namespace MyClassLib
{
[TemplatePart(Name=Clocks.RootElement,Type= typeof (Canvas))]
public class Clocks : Control
{
private const string RootElement = "RootElement" ;
private Canvas rootElement;
public Clocks()
{
this .DefaultStyleKey = typeof (Clocks);
this .SizeChanged += new SizeChangedEventHandler(Clocks_SizeChanged);
}
private void Clocks_SizeChanged( object sender, SizeChangedEventArgs e)
{
this .Render();
}
private TextBlock textBlock;
private DispatcherTimer timer;
private void CreateContent()
{
this .textBlock = new TextBlock();
this .textBlock.TextAlignment = TextAlignment.Center;
this .timer = new DispatcherTimer();
this .timer.Interval = new TimeSpan (0, 0, 0);
this .timer.Tick += new EventHandler(timer_Tick);
this .timer.Start();
this .UpdateClocks();
this .rootElement.Background = new SolidColorBrush(Color.FromArgb(0xFF,0xDD,0xDD,0xDD));
this .rootElement.Children.Add( this .textBlock);
}
private void timer_Tick( object sender, EventArgs e)
{
this .UpdateClocks();
}
private void UpdateClocks()
{
this .textBlock.Text = DateTime .Now.ToLongTimeString();
}
private void Render()
{
this .textBlock.Width = ActualWidth;
this .textBlock.Height = ActualHeight;
}
public override void OnApplyTemplate()
{
base .OnApplyTemplate();
this .rootElement = this .GetTemplateChild(RootElement) as Canvas;
this .CreateContent();
}
}
}
* This source code was highlighted with Source Code Highlighter .
F6、F5:

完全なソリューションはこちらからダウンロードできます: anychart.com/batsuev/smth/MyClassLib.zip
更新
konartのヒント (コメントのhabrahabr.ru/blogs/silverlight/47692/#comment_1228692を参照)
本(電子版)“ Introduction to Silverlight 2”が出版されました-完全にロシア語で
ダウンロードリンク: msdb.ru/Downloads/expression/resources/IntroducingMicrosoftSilverlight2.pdf
PS:「MSDN Lightning Bulletin」に感謝します)