XAMLの書き方(2)
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]
開始行:
「[[マイクロソフト系技術情報 Wiki>http://techinfoofmicros...
-[[戻る>XAML]]
--[[XAMLの書き方(1)]]
--XAMLの書き方(2)
* 目次 [#s57b8ef1]
#contents
*概要 [#k46d718e]
[[XAMLの書き方(1)]]の続き。
*ビルティング ブロック クラス [#ybf1a413]
[[WPF]] / [[Silverlight]]は、[[Windows Forms]]とは全く異...
類似のビルティング ブロック クラスが使用されているため、...
**Applicationオブジェクト [#xbfab659]
[[WPF]] / [[Silverlight]]にはWindows フォームと同様に App...
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Applicationクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
***画面の起動 [#u2efda8f]
-[[WPF]]では、ApplicationオブジェクトのStartupUri 属性に...
-Applicationオブジェクトはメッセージ ループを構築し、アプ...
-なお、この処理は、起動時に呼び出されるXAMLのパーシャル ...
<Application x:Class="WpfApplication1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Window1.xaml">
<Application.Resources></Application.Resources>
</Application>
-なお、[[Silverlight]]では、ApplicationオブジェクトのStar...
[[Application.Startupイベント(後述)>#r4f6dfc7]]から、初...
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Application.StartupUriプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
***イベント [#r4f6dfc7]
Applicationオブジェクトには様々なイベント処理を実装するこ...
-開始イベント~
[[WPF]] / [[Silverlight]]での共通初期化処理を実装する場合...
-共通エラー ハンドリング イベント~
[[WPF]] / [[Silverlight]]での共通エラー ハンドリング処理...
[[Application.DispatcherUnhandledException>https://opento...
-終了イベント~
[[WPF]] / [[Silverlight]]での共通終了処理を実装する場合、...
-イベントの実装サンプル~
以下、それぞれのイベントの実装サンプルである。
--XAML
<Application x:Class="WpfApplication1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Window1.xaml"
Startup="Application_Startup" Exit="Application_Exit"
DispatcherUnhandledException="Application_Dispatcher...
<Application.Resources></Application.Resources>
</Application>
--コード ビハインド
private void Application_Startup(object sender, StartupE...
System.Diagnostics.Debug.WriteLine("開始処理");
}
private void Application_DispatcherUnhandledException(
object sender, System.Windows.Threading.DispatcherUnha...
System.Diagnostics.Debug.WriteLine("エラー処理");
}
private void Application_Exit(object sender, ExitEventAr...
System.Diagnostics.Debug.WriteLine("終了処理");
}
-参考
--MSDN > .NET Frameworkクラス ライブラリ > System.Windows...
---> Startupイベント~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
---> DispatcherUnhandledExceptionイベント~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
---> Exitイベント~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
***Application.Propertiesプロパティ [#w557dfc3]
-[[WPF]]ではASP.NETなどのWebアプリケーションと同様のSessi...
Key - Valueストアとして、Application.Properties プロパテ...
-以下のサンプルで、任意の個所で(画面間を跨って)~
Application.Propertiesプロパティが取得できることを確認で...
--Application.xaml.cs
---XAML
private void Application_Startup(object sender, StartupE...
Application.Current.Properties["Key"] = "Value1";
}
--Window1.xaml.cs
---XAML
<Window x:Class="WpfApplication1.Window1"
・・・
Loaded="Window_Loaded">
<Grid>
<Button Click="Button_Click">ボタン</Button>
</Grid>
---コード ビハインド
private void Window_Loaded(object sender, RoutedEventArg...
MessageBox.Show((string)Application.Current.Properties...
Application.Current.Properties["Key"] = "Value2";
}
private void Button_Click(object sender, RoutedEventArgs...
Window2 w2 = new Window2();
w2.Show();
}
--Window2.xaml.cs
---コード ビハインド
private void Window_Loaded(object sender, RoutedEventArg...
MessageBox.Show((string)Application.Current.Properties...
}
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Application.Propertiesプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
**Window画面 [#y123c6bc]
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Windowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
***ウィンドウの起動 [#ye034fea]
[[WPF]]では[[Windows Forms]]と同様にWindow 画面を、以下の...
-モードレス(通常画面)の起動~
モードレス(通常画面)として起動。
Window2 win2 = new Window2();
win2.Show();
-モーダル ダイアログの起動~
モーダル ダイアログとして起動。
Window2 win2 = new Window2();
win2.Owner = this;
win2.ShowDialog();
***プロパティ [#o7a9e70b]
Windowには、以下のようなプロパティを設定できる。
-Title~
Window.Title プロパティは、ウィンドウのタイトルを取得 / ...
-WindowStartUpLocation~
Window. WindowStartUpLocation プロパティは、~
ウィンドウ起動時の表示位置を取得 / 設定する。
-ResizeMode~
Window. ResizeMode プロパティは、ウィンドウの~
サイズ変更モードを取得 / 設定する(ResizeMode 列挙体)。
-WindowStyle~
Window. WindowStyle プロパティは、~
ウィンドウの境界線スタイルを取得 / 設定する。
-ShowInTaskbar~
Window. ShowInTaskbar プロパティは、~
タスクバーのアイコンの表示・非表示を取得 / 設定する。
-参考
--MSDN > .NET Frameworkクラス ライブラリ > System.Windows...
---> Titleプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> WindowStartupLocationプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> ResizeModeプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> WindowStyleプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> ShowInTaskbarプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
**ナビゲーション フレームワーク [#cb2f10e1]
-[[WPF]] / [[Silverlight]]では「ナビゲーション フレームワ...
WWWブラウザの単一ウィンドウ、複数ページから構成される画面...
-この機能は、「ナビゲーション フレームワーク」のNavigatio...
ウィザードや、ハイパー テキスト ソリューションに有用であ...
-なお、以下のような機能もサポートされている。
--WWWブラウザ型の単一ウィンドウ、複数ページから構成される...
--WWWブラウザ同様、画面遷移の履歴が残り[進む]・[戻る]操作...
--ハイパーリンクによる画面遷移、HTTPコンテンツの参照をサ...
-以下、NavigationWindow / Pageの使用方法を説明する。
***NavigationWindow画面を作成 [#q77831fb]
-[[WPF]]の場合、初めに、NavigationWindow (を継承した)画...
-なお、NavigationWindowは、Windowクラスを継承するため、前...
-コード
--XAML
<NavigationWindow x:Class="WpfApplication1.NavWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="NavWindow" Height="300" Width="300">
</NavigationWindow>
--コード ビハインド
public partial class NavWindow : NavigationWindow {
public NavWindow() {
InitializeComponent();
}
}
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Navigation.NavigationWindowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
***NavigationWindow画面を起動 [#zcc2c387]
[[WPF]]でNavigationWindow画面を起動する方法について説明す...
-モードレス(通常画面)~
NavigationWindow画面をモードレス(通常画面)として起動で...
なお、ApplicationオブジェクトのStartupUri属性から直接起動...
NavWindow normalWindow = new NavWindow();
normalWindow.Show();
-モーダル ダイアログ~
NavigationWindow画面をモーダル ダイアログとして起動するこ...
NavWindow dialogWindow = new NavWindow();
dialogWindow.Owner = this;
bool returnValue = dialogWindow.ShowDialog() ?? false;
***Page画面のロード (1) [#cfddd8c0]
-[[WPF]]でNavigationWindow画面から、Page 画面をロードする...
-なお、PageはFrameworkElementからの派生クラスであって、~
NavigationWindow・Frame コントロールでのみホスト・ナビゲ...
-Page 画面をロードする方法
--Loadedイベントからロード~
NavigationWindow画面のコード ビハインドのLoadedイベントか...
---XAML
<NavigationWindow x:Class="WpfApplication1.NavWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="NavWindow" Height="300" Width="300" Loaded="N...
</NavigationWindow>
---コード ビハインド
public partial class NavWindow : NavigationWindow {
public NavWindow() {
InitializeComponent();
}
private void NavigationWindow_Loaded(object sender, Ro...
// Page1 を表示します。
this.Navigate(new Page1());
}
}
--Sourceプロパティからロード~
NavigationWindow画面のSourceプロパティに指定してPage画面...
---XAML
<NavigationWindow x:Class="WpfApplication1.NavWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="NavWindow" Height="300" Width="300" Source="Pag...
</NavigationWindow>
--Frameコントロールからロード~
Page内を複数のFrameに分割し、その中に複数のページをロード...
---XAML
<StackPanel Orientation="Vertical">
<Frame Source="Page2.xaml" Navigated="Frame1_Navigated...
<Frame Source="Page3.xaml" Navigated="Frame2_Navigated...
</StackPanel>
--StartupUri属性からロード~
[[ApplicationオブジェクトのStartupUri属性から直接Page画面...
(もしくは、[[前述のApplication.Startupイベント>#r4f6dfc7...
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Controls.Frameクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---> System.Windows.Navigation.NavigationWindowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
***Page画面のロード (2) [#yc0b57e1]
「[[XBAP]]」、「[[Silverlight]]」では、WindowNavigation /...
-[[XBAP]]~
ApplicationオブジェクトのStartupUri属性から直接Page画面を...
<Application x:Class="WpfBrowserApplication1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Page1.xaml">
<Application.Resources>
</Application.Resources>
</Application>
-[[Silverlight]]~
ApplicationオブジェクトのStartupUri属性がサポートされない...
Application.StartupイベントからPage画面をロードする。
--XAML
<Application xmlns="http://schemas.microsoft.com/winfx/2...
xmlns:x="http://schemas.microsoft.com/winfx...
x:Class="SilverlightApplication1.App">
<Application.Resources>
</Application.Resources>
</Application>
--コード ビハインド
public App(){
this.Startup += this.Application_Startup;
this.Exit += this.Application_Exit;
this.UnhandledException += this.Application_UnhandledE...
InitializeComponent();
}
private void Application_Startup(object sender, StartupE...
// this.RootVisual = new MainPage(); デフォルトは、ユ...
this.RootVisual = new Page1();
}
>なお、「[[Silverlight]]」では、~
デフォルトの初期画面(Application.RootVisual)が、ユーザ ...
通常、ユーザ コントロールにFrameを追加し、Frameでページ遷...
***Page画面の画面遷移 [#gd2f5a43]
[[WPF]] / [[Silverlight]]におけるPage画面の画面遷移方法に...
-Hyperlinkタグによる画面遷移
--[[WPF]]のPage画面では、Hyperlinkタグ使用して、画面遷移...
※ なお、Hyperlinkタグは、TextBlockタグなどで囲う必要があ...
<Hyperlink NavigateUri="Page2.xaml">次のページへ移動しま...
<Hyperlink NavigateUri="Page1.xaml">前のページへ移動しま...
--[[Silverlight]]のPage画面では、HyperlinkButtonタグ使用...
<HyperlinkButton NavigateUri="/Page2.xaml">次のページへ...
<HyperlinkButton NavigateUri="/Page1.xaml">前のページへ...
-コードビハインドからの画面遷移~
コード ビハインドからの画面遷移も可能である。
--[[WPF]]の場合は、Page画面を直接生成可能である。
this.NavigationService.Navigate(new Page2());
--[[Silverlight]]の場合は、Page画面をUriで指定する必要が...
---以下は、相対パス指定:
this.NavigationService.Navigate(new Uri("/Page2.xaml", U...
---以下は、絶対パス指定:
this.NavigationService.Navigate(
new Uri("pack://application:,,,/Page2.xaml", UriKin...
***Page画面の進む・戻る操作への対応 [#jc2ad1b0]
-[[WPF]] / [[Silverlight]]では、WWWブラウザ同様、進む・戻...
進む・戻る操作に対応している(Webアプリケーションと同様に...
-「[[XBAP]]」、「[[Silverlight]]」については、この進む・...
#ref(NavigationServiceGoForwardAndGoBack.png,left,nowrap,...
-コードビハインドからの進む・戻る操作~
コードビハインドからは、次の処理で進む・戻る操作に対応で...
--進む
this.NavigationService.GoForward();
--戻る
this.NavigationService.GoBack();
-履歴の管理
--進む・戻る操作が行えるということは、画面遷移の履歴を保...
---これを以下のコードで画面遷移のPage履歴を消去できる。
this.NavigationService.RemoveBackEntry();
---Page履歴の消去処理を自動化する場合は、NavigationWindow...
private void NavigationWindow_Navigated(object sender, N...
this.NavigationService.RemoveBackEntry();
}
--「[[XBAP]]」、「[[Silverlight]]」ではNavigationWindowが...
※ Frameを使用しない場合は、PageのLoadedイベントなどで履歴...
private void Frame1_Navigated(object sender, NavigationE...
if (NavigationService !=null) {
if (NavigationService.CanGoBack) {
this.NavigationService.RemoveBackEntry();
}
}
}
private void Frame2_Navigated(object sender, NavigationE...
if (NavigationService != null) {
if (NavigationService.CanGoBack) {
this.NavigationService.RemoveBackEntry();
}
}
}
-なお、Page履歴の管理はブラック ボックスとなっているため、~
詳細は不明であるが、前Pageに戻った際に入力状態が保持され...
Page履歴により、ある程度メモリが消費されているものと考え...
メモリ消費量が拡大するような場合はPage履歴の消去を検討す...
***Page画面の進む・戻る操作の注意点 [#j89c6ca2]
- [新規画面遷移] → [戻る] → [進む]の一連の操作で、表示さ...
必要に応じてこれを考慮した実装とするか、[進む]・[戻る]操...
-再初期化とは?~
コンストラクタや、PageのLoadedイベントの処理の実行
--コンストラクタが実行されるのは、最初のPageのみである。
--LoadedイベントはすべてのPageで実行される。
- [進む]・[戻る]操作を抑止する。~
先頭PageでPage.ShowsNavigationUIプロパティをfalseに設定に...
以降のPageの[進む]・[戻る]ボタンを非表示にするか、前述の...
-[進む]・[戻る]ボタンを非表示にする。
--XAML
<Page x:Class="WpfApplication1.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page1" ShowsNavigationUI="false">
-BackSpaceキーによる[戻る]を抑止
--[進む]・[戻る]ボタンを非表示にする場合もBackSpaceキーで...
--また、UI要素にフォーカスの当たっていない状態では、BackS...
Page.LoadedイベントなどでPage上の入力UI要素にフォーカスを...
---XAML
<Page x:Class="WpfApplication1.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page1" ShowsNavigationUI="false"
Loaded="Page_Loaded" KeyDown="Page_KeyDown">
<StackPanel>
<TextBlock>
<Hyperlink NavigateUri="Page2.xaml">Page2</Hyperli...
</TextBlock>
<TextBox Name="textBox1"/>
</StackPanel>
</Page>
---コード ビハインド
public partial class Page1 : Page {
public Page1() {
InitializeComponent();
}
private void Page_Loaded(object sender, RoutedEventArg...
this.textBox1.Focus();
}
private void Page_KeyDown(object sender, KeyEventArgs ...
if (e.Key == Key.Back) e.Handled = true;
}
}
***その他 [#a491ed54]
NavigationWindow / Pageのその他のトピック
-UriMapperクラス
--UriMapper クラスは「[[Silverlight]]」専用のコントロール...
HyperlinkタグのNavigateUri属性などで使用するPage.xamlへの...
--UriMapperクラスは複数のUriMapping クラスから構成され、~
UriMappingクラスのMappedUriプロパティに実際のPage.xamlへ...
Uriプロパティに簡素化したパス(のパターン)を指定する。
--作成したUriMapperオブジェクトをFrame.UriMapperプロパテ...
追加することで、Frame内で簡素化したパスを使用することがで...
-ChildWindowコントロール
--ChildWindow コントロールは、「[[Silverlight]]」専用のコ...
Page上に、子ウィンドウ(モーダル ダイアログ相当)を表示で...
--「[[Silverlight]]」アプリケーションのプロジェクトでは、~
ChildWindowのクラステンプレートが用意されており、~
これを新規作成し、以下のコードでChildWindowを呼び出すこと...
--ChildWindowは、若干のアニメーションのエフェクトを伴い表...
また、ChildWindowから、さらに子のChildWindowを表示させる...
ChildWindow1 childWindow = new ChildWindow1();
childWindow.Show();
-注意事項~
なお、NavigationWindow / Pageの使用における注意点は、以下...
--「[[XBAP]]」の場合の[[注意点>XBAP#cc3b3e1b]]
--「[[Silverlight]]」の場合の[[注意点>Silverlight]]
-ナビゲーション フレームワーク 参考情報
--MSDN > Silverlight > アプリケーション モデルとプログラ...
---> アプリケーション モデル > ナビゲーションの概要~
http://msdn.microsoft.com/ja-jp/library/cc838245.aspx#app...
--@IT > Insider.NET > 連載:Silverlight 3実践プログラミ...
---> ナビゲーション・フレームワークとChildWindowコントロ...
1. ナビゲーション・フレームワークとは~
http://www.atmarkit.co.jp/fdotnet/chushin/silverlight3dev...
--CodeZine > Silverlight 3徹底入門
---> Silverlight 3で作る業務アプリケーションの要 > 「ナビ...
http://codezine.jp/article/detail/4810
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Navigation.UriMapperクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
---> System.Windows.Navigation.UriMappingクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
--->System.Windows.Controls.ChildWindowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
**Win32ダイアログ [#m8eadb88]
-[[WPF]] / [[Silverlight]]は、従来からの種々のWin32ダイア...
-このため、[[WPF]] / [[Silverlight]]アプリケーションであ...
「外観や、操作方法の異なる標準ダイアログに慣れる必要があ...
***メッセージ ボックス [#u8a19670]
下記のMessageBoxクラスの名前空間は、[[Windows Forms]]では...
このMessageBoxクラスのクラス階層を確認すると[[WPF]]のアー...
-MSDN > .NET Frameworkクラス ライブラリ > System.Windows....
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
-MSDN > Silverlightの.NET Frameworkクラス ライブラリ > Sy...
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
***コモン ダイアログ ボックス [#j9729fdc]
-OpenFileDialog クラス
--OpenFileDialogは、部分信頼で実行されている。
--「[[XBAP]]」・「[[Silverlight]]」でもファイル名を取得で...
-SaveFileDialog クラス
--SaveFileDialogは、部分信頼で実行されている。
--「[[XBAP]]」・「[[Silverlight]]」でもファイルを保存でき...
-PrintDialog クラス
---このクラスの名前空間は、[[Windows Forms]]ではなく[[WPF...
クラス階層を確認するとWPFのアーキテクチャに基づいていない...
---Silverlightでは、Printdocument クラス
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> Microsoft.Win32.OpenFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/microsoft.win32.o...
---> Microsoft.Win32.SaveFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/microsoft.win32.s...
---> System.Windows.Controls.PrintDialogクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
--MSDN > Silverlightの.NET Frameworkクラス ライブラリ
---> System.Windows.Controls.OpenFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---> System.Windows.Controls.SaveFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---> System.Windows.Printing.PrintDocumentクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.pr...
--MSDN > Windows Presentation Foundation > ドキュメント
---> 印刷および印刷システムの管理 > 印刷の概要~
http://msdn.microsoft.com/ja-jp/library/ms742418(VS.80).a...
***カスタム ダイアログ ボックス [#r16cb2d2]
-[[前述の、モーダル ダイアログの起動>#ye034fea]]を参照の...
-「[[XBAP]]」では使用できないので注意する。
-なお、「[[Silverlight]]」の場合は、前述のChildWindowコン...
***参考 [#qe69230a]
-MSDN > Windows Presentation Foundation
--> アプリケーション開発 > WPFウィンドウ > ダイアログ ボ...
http://msdn.microsoft.com/ja-jp/library/aa969773.aspx
--> 移行と相互運用性 > Windowsフォーム コントロールおよび...
http://msdn.microsoft.com/ja-jp/library/ms750559.aspx
-MSDN > Silverlight
--> コントロールおよびダイアログ ボックスの使用 > ダイア...
http://msdn.microsoft.com/ja-jp/library/ff382752(VS.95).a...
*入力支援 [#j81696d4]
入力支援機能に関する技術要素について説明する。
**メニュー・タスクバーとコマンド [#p7757f04]
-メニュー・タスクバーと「コマンド」の関連付けも、宣言的プ...
-例えば、以下のXAMLでメニュー・タスクバーと「コマンド」の...
また、メニュー・タスクバーと「コマンド」の関連付けが容易...
***実装 [#r1e0aba4]
-画面
#ref(Menu_Taskbar_Command.png,left,nowrap,メニュー・タス...
-XAML
<Window.CommandBindings>
<!--ApplicationCommands.Saveのカスタム動作(実行可否、...
<CommandBinding x:Name="SaveCommand"
Command="ApplicationCommands.Save"
CanExecute="SaveCommand_CanExecute"
Executed="SaveCommand_Executed"/>
<!--ApplicationCommands.Closeのカスタム動作(実行可否...
<CommandBinding x:Name="CloseCommand"
Command="ApplicationCommands.Close"
CanExecute="CloseCommand_CanExecute"
Executed="CloseCommand_Executed"/>
</Window.CommandBindings>
<DockPanel>
<Menu DockPanel.Dock="Top">
<MenuItem Header="ファイル(_F)">
<!--ApplicationCommands.Save → カスタム動作 → Comm...
<MenuItem Header="保存(_S)" Command="ApplicationCo...
<MenuItem.Icon><Image Source=".\icons\save.png"/...
</MenuItem>
<Separator/>
<!--ApplicationCommands.Close → カスタム動作 → Com...
<!--MenuItem Header="終了(_X)" Command="Applicatio...
<!--ApplicationCommands.Close → カスタム動作 → カ...
<MenuItem Name="Exit" Click="Exit_Click" Header="...
<MenuItem.Icon><Image Source=".\icons\exit.png"/...
</MenuItem>
</MenuItem>
<MenuItem Header="編集(_E)">
<!--ApplicationCommands.Undo → フォーカスのあるコ...
<MenuItem Header="元に戻す(_U)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\undo.png"/...
</MenuItem>
<!--ApplicationCommands.Redo → フォーカスのあるコ...
<MenuItem Header="やり直し(_R)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\redo.png"/...
</MenuItem>
<Separator/>
<!--ApplicationCommands.Cut → フォーカスのあるコン...
<MenuItem Header="切り取り(_T)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\cut.png"/>...
</MenuItem>
<!--ApplicationCommands.Copy → フォーカスのあるコ...
<MenuItem Header="コピー(_C)" Command="Application...
<MenuItem.Icon><Image Source=".\icons\copy.png"/...
</MenuItem>
<!--ApplicationCommands.Paste → フォーカスのあるコ...
<MenuItem Header="貼り付け(_P)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\paste.png"...
</MenuItem>
<!--ApplicationCommands.Delete → フォーカスのある...
<MenuItem Header="削除(_D)" Command="ApplicationCo...
<MenuItem.Icon><Image Source=".\icons\delete.png...
</MenuItem>
<MenuItem Header="配置(_A)">
<!--EditingCommands.AlignLeft → フォーカスのある...
<MenuItem Header="左揃え" Command="EditingComman...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
<!--EditingCommands.AlignCenter → フォーカスのあ...
<MenuItem Header="中央揃え" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
<!--EditingCommands.AlignRight → フォーカスのあ...
<MenuItem Header="右揃え" Command="EditingComman...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
<!--EditingCommands.AlignJustify → フォーカスの...
<MenuItem Header="両端揃え" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
</MenuItem>
<MenuItem Header="スタイル(_S)">
<!--EditingCommands.ToggleBold → フォーカスのあ...
<MenuItem Header="太字" Command="EditingCommands...
<MenuItem.Icon><Image Source=".\icons\text_bol...
</MenuItem>
<!--EditingCommands.ToggleItalic → フォーカスの...
<MenuItem Header="斜体" Command="EditingCommands...
<MenuItem.Icon><Image Source=".\icons\text_ita...
</MenuItem>
<!--EditingCommands.ToggleUnderline → フォーカス...
<MenuItem Header="下線" Command="EditingCommands...
<MenuItem.Icon><Image Source=".\icons\text_und...
</MenuItem>
<!--EditingCommands.ToggleBullets → フォーカスの...
<MenuItem Header="箇条書き" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_lis...
</MenuItem>
<!--EditingCommands.ToggleNumbering → フォーカス...
<MenuItem Header="段落番号" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_lis...
</MenuItem>
<!--EditingCommands.IncreaseIndentation → フォー...
<MenuItem Header="インデントを増やす" Command="E...
<MenuItem.Icon><Image Source=".\icons\text_ind...
</MenuItem>
<!--EditingCommands.DecreaseIndentation → フォー...
<MenuItem Header="インデントを減らす" Command="E...
<MenuItem.Icon><Image Source=".\icons\text_ind...
</MenuItem>
</MenuItem>
<MenuItem Header="テキスト(_T)">
<!--EditingCommands.IncreaseFontSize → フォーカ...
<MenuItem Header="フォントの拡大" Command="Editi...
<!--EditingCommands.DecreaseFontSize → フォーカ...
<MenuItem Header="フォントの縮小" Command="Editi...
</MenuItem>
</MenuItem>
<MenuItem Header="ヘルプ(_H)">
<!--RoutedCommandをコードビハインドから自作しカス...
<MenuItem Header="バージョン情報(_A)" Name="About">
<MenuItem.Icon><Image Source=".\icons\about.png"...
</MenuItem>
</MenuItem>
</Menu>
<ToolBarTray DockPanel.Dock="Top">
<ToolBar Header="編集:">
<Button ToolTip="元に戻す" Command="ApplicationCom...
<Image Source=".\icons\undo.png" Stretch="Fill"/...
<Button ToolTip="やり直し" Command="ApplicationCom...
<Image Source=".\icons\redo.png" Stretch="Fill"/...
<Button ToolTip="切り取り" Command="ApplicationCom...
<Image Source=".\icons\cut.png" Stretch="Fill"/>...
<Button ToolTip="コピー" Command="ApplicationComma...
<Image Source=".\icons\copy.png" Stretch="Fill"/...
<Button ToolTip="貼り付け" Command="ApplicationCom...
<Image Source=".\icons\paste.png" Stretch="Fill"...
<Button ToolTip="削除" Command="ApplicationCommand...
<Image Source=".\icons\delete.png" Stretch="Fill...
</Button>
</ToolBar>
<ToolBar Header="配置:">
<Button ToolTip="左揃え" Command="EditingCommands....
<Image Source=".\icons\text_align_left.png" Stre...
<Button ToolTip="中央揃え" Command="EditingCommand...
<Image Source=".\icons\text_align_center.png" St...
<Button ToolTip="右揃え" Command="EditingCommands....
<Image Source=".\icons\text_align_right.png" Str...
<Button ToolTip="両端揃え" Command="EditingCommand...
<Image Source=".\icons\text_align_justify.png" S...
</ToolBar>
<ToolBar Header="スタイル:">
<Button ToolTip="太字" Command="EditingCommands.To...
<Image Source=".\icons\text_bold.png" Stretch="F...
<Button ToolTip="斜体" Command="EditingCommands.To...
<Image Source=".\icons\text_italic.png" Stretch=...
<Button ToolTip="下線" Command="EditingCommands.To...
<Image Source=".\icons\text_underline.png" Stret...
<Button ToolTip="箇条書き" Command="EditingCommand...
<Image Source=".\icons\text_list_bullets.png" St...
<Button ToolTip="段落番号" Command="EditingCommand...
<Image Source=".\icons\text_list_numbers.png" St...
<Button ToolTip="インデントを増やす" Command="Edit...
<Image Source=".\icons\text_indent.png" Stretch=...
<Button ToolTip="インデントを減らす" Command="Edit...
<Image Source=".\icons\text_indent_remove.png" S...
</ToolBar>
</ToolBarTray>
<RichTextBox DockPanel.Dock="Top" Width="Auto" Height=...
IsDocumentEnabled="True" AcceptsTab="True" FontSize=...
<RichTextBox DockPanel.Dock="Top" Width="Auto" Height=...
IsDocumentEnabled="True" AcceptsTab="True" FontSize=...
</DockPanel>
-コード ビハインド
/// <summary>Window1.xaml の相互作用ロジック</summary>
public partial class Window1 : Window {
public Window1() {
InitializeComponent();
// UIElementにRoutedCommandをバインドし、メニューに...
InitRoutedCommands_about();
}
// AboutCommand(カスタムのRoutedCommand)
public static readonly RoutedCommand AboutCommand = ne...
private void InitRoutedCommands_about() {
// CommandBindingの生成
CommandBinding binding =
new CommandBinding(AboutCommand, AboutCommand_Exec...
// UIElementにRoutedCommandをバインド
this.CommandBindings.Add(binding);
// メニューに関連付け
About.Command = AboutCommand;
}
// 【情報メニュー+コマンド】UIElementにRoutedCommand...
private void AboutCommand_CanExecute(object sender, Ca...
e.CanExecute = true;
}
// 【情報メニュー+コマンド】UIElementにRoutedCommand...
private void AboutCommand_Executed(object sender, Exec...
// 情報表示処理
}
// 【保存メニュー+コマンド】UIElementにRoutedCommand...
private void SaveCommand_CanExecute(object sender, Can...
e.CanExecute = true;
}
// 【保存メニュー+コマンド】UIElementにRoutedCommand...
private void SaveCommand_Executed(object sender, Execu...
// 保存処理
}
// 【終了メニュー+コマンド】UIElementにRoutedCommand...
private void CloseCommand_CanExecute(object sender, Ca...
e.CanExecute = true;
}
// 【終了メニュー+コマンド】UIElementにRoutedCommand...
private void CloseCommand_Executed(object sender, Exec...
this.Close();
}
// 【終了メニュー】メニューのクリックイベントのみの実...
private void Exit_Click(object sender, RoutedEventArgs...
this.Close();
}
}
***説明 [#pd837bfb]
-メニュー・タスクバーと「コマンド」の関連付け
--MenuItem
---MenuItem(MenuItem クラス)は入れ子が可能であり、
---MenuItemのアクセスキーは、MenuItemクラスのHeader属性に...
「英数字」と設定することで(英数字の先頭文字をアクセスキ...
---また、MenuItemからはCommand属性を指定して指定の「Comma...
--ToolBarTray
---ToolBarTray には、を格納でき、ToolBarにはButtonを格納...
---Buttonからは指定の「Command」を発生させることができる。
---ToolBarTray内のToolBarは、実行時にD&Dにて配置を変更で...
--Command
---これらのコントロールから発生させた「Command」は、フォ...
---CommandTarget="{Binding ElementName=要素名}"という記述...
---対象のコントロールは、各種RoutedCommand クラスのCanExe...
発生させるイベントを処理するイベント ハンドラを実装してい...
-標準コマンド
--標準コマンド(ApplicationCommands, EditingCommands, etc...
---「コマンド」に対応する処理のUOCは不要であり、既定の処...
---また、「コマンド」には、既定のショートカットも割り当て...
--コントロールの実装する標準コマンド(上記サンプルでは、A...
---「コマンド」に対応したイベント ハンドラのUOCをUIElemen...
---標準コマンドのカスタム処理の定義・実装には、標準コマン...
ApplicationCommands.CanExecute、Executeが発生させるカスタ...
---また、上記の方式は、カスタム コマンド(RoutedCommand)...
--その他にも、以下の標準コマンドがSystem.Windows.Input名...
---ComponentCommands
---MediaCommands
---NavigationCommands
***参考 [#v7fadce9]
-MSDN
--Windows Presentation Foundation > コントロール > メニュ...
http://msdn.microsoft.com/ja-jp/library/ms747430.aspx
--.NET Frameworkクラス ライブラリ
---System.Windows.Controls.MenuItemクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---System.Windows.Controls.ToolBarTrayクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---System.Windows.Controls.ToolBarクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---System.Windows.Input.RoutedCommandクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
---System.Windows.Input.ApplicationCommandsクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
---System.Windows.Documents.EditingCommandsクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.do...
**ツールチップ [#bd8125d8]
-WPFでは、「ツールチップ」を任意のUIコントロールに設定可...
-これにはFrameworkElement、FrameworkContentElementにToolT...
***実装 [#p041613d]
-画面
#ref(Tooltip.png,left,nowrap,ツールチップ)
-XAML
--UserControl
<UserControl x:Class="WpfApplication1.UserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="250" Height="120">
<StackPanel>
<TextBlock Margin="4,4,4,4" Text="タイトル"
TextWrapping="Wrap" FontWeight="Bold" FontSize="14...
<Path Width="Auto" Height="1"
Fill="Black" Stretch="Fill"
Stroke="Black" Data="M20,45 L250,45"
Margin="4,4,4,4"/>
<TextBlock Margin="4,4,4,4" Text="説明文"
TextWrapping="Wrap"/>
</StackPanel>
</UserControl>
--Window
<Window x:Class="WpfApplication1.Window1"
・・・
xmlns:my="clr-namespace:WpfApplication1"
・・・>
・・・
<RichTextBox DockPanel.Dock="Top" Width="Auto" Height="1...
IsDocumentEnabled="True" AcceptsTab="True" ...
<RichTextBox.ToolTip>
<ToolTip>
<my:UserControl1/>
</ToolTip>
</RichTextBox.ToolTip>
</RichTextBox>
***説明 [#lbcc9016]
このToolTipプロパティには、ToolTip属性に直接文字列で説明...
「プロパティ要素構文」を使用して、説明文などの文字列だけ...
例えば、以下は、ユーザ コントロールを使用してToolTipを表...
***参考 [#j60feaeb]
-MSDN > .NET Frameworkクラス ライブラリ
--System.Windows.FrameworkElement.ToolTipプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.do...
--System.Windows.FrameworkContentElement.ToolTipプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.fr...
**IME制御 [#e48a4e9d]
-WPF / Silverlightでは、InputMethod クラスを利用すること...
-ただし、
--IME2003以外では、IMEのオン・オフの切り替え(ひらがな ⇔ ...
--入力モードの切り替え(カタカナ ⇔ 全角英字など)はできな...
-切り替え方法
--IMEオン・オフ
---InputMethod.SetIsInputMethodEnabledメソッド
---InputMethod.Current.ImeStateプロパティ
--入力モード
---InputMethod.SetPreferredImeConversionModeメソッド
---InputMethod.Current.ImeConversionModeプロパティ
***実装 [#h5db94a5]
以下は、IME制御のサンプルである。
-画面
#ref(IME-Control.png,left,nowrap,IME制御)
-XAML~
イベント ハンドラでIME制御する方法と、XAMLでIME制御する方...
--イベント ハンドラでIME制御
<StackPanel Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="制御なし:"/>
<TextBox Name="textBox0" Height="23" Width="120"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Text="以下、イベントで制御"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="OFF:"/>
<TextBox Name="textBox1" Height="23" Width="120"
GotFocus="textBox1_GotFocus" LostFocus="textBox1_L...
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="ON:"/>
<TextBox Name="textBox2" Height="23" Width="120"
GotFocus="textBox2_GotFocus" LostFocus="textBox2_L...
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="全角片仮名:...
<TextBox Name="textBox3" Height="23" Width="120"
GotFocus="textBox3_GotFocus" LostFocus="textBox3_L...
</StackPanel>
--XAMLでIME制御
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Text="以下、XAMLで制御"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="OFF:"/>
<TextBox Name="textBox4" Height="23" Width="120"
InputMethod.PreferredImeState="Off"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="ON:"/>
<TextBox Name="textBox5" Height="23" Width="120"
InputMethod.PreferredImeState="On"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="半角片仮名:...
<TextBox Name="textBox6" Height="23" Width="120"
InputMethod.PreferredImeState="On" InputMethod.Pre...
</StackPanel>
</StackPanel>
-コード ビハインド~
下記はイベント ハンドラによるIME制御である。
/// <summary>Window1.xaml の相互作用ロジック</summary>
public partial class Window1 : Window {
public Window1() {
InitializeComponent();
}
InputMethodState ims = InputMethodState.DoNotCare;
ImeConversionModeValues imc = ImeConversionModeValues....
private void textBox1_GotFocus(object sender, RoutedEv...
ims = InputMethod.Current.ImeState;
InputMethod.Current.ImeState = InputMethodState.Off;
}
private void textBox1_LostFocus(object sender, RoutedE...
InputMethod.Current.ImeState = ims;
}
private void textBox2_GotFocus(object sender, RoutedEv...
ims = InputMethod.Current.ImeState;
InputMethod.Current.ImeState = InputMethodState.On;
}
private void textBox2_LostFocus(object sender, RoutedE...
InputMethod.Current.ImeState = ims;
}
private void textBox3_GotFocus(object sender, RoutedEv...
ims = InputMethod.Current.ImeState;
imc = InputMethod.Current.ImeConversionMode;
InputMethod.Current.ImeState = InputMethodState.On;
InputMethod.Current.ImeConversionMode = ImeConversio...
| ImeConversionModeValues.FullShape | ImeConversio...
}
private void textBox3_LostFocus(object sender, RoutedE...
InputMethod.Current.ImeState = ims;
InputMethod.Current.ImeConversionMode = imc;
}
}
***説明 [#of372628]
イベント ハンドラでのIME制御の動作は、~
以下の点が、XAMLによるIME制御の場合と異なる。
-GotFocus、LostFocusイベントを扱っており、~
GotFocusイベントで現状のIME設定を保存し、~
LostFocusイベントでIME設定を復元している。
-このため、入力時のIME設定変更はLostFocusイベントで無効に...
***参考 [#fe6aa6ad]
-MSDN > .NET Frameworkクラス ライブラリ
--System.Windows.Input.InputMethodクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
--System.Windows.Input.InputMethodクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
-Microsoft Connect|WinXP&IME2003環境で、WPFのTextBoxに...
http://connect.microsoft.com/VisualStudioJapan/feedback/d...
*デザイナ向け機能 [#jb851708]
デザイナ向けの技術要素について説明する。
**様々なシェイプ [#yc5dd22e]
-[[「クラス階層」のVisualクラス>WPFのアーキテクチャ#s4219...
WPF / Silverlightでは、Shape クラスから派生する様々なベク...
-Shapeクラスから派生するベクタ グラフィックス描画クラスに...
--Rectangle クラス~
四角形を描画
--Ellipse クラス~
楕円を描画
--Line クラス~
直線を描画
--Polyline クラス~
一連の直線を描画
--Path クラス~
一連の直線と曲線を描画
***実装 [#q14db6d3]
-ただし、Visual StudioではPath 要素の編集が困難である。~
このためExpression Blendのデザイナでは、[ペン]や[鉛筆]な...
以下は、Expression Blendデザイナの[ペン]や[鉛筆]を使用し...
--画面
#ref(Path.png,left,nowrap,様々なシェイプ(Path),60%)
--XAML
<Grid>
<Path Fill="White" Stretch="Fill" Stroke="Black" Strok...
Data="M208,68 C182.37169,68 155.97712,69 131,69 ・・...
<Path Fill="White" Stretch="Fill" Stroke="Black" Strok...
Data="M88,132 C88,132 87.5,250.5 120.5,234.5 ・・・"/>
</Grid>
-さらに、VSやExpression Blendを用い、Ellipse・TextBlockな...
これをExpression Blendで、これらをPath に変換するといった...
--画面
#ref(EllipseAndTextBlock.png,left,nowrap,様々なシェイプ(...
--XAML
<Grid>
<Viewbox Height="400" Width="400">
<Grid>
<Ellipse Stroke="Black" StrokeThickness="5"
Height="400" Width="400"/>
<TextBlock Text="WPF" FontSize="150"
HorizontalAlignment="Center" VerticalAlignment="...
</Grid>
</Viewbox>
</Grid>
-この変換を行うには、Expression Blend の[オブジェクトとタ...
メニューの[オブジェクト] → [パス] → [複合パスの作成]を選...
--XAML
<Grid>
<Path Data="M397.5,200 C397.5,309.07624 309.07624,397....
</Grid>
***参考 [#i3eb775f]
-MSDN
--System.Windows.Shapes.Shapeクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---MSDNマガジン > 発行物 > 基礎:ベクタ グラフィックスとW...
http://msdn.microsoft.com/ja-jp/magazine/cc337899.aspx
--System.Windows.Shapes.Rectangleクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Ellipseクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Lineクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Polylineクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Pathクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
**グラデーション [#hda741d1]
WPF / Silverlightでは、様々なグラデーションをデザイン可能。
***実装 [#fe777167]
-簡単なグラデーション~
以下の簡素なグラデーションであれば、XAMLで直接記述するこ...
--画面
#ref(EasyGradation.png,left,nowrap,簡単なグラデーション)
--XAML
<Window.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,...
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Window.Background>
-複雑なグラデーション~
しかし、以下の複雑なグラデーションであれば、~
Expression Blendのデザイナを使用した方が、容易にグラデー...
--画面
#ref(ComplexGradation.png,left,nowrap,複雑なグラデーション)
--XAML
<Window.Background>
<RadialGradientBrush GradientOrigin="0.3,0.3">
<GradientStop Color="Aqua" Offset="0.1"/>
<GradientStop Color="Black" Offset="0.2"/>
<GradientStop Color="Aqua" Offset="0.3"/>
<GradientStop Color="Black" Offset="0.4"/>
<GradientStop Color="Aqua" Offset="0.5"/>
<GradientStop Color="Black" Offset="0.6"/>
<GradientStop Color="Aqua" Offset="0.7"/>
<GradientStop Color="Black" Offset="0.8"/>
<GradientStop Color="Aqua" Offset="0.9"/>
</RadialGradientBrush>
</Window.Background>
**トランスフォーム処理 [#v0a7e63e]
-WPFで2D平面での変換を行う「トランスフォーム処理」を使用...
--「回転、拡大縮小、傾斜、平行移動」
--「アニメーションなど一時効果」
-「トランスフォーム処理」に使用できるクラスには、~
System.Windows.Media名前空間のTransform クラスから派生す...
--MatrixTransform
--RotateTransform
--ScaleTransform
--SkewTransform
--TranslateTransform
--TransformGroup
-なお、TransformGroupを使用すれば、~
複数のTransformクラスを組み合わせて適用することができる。
-以下、下記の図形に対する、上記2つの「トランスフォーム処...
--画面
#ref(PreTransform.png,left,nowrap,トランスフォーム前)
--XAML
<Grid>
<Border Height="100" Width="100" BorderBrush="Black" B...
<Rectangle Height="100" Width="100" Fill="Blue"/>
</Border>
</Grid>
***回転、拡大縮小、傾斜、平行移動 [#eea9fcaa]
-FrameworkElement.LayoutTransformプロパティに設定されたTr...
レイアウト時に「トランスフォーム処理」を実行する。
--このため、「トランスフォーム処理」後もUI要素がレイアウ...
--このような特徴から、この「トランスフォーム処理」は、~
表示を垂直から水平に切り替えたり、ズームしたりするなどの...
-以下は、LayoutTransformプロパティにRotateTransformクラス...
--画面
#ref(AfterLayoutTransform.png,left,nowrap,回転、拡大縮小...
--XAML
<Grid>
<Border Height="100" Width="100" BorderBrush="Black" B...
<Rectangle Height="100" Width="100" Fill="Blue">
<Rectangle.LayoutTransform>
<RotateTransform CenterX="50" CenterY="50" Angle...
</Rectangle.LayoutTransform>
</Rectangle>
</Border>
</Grid>
***アニメーションなど一時効果の追加 [#g7192384]
-UIElement.RenderTransformプロパティに設定されたTransform...
レイアウト後に「トランスフォーム処理」しレンダリングする。
--このため、場合によってはUI要素がレイアウトの描画領域の...
--このような特徴から、この「トランスフォーム処理」は、~
「アニメーション」(後述)と組み合わせるなどしてUI要素に...
-以下は、RenderTransformプロパティにRotateTransformクラス...
--画面
#ref(AfterRenderTransform.png,left,nowrap,アニメーション...
--XAML
<Grid>
<Border Height="100" Width="100" BorderBrush="Black" B...
<Rectangle Height="100" Width="100" Fill="Blue">
<Rectangle.RenderTransform>
<RotateTransform CenterX="50" CenterY="50" Angle...
</Rectangle.RenderTransform>
</Rectangle>
</Border>
</Grid>
※ なお、こちらの「トランスフォーム処理」は「Silverlight」...
***参考 [#z347d280]
-MSDN
--System.Windows.Media.Transformクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
---Silverlightの.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
**アニメーション [#x6c21b91]
***実装 [#idce5d4d]
***説明 [#m9ad9bf8]
***参考 [#df9654b1]
*MVVMデザイン パターン [#i380f3a3]
**概要 [#w9210446]
MVVM(Model - View - View Model)モデルとは、~
前述の「データ バインディング」の仕組みを活用したデザイン...
従来の3層デザイン パターンの「モデル オブジェクト」、「...
「バインディング ソース」である「ビュー・モデル オブジェ...
**メリット [#z0b52812]
このデザイン パターンのメリットは、~
「モデル オブジェクト」、「ビュー オブジェクト」間の結合...
「データ バインディング」による「ビュー・モデル オブジェ...
**ガイドライン [#s86bd6d9]
なお、MVVMデザイン パターンのためのガイドライン には、以...
+XAMLで実装できるものは、コードビハインドに実装しない。
+「ビュー・モデル オブジェクト」はDataContextとして「ビュ...
+「ビュー・モデル オブジェクト」と「モデル オブジェクト」...
「データ バインディング」により結合されるため、「ビュー ...
+「ビュー・モデル オブジェクト」は、INotifyPropertyChange...
+「ビュー・モデル オブジェクト」は、「モデル オブジェクト...
「ビュー オブジェクト」から、データ ストレージの複雑さを...
**参考 [#xb7f1d2d]
-MSDNマガジン > 発行物 > Model - View - ViewModelデザイン...
http://msdn.microsoft.com/ja-jp/magazine/dd419663.aspx
-Moving from Windows Applications to WPF - CodeProject~
http://www.codeproject.com/KB/WPF/WPF_with_MVVM.aspx?msg=...
#ref(MVVM.png,left,nowrap,Model - View - ViewModelデザイ...
*バリデーション [#wff8a95a]
-WPFのバリデーション・フレームワークの使い方。
-以下をプロトタイプ開発したので参考にすることができる。
--SampleProgram/UISubsystem/WPF/Validation at master · Op...
https://github.com/OpenTouryoProject/SampleProgram/tree/m...
**単項目のバリデーション [#ob9f2bf4]
https://github.com/OpenTouryoProject/SampleProgram/tree/m...
**一覧のバリデーション [#ad58117e]
https://github.com/OpenTouryoProject/SampleProgram/tree/m...
**フォーカス制御 [#ue997b59]
フォーカス制御については、いろいろ試しているが~
問題が多いので使わない方向で考えた方が良さそう。
----
Tags: [[:.NET開発]], [[:UIサブシステム]], [[:WPF/Silverli...
終了行:
「[[マイクロソフト系技術情報 Wiki>http://techinfoofmicros...
-[[戻る>XAML]]
--[[XAMLの書き方(1)]]
--XAMLの書き方(2)
* 目次 [#s57b8ef1]
#contents
*概要 [#k46d718e]
[[XAMLの書き方(1)]]の続き。
*ビルティング ブロック クラス [#ybf1a413]
[[WPF]] / [[Silverlight]]は、[[Windows Forms]]とは全く異...
類似のビルティング ブロック クラスが使用されているため、...
**Applicationオブジェクト [#xbfab659]
[[WPF]] / [[Silverlight]]にはWindows フォームと同様に App...
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Applicationクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
***画面の起動 [#u2efda8f]
-[[WPF]]では、ApplicationオブジェクトのStartupUri 属性に...
-Applicationオブジェクトはメッセージ ループを構築し、アプ...
-なお、この処理は、起動時に呼び出されるXAMLのパーシャル ...
<Application x:Class="WpfApplication1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Window1.xaml">
<Application.Resources></Application.Resources>
</Application>
-なお、[[Silverlight]]では、ApplicationオブジェクトのStar...
[[Application.Startupイベント(後述)>#r4f6dfc7]]から、初...
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Application.StartupUriプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
***イベント [#r4f6dfc7]
Applicationオブジェクトには様々なイベント処理を実装するこ...
-開始イベント~
[[WPF]] / [[Silverlight]]での共通初期化処理を実装する場合...
-共通エラー ハンドリング イベント~
[[WPF]] / [[Silverlight]]での共通エラー ハンドリング処理...
[[Application.DispatcherUnhandledException>https://opento...
-終了イベント~
[[WPF]] / [[Silverlight]]での共通終了処理を実装する場合、...
-イベントの実装サンプル~
以下、それぞれのイベントの実装サンプルである。
--XAML
<Application x:Class="WpfApplication1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Window1.xaml"
Startup="Application_Startup" Exit="Application_Exit"
DispatcherUnhandledException="Application_Dispatcher...
<Application.Resources></Application.Resources>
</Application>
--コード ビハインド
private void Application_Startup(object sender, StartupE...
System.Diagnostics.Debug.WriteLine("開始処理");
}
private void Application_DispatcherUnhandledException(
object sender, System.Windows.Threading.DispatcherUnha...
System.Diagnostics.Debug.WriteLine("エラー処理");
}
private void Application_Exit(object sender, ExitEventAr...
System.Diagnostics.Debug.WriteLine("終了処理");
}
-参考
--MSDN > .NET Frameworkクラス ライブラリ > System.Windows...
---> Startupイベント~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
---> DispatcherUnhandledExceptionイベント~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
---> Exitイベント~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
***Application.Propertiesプロパティ [#w557dfc3]
-[[WPF]]ではASP.NETなどのWebアプリケーションと同様のSessi...
Key - Valueストアとして、Application.Properties プロパテ...
-以下のサンプルで、任意の個所で(画面間を跨って)~
Application.Propertiesプロパティが取得できることを確認で...
--Application.xaml.cs
---XAML
private void Application_Startup(object sender, StartupE...
Application.Current.Properties["Key"] = "Value1";
}
--Window1.xaml.cs
---XAML
<Window x:Class="WpfApplication1.Window1"
・・・
Loaded="Window_Loaded">
<Grid>
<Button Click="Button_Click">ボタン</Button>
</Grid>
---コード ビハインド
private void Window_Loaded(object sender, RoutedEventArg...
MessageBox.Show((string)Application.Current.Properties...
Application.Current.Properties["Key"] = "Value2";
}
private void Button_Click(object sender, RoutedEventArgs...
Window2 w2 = new Window2();
w2.Show();
}
--Window2.xaml.cs
---コード ビハインド
private void Window_Loaded(object sender, RoutedEventArg...
MessageBox.Show((string)Application.Current.Properties...
}
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Application.Propertiesプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.ap...
**Window画面 [#y123c6bc]
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Windowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
***ウィンドウの起動 [#ye034fea]
[[WPF]]では[[Windows Forms]]と同様にWindow 画面を、以下の...
-モードレス(通常画面)の起動~
モードレス(通常画面)として起動。
Window2 win2 = new Window2();
win2.Show();
-モーダル ダイアログの起動~
モーダル ダイアログとして起動。
Window2 win2 = new Window2();
win2.Owner = this;
win2.ShowDialog();
***プロパティ [#o7a9e70b]
Windowには、以下のようなプロパティを設定できる。
-Title~
Window.Title プロパティは、ウィンドウのタイトルを取得 / ...
-WindowStartUpLocation~
Window. WindowStartUpLocation プロパティは、~
ウィンドウ起動時の表示位置を取得 / 設定する。
-ResizeMode~
Window. ResizeMode プロパティは、ウィンドウの~
サイズ変更モードを取得 / 設定する(ResizeMode 列挙体)。
-WindowStyle~
Window. WindowStyle プロパティは、~
ウィンドウの境界線スタイルを取得 / 設定する。
-ShowInTaskbar~
Window. ShowInTaskbar プロパティは、~
タスクバーのアイコンの表示・非表示を取得 / 設定する。
-参考
--MSDN > .NET Frameworkクラス ライブラリ > System.Windows...
---> Titleプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> WindowStartupLocationプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> ResizeModeプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> WindowStyleプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
---> ShowInTaskbarプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.wi...
**ナビゲーション フレームワーク [#cb2f10e1]
-[[WPF]] / [[Silverlight]]では「ナビゲーション フレームワ...
WWWブラウザの単一ウィンドウ、複数ページから構成される画面...
-この機能は、「ナビゲーション フレームワーク」のNavigatio...
ウィザードや、ハイパー テキスト ソリューションに有用であ...
-なお、以下のような機能もサポートされている。
--WWWブラウザ型の単一ウィンドウ、複数ページから構成される...
--WWWブラウザ同様、画面遷移の履歴が残り[進む]・[戻る]操作...
--ハイパーリンクによる画面遷移、HTTPコンテンツの参照をサ...
-以下、NavigationWindow / Pageの使用方法を説明する。
***NavigationWindow画面を作成 [#q77831fb]
-[[WPF]]の場合、初めに、NavigationWindow (を継承した)画...
-なお、NavigationWindowは、Windowクラスを継承するため、前...
-コード
--XAML
<NavigationWindow x:Class="WpfApplication1.NavWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="NavWindow" Height="300" Width="300">
</NavigationWindow>
--コード ビハインド
public partial class NavWindow : NavigationWindow {
public NavWindow() {
InitializeComponent();
}
}
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Navigation.NavigationWindowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
***NavigationWindow画面を起動 [#zcc2c387]
[[WPF]]でNavigationWindow画面を起動する方法について説明す...
-モードレス(通常画面)~
NavigationWindow画面をモードレス(通常画面)として起動で...
なお、ApplicationオブジェクトのStartupUri属性から直接起動...
NavWindow normalWindow = new NavWindow();
normalWindow.Show();
-モーダル ダイアログ~
NavigationWindow画面をモーダル ダイアログとして起動するこ...
NavWindow dialogWindow = new NavWindow();
dialogWindow.Owner = this;
bool returnValue = dialogWindow.ShowDialog() ?? false;
***Page画面のロード (1) [#cfddd8c0]
-[[WPF]]でNavigationWindow画面から、Page 画面をロードする...
-なお、PageはFrameworkElementからの派生クラスであって、~
NavigationWindow・Frame コントロールでのみホスト・ナビゲ...
-Page 画面をロードする方法
--Loadedイベントからロード~
NavigationWindow画面のコード ビハインドのLoadedイベントか...
---XAML
<NavigationWindow x:Class="WpfApplication1.NavWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="NavWindow" Height="300" Width="300" Loaded="N...
</NavigationWindow>
---コード ビハインド
public partial class NavWindow : NavigationWindow {
public NavWindow() {
InitializeComponent();
}
private void NavigationWindow_Loaded(object sender, Ro...
// Page1 を表示します。
this.Navigate(new Page1());
}
}
--Sourceプロパティからロード~
NavigationWindow画面のSourceプロパティに指定してPage画面...
---XAML
<NavigationWindow x:Class="WpfApplication1.NavWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="NavWindow" Height="300" Width="300" Source="Pag...
</NavigationWindow>
--Frameコントロールからロード~
Page内を複数のFrameに分割し、その中に複数のページをロード...
---XAML
<StackPanel Orientation="Vertical">
<Frame Source="Page2.xaml" Navigated="Frame1_Navigated...
<Frame Source="Page3.xaml" Navigated="Frame2_Navigated...
</StackPanel>
--StartupUri属性からロード~
[[ApplicationオブジェクトのStartupUri属性から直接Page画面...
(もしくは、[[前述のApplication.Startupイベント>#r4f6dfc7...
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Controls.Frameクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---> System.Windows.Navigation.NavigationWindowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
***Page画面のロード (2) [#yc0b57e1]
「[[XBAP]]」、「[[Silverlight]]」では、WindowNavigation /...
-[[XBAP]]~
ApplicationオブジェクトのStartupUri属性から直接Page画面を...
<Application x:Class="WpfBrowserApplication1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Page1.xaml">
<Application.Resources>
</Application.Resources>
</Application>
-[[Silverlight]]~
ApplicationオブジェクトのStartupUri属性がサポートされない...
Application.StartupイベントからPage画面をロードする。
--XAML
<Application xmlns="http://schemas.microsoft.com/winfx/2...
xmlns:x="http://schemas.microsoft.com/winfx...
x:Class="SilverlightApplication1.App">
<Application.Resources>
</Application.Resources>
</Application>
--コード ビハインド
public App(){
this.Startup += this.Application_Startup;
this.Exit += this.Application_Exit;
this.UnhandledException += this.Application_UnhandledE...
InitializeComponent();
}
private void Application_Startup(object sender, StartupE...
// this.RootVisual = new MainPage(); デフォルトは、ユ...
this.RootVisual = new Page1();
}
>なお、「[[Silverlight]]」では、~
デフォルトの初期画面(Application.RootVisual)が、ユーザ ...
通常、ユーザ コントロールにFrameを追加し、Frameでページ遷...
***Page画面の画面遷移 [#gd2f5a43]
[[WPF]] / [[Silverlight]]におけるPage画面の画面遷移方法に...
-Hyperlinkタグによる画面遷移
--[[WPF]]のPage画面では、Hyperlinkタグ使用して、画面遷移...
※ なお、Hyperlinkタグは、TextBlockタグなどで囲う必要があ...
<Hyperlink NavigateUri="Page2.xaml">次のページへ移動しま...
<Hyperlink NavigateUri="Page1.xaml">前のページへ移動しま...
--[[Silverlight]]のPage画面では、HyperlinkButtonタグ使用...
<HyperlinkButton NavigateUri="/Page2.xaml">次のページへ...
<HyperlinkButton NavigateUri="/Page1.xaml">前のページへ...
-コードビハインドからの画面遷移~
コード ビハインドからの画面遷移も可能である。
--[[WPF]]の場合は、Page画面を直接生成可能である。
this.NavigationService.Navigate(new Page2());
--[[Silverlight]]の場合は、Page画面をUriで指定する必要が...
---以下は、相対パス指定:
this.NavigationService.Navigate(new Uri("/Page2.xaml", U...
---以下は、絶対パス指定:
this.NavigationService.Navigate(
new Uri("pack://application:,,,/Page2.xaml", UriKin...
***Page画面の進む・戻る操作への対応 [#jc2ad1b0]
-[[WPF]] / [[Silverlight]]では、WWWブラウザ同様、進む・戻...
進む・戻る操作に対応している(Webアプリケーションと同様に...
-「[[XBAP]]」、「[[Silverlight]]」については、この進む・...
#ref(NavigationServiceGoForwardAndGoBack.png,left,nowrap,...
-コードビハインドからの進む・戻る操作~
コードビハインドからは、次の処理で進む・戻る操作に対応で...
--進む
this.NavigationService.GoForward();
--戻る
this.NavigationService.GoBack();
-履歴の管理
--進む・戻る操作が行えるということは、画面遷移の履歴を保...
---これを以下のコードで画面遷移のPage履歴を消去できる。
this.NavigationService.RemoveBackEntry();
---Page履歴の消去処理を自動化する場合は、NavigationWindow...
private void NavigationWindow_Navigated(object sender, N...
this.NavigationService.RemoveBackEntry();
}
--「[[XBAP]]」、「[[Silverlight]]」ではNavigationWindowが...
※ Frameを使用しない場合は、PageのLoadedイベントなどで履歴...
private void Frame1_Navigated(object sender, NavigationE...
if (NavigationService !=null) {
if (NavigationService.CanGoBack) {
this.NavigationService.RemoveBackEntry();
}
}
}
private void Frame2_Navigated(object sender, NavigationE...
if (NavigationService != null) {
if (NavigationService.CanGoBack) {
this.NavigationService.RemoveBackEntry();
}
}
}
-なお、Page履歴の管理はブラック ボックスとなっているため、~
詳細は不明であるが、前Pageに戻った際に入力状態が保持され...
Page履歴により、ある程度メモリが消費されているものと考え...
メモリ消費量が拡大するような場合はPage履歴の消去を検討す...
***Page画面の進む・戻る操作の注意点 [#j89c6ca2]
- [新規画面遷移] → [戻る] → [進む]の一連の操作で、表示さ...
必要に応じてこれを考慮した実装とするか、[進む]・[戻る]操...
-再初期化とは?~
コンストラクタや、PageのLoadedイベントの処理の実行
--コンストラクタが実行されるのは、最初のPageのみである。
--LoadedイベントはすべてのPageで実行される。
- [進む]・[戻る]操作を抑止する。~
先頭PageでPage.ShowsNavigationUIプロパティをfalseに設定に...
以降のPageの[進む]・[戻る]ボタンを非表示にするか、前述の...
-[進む]・[戻る]ボタンを非表示にする。
--XAML
<Page x:Class="WpfApplication1.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page1" ShowsNavigationUI="false">
-BackSpaceキーによる[戻る]を抑止
--[進む]・[戻る]ボタンを非表示にする場合もBackSpaceキーで...
--また、UI要素にフォーカスの当たっていない状態では、BackS...
Page.LoadedイベントなどでPage上の入力UI要素にフォーカスを...
---XAML
<Page x:Class="WpfApplication1.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page1" ShowsNavigationUI="false"
Loaded="Page_Loaded" KeyDown="Page_KeyDown">
<StackPanel>
<TextBlock>
<Hyperlink NavigateUri="Page2.xaml">Page2</Hyperli...
</TextBlock>
<TextBox Name="textBox1"/>
</StackPanel>
</Page>
---コード ビハインド
public partial class Page1 : Page {
public Page1() {
InitializeComponent();
}
private void Page_Loaded(object sender, RoutedEventArg...
this.textBox1.Focus();
}
private void Page_KeyDown(object sender, KeyEventArgs ...
if (e.Key == Key.Back) e.Handled = true;
}
}
***その他 [#a491ed54]
NavigationWindow / Pageのその他のトピック
-UriMapperクラス
--UriMapper クラスは「[[Silverlight]]」専用のコントロール...
HyperlinkタグのNavigateUri属性などで使用するPage.xamlへの...
--UriMapperクラスは複数のUriMapping クラスから構成され、~
UriMappingクラスのMappedUriプロパティに実際のPage.xamlへ...
Uriプロパティに簡素化したパス(のパターン)を指定する。
--作成したUriMapperオブジェクトをFrame.UriMapperプロパテ...
追加することで、Frame内で簡素化したパスを使用することがで...
-ChildWindowコントロール
--ChildWindow コントロールは、「[[Silverlight]]」専用のコ...
Page上に、子ウィンドウ(モーダル ダイアログ相当)を表示で...
--「[[Silverlight]]」アプリケーションのプロジェクトでは、~
ChildWindowのクラステンプレートが用意されており、~
これを新規作成し、以下のコードでChildWindowを呼び出すこと...
--ChildWindowは、若干のアニメーションのエフェクトを伴い表...
また、ChildWindowから、さらに子のChildWindowを表示させる...
ChildWindow1 childWindow = new ChildWindow1();
childWindow.Show();
-注意事項~
なお、NavigationWindow / Pageの使用における注意点は、以下...
--「[[XBAP]]」の場合の[[注意点>XBAP#cc3b3e1b]]
--「[[Silverlight]]」の場合の[[注意点>Silverlight]]
-ナビゲーション フレームワーク 参考情報
--MSDN > Silverlight > アプリケーション モデルとプログラ...
---> アプリケーション モデル > ナビゲーションの概要~
http://msdn.microsoft.com/ja-jp/library/cc838245.aspx#app...
--@IT > Insider.NET > 連載:Silverlight 3実践プログラミ...
---> ナビゲーション・フレームワークとChildWindowコントロ...
1. ナビゲーション・フレームワークとは~
http://www.atmarkit.co.jp/fdotnet/chushin/silverlight3dev...
--CodeZine > Silverlight 3徹底入門
---> Silverlight 3で作る業務アプリケーションの要 > 「ナビ...
http://codezine.jp/article/detail/4810
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> System.Windows.Navigation.UriMapperクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
---> System.Windows.Navigation.UriMappingクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.na...
--->System.Windows.Controls.ChildWindowクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
**Win32ダイアログ [#m8eadb88]
-[[WPF]] / [[Silverlight]]は、従来からの種々のWin32ダイア...
-このため、[[WPF]] / [[Silverlight]]アプリケーションであ...
「外観や、操作方法の異なる標準ダイアログに慣れる必要があ...
***メッセージ ボックス [#u8a19670]
下記のMessageBoxクラスの名前空間は、[[Windows Forms]]では...
このMessageBoxクラスのクラス階層を確認すると[[WPF]]のアー...
-MSDN > .NET Frameworkクラス ライブラリ > System.Windows....
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
-MSDN > Silverlightの.NET Frameworkクラス ライブラリ > Sy...
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
***コモン ダイアログ ボックス [#j9729fdc]
-OpenFileDialog クラス
--OpenFileDialogは、部分信頼で実行されている。
--「[[XBAP]]」・「[[Silverlight]]」でもファイル名を取得で...
-SaveFileDialog クラス
--SaveFileDialogは、部分信頼で実行されている。
--「[[XBAP]]」・「[[Silverlight]]」でもファイルを保存でき...
-PrintDialog クラス
---このクラスの名前空間は、[[Windows Forms]]ではなく[[WPF...
クラス階層を確認するとWPFのアーキテクチャに基づいていない...
---Silverlightでは、Printdocument クラス
-参考
--MSDN > .NET Frameworkクラス ライブラリ
---> Microsoft.Win32.OpenFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/microsoft.win32.o...
---> Microsoft.Win32.SaveFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/microsoft.win32.s...
---> System.Windows.Controls.PrintDialogクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
--MSDN > Silverlightの.NET Frameworkクラス ライブラリ
---> System.Windows.Controls.OpenFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---> System.Windows.Controls.SaveFileDialogクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---> System.Windows.Printing.PrintDocumentクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.pr...
--MSDN > Windows Presentation Foundation > ドキュメント
---> 印刷および印刷システムの管理 > 印刷の概要~
http://msdn.microsoft.com/ja-jp/library/ms742418(VS.80).a...
***カスタム ダイアログ ボックス [#r16cb2d2]
-[[前述の、モーダル ダイアログの起動>#ye034fea]]を参照の...
-「[[XBAP]]」では使用できないので注意する。
-なお、「[[Silverlight]]」の場合は、前述のChildWindowコン...
***参考 [#qe69230a]
-MSDN > Windows Presentation Foundation
--> アプリケーション開発 > WPFウィンドウ > ダイアログ ボ...
http://msdn.microsoft.com/ja-jp/library/aa969773.aspx
--> 移行と相互運用性 > Windowsフォーム コントロールおよび...
http://msdn.microsoft.com/ja-jp/library/ms750559.aspx
-MSDN > Silverlight
--> コントロールおよびダイアログ ボックスの使用 > ダイア...
http://msdn.microsoft.com/ja-jp/library/ff382752(VS.95).a...
*入力支援 [#j81696d4]
入力支援機能に関する技術要素について説明する。
**メニュー・タスクバーとコマンド [#p7757f04]
-メニュー・タスクバーと「コマンド」の関連付けも、宣言的プ...
-例えば、以下のXAMLでメニュー・タスクバーと「コマンド」の...
また、メニュー・タスクバーと「コマンド」の関連付けが容易...
***実装 [#r1e0aba4]
-画面
#ref(Menu_Taskbar_Command.png,left,nowrap,メニュー・タス...
-XAML
<Window.CommandBindings>
<!--ApplicationCommands.Saveのカスタム動作(実行可否、...
<CommandBinding x:Name="SaveCommand"
Command="ApplicationCommands.Save"
CanExecute="SaveCommand_CanExecute"
Executed="SaveCommand_Executed"/>
<!--ApplicationCommands.Closeのカスタム動作(実行可否...
<CommandBinding x:Name="CloseCommand"
Command="ApplicationCommands.Close"
CanExecute="CloseCommand_CanExecute"
Executed="CloseCommand_Executed"/>
</Window.CommandBindings>
<DockPanel>
<Menu DockPanel.Dock="Top">
<MenuItem Header="ファイル(_F)">
<!--ApplicationCommands.Save → カスタム動作 → Comm...
<MenuItem Header="保存(_S)" Command="ApplicationCo...
<MenuItem.Icon><Image Source=".\icons\save.png"/...
</MenuItem>
<Separator/>
<!--ApplicationCommands.Close → カスタム動作 → Com...
<!--MenuItem Header="終了(_X)" Command="Applicatio...
<!--ApplicationCommands.Close → カスタム動作 → カ...
<MenuItem Name="Exit" Click="Exit_Click" Header="...
<MenuItem.Icon><Image Source=".\icons\exit.png"/...
</MenuItem>
</MenuItem>
<MenuItem Header="編集(_E)">
<!--ApplicationCommands.Undo → フォーカスのあるコ...
<MenuItem Header="元に戻す(_U)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\undo.png"/...
</MenuItem>
<!--ApplicationCommands.Redo → フォーカスのあるコ...
<MenuItem Header="やり直し(_R)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\redo.png"/...
</MenuItem>
<Separator/>
<!--ApplicationCommands.Cut → フォーカスのあるコン...
<MenuItem Header="切り取り(_T)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\cut.png"/>...
</MenuItem>
<!--ApplicationCommands.Copy → フォーカスのあるコ...
<MenuItem Header="コピー(_C)" Command="Application...
<MenuItem.Icon><Image Source=".\icons\copy.png"/...
</MenuItem>
<!--ApplicationCommands.Paste → フォーカスのあるコ...
<MenuItem Header="貼り付け(_P)" Command="Applicati...
<MenuItem.Icon><Image Source=".\icons\paste.png"...
</MenuItem>
<!--ApplicationCommands.Delete → フォーカスのある...
<MenuItem Header="削除(_D)" Command="ApplicationCo...
<MenuItem.Icon><Image Source=".\icons\delete.png...
</MenuItem>
<MenuItem Header="配置(_A)">
<!--EditingCommands.AlignLeft → フォーカスのある...
<MenuItem Header="左揃え" Command="EditingComman...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
<!--EditingCommands.AlignCenter → フォーカスのあ...
<MenuItem Header="中央揃え" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
<!--EditingCommands.AlignRight → フォーカスのあ...
<MenuItem Header="右揃え" Command="EditingComman...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
<!--EditingCommands.AlignJustify → フォーカスの...
<MenuItem Header="両端揃え" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_ali...
</MenuItem>
</MenuItem>
<MenuItem Header="スタイル(_S)">
<!--EditingCommands.ToggleBold → フォーカスのあ...
<MenuItem Header="太字" Command="EditingCommands...
<MenuItem.Icon><Image Source=".\icons\text_bol...
</MenuItem>
<!--EditingCommands.ToggleItalic → フォーカスの...
<MenuItem Header="斜体" Command="EditingCommands...
<MenuItem.Icon><Image Source=".\icons\text_ita...
</MenuItem>
<!--EditingCommands.ToggleUnderline → フォーカス...
<MenuItem Header="下線" Command="EditingCommands...
<MenuItem.Icon><Image Source=".\icons\text_und...
</MenuItem>
<!--EditingCommands.ToggleBullets → フォーカスの...
<MenuItem Header="箇条書き" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_lis...
</MenuItem>
<!--EditingCommands.ToggleNumbering → フォーカス...
<MenuItem Header="段落番号" Command="EditingComm...
<MenuItem.Icon><Image Source=".\icons\text_lis...
</MenuItem>
<!--EditingCommands.IncreaseIndentation → フォー...
<MenuItem Header="インデントを増やす" Command="E...
<MenuItem.Icon><Image Source=".\icons\text_ind...
</MenuItem>
<!--EditingCommands.DecreaseIndentation → フォー...
<MenuItem Header="インデントを減らす" Command="E...
<MenuItem.Icon><Image Source=".\icons\text_ind...
</MenuItem>
</MenuItem>
<MenuItem Header="テキスト(_T)">
<!--EditingCommands.IncreaseFontSize → フォーカ...
<MenuItem Header="フォントの拡大" Command="Editi...
<!--EditingCommands.DecreaseFontSize → フォーカ...
<MenuItem Header="フォントの縮小" Command="Editi...
</MenuItem>
</MenuItem>
<MenuItem Header="ヘルプ(_H)">
<!--RoutedCommandをコードビハインドから自作しカス...
<MenuItem Header="バージョン情報(_A)" Name="About">
<MenuItem.Icon><Image Source=".\icons\about.png"...
</MenuItem>
</MenuItem>
</Menu>
<ToolBarTray DockPanel.Dock="Top">
<ToolBar Header="編集:">
<Button ToolTip="元に戻す" Command="ApplicationCom...
<Image Source=".\icons\undo.png" Stretch="Fill"/...
<Button ToolTip="やり直し" Command="ApplicationCom...
<Image Source=".\icons\redo.png" Stretch="Fill"/...
<Button ToolTip="切り取り" Command="ApplicationCom...
<Image Source=".\icons\cut.png" Stretch="Fill"/>...
<Button ToolTip="コピー" Command="ApplicationComma...
<Image Source=".\icons\copy.png" Stretch="Fill"/...
<Button ToolTip="貼り付け" Command="ApplicationCom...
<Image Source=".\icons\paste.png" Stretch="Fill"...
<Button ToolTip="削除" Command="ApplicationCommand...
<Image Source=".\icons\delete.png" Stretch="Fill...
</Button>
</ToolBar>
<ToolBar Header="配置:">
<Button ToolTip="左揃え" Command="EditingCommands....
<Image Source=".\icons\text_align_left.png" Stre...
<Button ToolTip="中央揃え" Command="EditingCommand...
<Image Source=".\icons\text_align_center.png" St...
<Button ToolTip="右揃え" Command="EditingCommands....
<Image Source=".\icons\text_align_right.png" Str...
<Button ToolTip="両端揃え" Command="EditingCommand...
<Image Source=".\icons\text_align_justify.png" S...
</ToolBar>
<ToolBar Header="スタイル:">
<Button ToolTip="太字" Command="EditingCommands.To...
<Image Source=".\icons\text_bold.png" Stretch="F...
<Button ToolTip="斜体" Command="EditingCommands.To...
<Image Source=".\icons\text_italic.png" Stretch=...
<Button ToolTip="下線" Command="EditingCommands.To...
<Image Source=".\icons\text_underline.png" Stret...
<Button ToolTip="箇条書き" Command="EditingCommand...
<Image Source=".\icons\text_list_bullets.png" St...
<Button ToolTip="段落番号" Command="EditingCommand...
<Image Source=".\icons\text_list_numbers.png" St...
<Button ToolTip="インデントを増やす" Command="Edit...
<Image Source=".\icons\text_indent.png" Stretch=...
<Button ToolTip="インデントを減らす" Command="Edit...
<Image Source=".\icons\text_indent_remove.png" S...
</ToolBar>
</ToolBarTray>
<RichTextBox DockPanel.Dock="Top" Width="Auto" Height=...
IsDocumentEnabled="True" AcceptsTab="True" FontSize=...
<RichTextBox DockPanel.Dock="Top" Width="Auto" Height=...
IsDocumentEnabled="True" AcceptsTab="True" FontSize=...
</DockPanel>
-コード ビハインド
/// <summary>Window1.xaml の相互作用ロジック</summary>
public partial class Window1 : Window {
public Window1() {
InitializeComponent();
// UIElementにRoutedCommandをバインドし、メニューに...
InitRoutedCommands_about();
}
// AboutCommand(カスタムのRoutedCommand)
public static readonly RoutedCommand AboutCommand = ne...
private void InitRoutedCommands_about() {
// CommandBindingの生成
CommandBinding binding =
new CommandBinding(AboutCommand, AboutCommand_Exec...
// UIElementにRoutedCommandをバインド
this.CommandBindings.Add(binding);
// メニューに関連付け
About.Command = AboutCommand;
}
// 【情報メニュー+コマンド】UIElementにRoutedCommand...
private void AboutCommand_CanExecute(object sender, Ca...
e.CanExecute = true;
}
// 【情報メニュー+コマンド】UIElementにRoutedCommand...
private void AboutCommand_Executed(object sender, Exec...
// 情報表示処理
}
// 【保存メニュー+コマンド】UIElementにRoutedCommand...
private void SaveCommand_CanExecute(object sender, Can...
e.CanExecute = true;
}
// 【保存メニュー+コマンド】UIElementにRoutedCommand...
private void SaveCommand_Executed(object sender, Execu...
// 保存処理
}
// 【終了メニュー+コマンド】UIElementにRoutedCommand...
private void CloseCommand_CanExecute(object sender, Ca...
e.CanExecute = true;
}
// 【終了メニュー+コマンド】UIElementにRoutedCommand...
private void CloseCommand_Executed(object sender, Exec...
this.Close();
}
// 【終了メニュー】メニューのクリックイベントのみの実...
private void Exit_Click(object sender, RoutedEventArgs...
this.Close();
}
}
***説明 [#pd837bfb]
-メニュー・タスクバーと「コマンド」の関連付け
--MenuItem
---MenuItem(MenuItem クラス)は入れ子が可能であり、
---MenuItemのアクセスキーは、MenuItemクラスのHeader属性に...
「英数字」と設定することで(英数字の先頭文字をアクセスキ...
---また、MenuItemからはCommand属性を指定して指定の「Comma...
--ToolBarTray
---ToolBarTray には、を格納でき、ToolBarにはButtonを格納...
---Buttonからは指定の「Command」を発生させることができる。
---ToolBarTray内のToolBarは、実行時にD&Dにて配置を変更で...
--Command
---これらのコントロールから発生させた「Command」は、フォ...
---CommandTarget="{Binding ElementName=要素名}"という記述...
---対象のコントロールは、各種RoutedCommand クラスのCanExe...
発生させるイベントを処理するイベント ハンドラを実装してい...
-標準コマンド
--標準コマンド(ApplicationCommands, EditingCommands, etc...
---「コマンド」に対応する処理のUOCは不要であり、既定の処...
---また、「コマンド」には、既定のショートカットも割り当て...
--コントロールの実装する標準コマンド(上記サンプルでは、A...
---「コマンド」に対応したイベント ハンドラのUOCをUIElemen...
---標準コマンドのカスタム処理の定義・実装には、標準コマン...
ApplicationCommands.CanExecute、Executeが発生させるカスタ...
---また、上記の方式は、カスタム コマンド(RoutedCommand)...
--その他にも、以下の標準コマンドがSystem.Windows.Input名...
---ComponentCommands
---MediaCommands
---NavigationCommands
***参考 [#v7fadce9]
-MSDN
--Windows Presentation Foundation > コントロール > メニュ...
http://msdn.microsoft.com/ja-jp/library/ms747430.aspx
--.NET Frameworkクラス ライブラリ
---System.Windows.Controls.MenuItemクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---System.Windows.Controls.ToolBarTrayクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---System.Windows.Controls.ToolBarクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.co...
---System.Windows.Input.RoutedCommandクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
---System.Windows.Input.ApplicationCommandsクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
---System.Windows.Documents.EditingCommandsクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.do...
**ツールチップ [#bd8125d8]
-WPFでは、「ツールチップ」を任意のUIコントロールに設定可...
-これにはFrameworkElement、FrameworkContentElementにToolT...
***実装 [#p041613d]
-画面
#ref(Tooltip.png,left,nowrap,ツールチップ)
-XAML
--UserControl
<UserControl x:Class="WpfApplication1.UserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr...
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="250" Height="120">
<StackPanel>
<TextBlock Margin="4,4,4,4" Text="タイトル"
TextWrapping="Wrap" FontWeight="Bold" FontSize="14...
<Path Width="Auto" Height="1"
Fill="Black" Stretch="Fill"
Stroke="Black" Data="M20,45 L250,45"
Margin="4,4,4,4"/>
<TextBlock Margin="4,4,4,4" Text="説明文"
TextWrapping="Wrap"/>
</StackPanel>
</UserControl>
--Window
<Window x:Class="WpfApplication1.Window1"
・・・
xmlns:my="clr-namespace:WpfApplication1"
・・・>
・・・
<RichTextBox DockPanel.Dock="Top" Width="Auto" Height="1...
IsDocumentEnabled="True" AcceptsTab="True" ...
<RichTextBox.ToolTip>
<ToolTip>
<my:UserControl1/>
</ToolTip>
</RichTextBox.ToolTip>
</RichTextBox>
***説明 [#lbcc9016]
このToolTipプロパティには、ToolTip属性に直接文字列で説明...
「プロパティ要素構文」を使用して、説明文などの文字列だけ...
例えば、以下は、ユーザ コントロールを使用してToolTipを表...
***参考 [#j60feaeb]
-MSDN > .NET Frameworkクラス ライブラリ
--System.Windows.FrameworkElement.ToolTipプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.do...
--System.Windows.FrameworkContentElement.ToolTipプロパティ~
http://msdn.microsoft.com/ja-jp/library/system.windows.fr...
**IME制御 [#e48a4e9d]
-WPF / Silverlightでは、InputMethod クラスを利用すること...
-ただし、
--IME2003以外では、IMEのオン・オフの切り替え(ひらがな ⇔ ...
--入力モードの切り替え(カタカナ ⇔ 全角英字など)はできな...
-切り替え方法
--IMEオン・オフ
---InputMethod.SetIsInputMethodEnabledメソッド
---InputMethod.Current.ImeStateプロパティ
--入力モード
---InputMethod.SetPreferredImeConversionModeメソッド
---InputMethod.Current.ImeConversionModeプロパティ
***実装 [#h5db94a5]
以下は、IME制御のサンプルである。
-画面
#ref(IME-Control.png,left,nowrap,IME制御)
-XAML~
イベント ハンドラでIME制御する方法と、XAMLでIME制御する方...
--イベント ハンドラでIME制御
<StackPanel Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="制御なし:"/>
<TextBox Name="textBox0" Height="23" Width="120"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Text="以下、イベントで制御"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="OFF:"/>
<TextBox Name="textBox1" Height="23" Width="120"
GotFocus="textBox1_GotFocus" LostFocus="textBox1_L...
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="ON:"/>
<TextBox Name="textBox2" Height="23" Width="120"
GotFocus="textBox2_GotFocus" LostFocus="textBox2_L...
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="全角片仮名:...
<TextBox Name="textBox3" Height="23" Width="120"
GotFocus="textBox3_GotFocus" LostFocus="textBox3_L...
</StackPanel>
--XAMLでIME制御
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Text="以下、XAMLで制御"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="OFF:"/>
<TextBox Name="textBox4" Height="23" Width="120"
InputMethod.PreferredImeState="Off"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="ON:"/>
<TextBox Name="textBox5" Height="23" Width="120"
InputMethod.PreferredImeState="On"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Height="23" Width="80" Text="半角片仮名:...
<TextBox Name="textBox6" Height="23" Width="120"
InputMethod.PreferredImeState="On" InputMethod.Pre...
</StackPanel>
</StackPanel>
-コード ビハインド~
下記はイベント ハンドラによるIME制御である。
/// <summary>Window1.xaml の相互作用ロジック</summary>
public partial class Window1 : Window {
public Window1() {
InitializeComponent();
}
InputMethodState ims = InputMethodState.DoNotCare;
ImeConversionModeValues imc = ImeConversionModeValues....
private void textBox1_GotFocus(object sender, RoutedEv...
ims = InputMethod.Current.ImeState;
InputMethod.Current.ImeState = InputMethodState.Off;
}
private void textBox1_LostFocus(object sender, RoutedE...
InputMethod.Current.ImeState = ims;
}
private void textBox2_GotFocus(object sender, RoutedEv...
ims = InputMethod.Current.ImeState;
InputMethod.Current.ImeState = InputMethodState.On;
}
private void textBox2_LostFocus(object sender, RoutedE...
InputMethod.Current.ImeState = ims;
}
private void textBox3_GotFocus(object sender, RoutedEv...
ims = InputMethod.Current.ImeState;
imc = InputMethod.Current.ImeConversionMode;
InputMethod.Current.ImeState = InputMethodState.On;
InputMethod.Current.ImeConversionMode = ImeConversio...
| ImeConversionModeValues.FullShape | ImeConversio...
}
private void textBox3_LostFocus(object sender, RoutedE...
InputMethod.Current.ImeState = ims;
InputMethod.Current.ImeConversionMode = imc;
}
}
***説明 [#of372628]
イベント ハンドラでのIME制御の動作は、~
以下の点が、XAMLによるIME制御の場合と異なる。
-GotFocus、LostFocusイベントを扱っており、~
GotFocusイベントで現状のIME設定を保存し、~
LostFocusイベントでIME設定を復元している。
-このため、入力時のIME設定変更はLostFocusイベントで無効に...
***参考 [#fe6aa6ad]
-MSDN > .NET Frameworkクラス ライブラリ
--System.Windows.Input.InputMethodクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
--System.Windows.Input.InputMethodクラス~
http://msdn.microsoft.com/ja-jp/library/system.windows.in...
-Microsoft Connect|WinXP&IME2003環境で、WPFのTextBoxに...
http://connect.microsoft.com/VisualStudioJapan/feedback/d...
*デザイナ向け機能 [#jb851708]
デザイナ向けの技術要素について説明する。
**様々なシェイプ [#yc5dd22e]
-[[「クラス階層」のVisualクラス>WPFのアーキテクチャ#s4219...
WPF / Silverlightでは、Shape クラスから派生する様々なベク...
-Shapeクラスから派生するベクタ グラフィックス描画クラスに...
--Rectangle クラス~
四角形を描画
--Ellipse クラス~
楕円を描画
--Line クラス~
直線を描画
--Polyline クラス~
一連の直線を描画
--Path クラス~
一連の直線と曲線を描画
***実装 [#q14db6d3]
-ただし、Visual StudioではPath 要素の編集が困難である。~
このためExpression Blendのデザイナでは、[ペン]や[鉛筆]な...
以下は、Expression Blendデザイナの[ペン]や[鉛筆]を使用し...
--画面
#ref(Path.png,left,nowrap,様々なシェイプ(Path),60%)
--XAML
<Grid>
<Path Fill="White" Stretch="Fill" Stroke="Black" Strok...
Data="M208,68 C182.37169,68 155.97712,69 131,69 ・・...
<Path Fill="White" Stretch="Fill" Stroke="Black" Strok...
Data="M88,132 C88,132 87.5,250.5 120.5,234.5 ・・・"/>
</Grid>
-さらに、VSやExpression Blendを用い、Ellipse・TextBlockな...
これをExpression Blendで、これらをPath に変換するといった...
--画面
#ref(EllipseAndTextBlock.png,left,nowrap,様々なシェイプ(...
--XAML
<Grid>
<Viewbox Height="400" Width="400">
<Grid>
<Ellipse Stroke="Black" StrokeThickness="5"
Height="400" Width="400"/>
<TextBlock Text="WPF" FontSize="150"
HorizontalAlignment="Center" VerticalAlignment="...
</Grid>
</Viewbox>
</Grid>
-この変換を行うには、Expression Blend の[オブジェクトとタ...
メニューの[オブジェクト] → [パス] → [複合パスの作成]を選...
--XAML
<Grid>
<Path Data="M397.5,200 C397.5,309.07624 309.07624,397....
</Grid>
***参考 [#i3eb775f]
-MSDN
--System.Windows.Shapes.Shapeクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---MSDNマガジン > 発行物 > 基礎:ベクタ グラフィックスとW...
http://msdn.microsoft.com/ja-jp/magazine/cc337899.aspx
--System.Windows.Shapes.Rectangleクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Ellipseクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Lineクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Polylineクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
--System.Windows.Shapes.Pathクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
---Silverlightの.NET Frameworkクラス ライブラリ ~
http://msdn.microsoft.com/ja-jp/library/system.windows.sh...
**グラデーション [#hda741d1]
WPF / Silverlightでは、様々なグラデーションをデザイン可能。
***実装 [#fe777167]
-簡単なグラデーション~
以下の簡素なグラデーションであれば、XAMLで直接記述するこ...
--画面
#ref(EasyGradation.png,left,nowrap,簡単なグラデーション)
--XAML
<Window.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,...
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Window.Background>
-複雑なグラデーション~
しかし、以下の複雑なグラデーションであれば、~
Expression Blendのデザイナを使用した方が、容易にグラデー...
--画面
#ref(ComplexGradation.png,left,nowrap,複雑なグラデーション)
--XAML
<Window.Background>
<RadialGradientBrush GradientOrigin="0.3,0.3">
<GradientStop Color="Aqua" Offset="0.1"/>
<GradientStop Color="Black" Offset="0.2"/>
<GradientStop Color="Aqua" Offset="0.3"/>
<GradientStop Color="Black" Offset="0.4"/>
<GradientStop Color="Aqua" Offset="0.5"/>
<GradientStop Color="Black" Offset="0.6"/>
<GradientStop Color="Aqua" Offset="0.7"/>
<GradientStop Color="Black" Offset="0.8"/>
<GradientStop Color="Aqua" Offset="0.9"/>
</RadialGradientBrush>
</Window.Background>
**トランスフォーム処理 [#v0a7e63e]
-WPFで2D平面での変換を行う「トランスフォーム処理」を使用...
--「回転、拡大縮小、傾斜、平行移動」
--「アニメーションなど一時効果」
-「トランスフォーム処理」に使用できるクラスには、~
System.Windows.Media名前空間のTransform クラスから派生す...
--MatrixTransform
--RotateTransform
--ScaleTransform
--SkewTransform
--TranslateTransform
--TransformGroup
-なお、TransformGroupを使用すれば、~
複数のTransformクラスを組み合わせて適用することができる。
-以下、下記の図形に対する、上記2つの「トランスフォーム処...
--画面
#ref(PreTransform.png,left,nowrap,トランスフォーム前)
--XAML
<Grid>
<Border Height="100" Width="100" BorderBrush="Black" B...
<Rectangle Height="100" Width="100" Fill="Blue"/>
</Border>
</Grid>
***回転、拡大縮小、傾斜、平行移動 [#eea9fcaa]
-FrameworkElement.LayoutTransformプロパティに設定されたTr...
レイアウト時に「トランスフォーム処理」を実行する。
--このため、「トランスフォーム処理」後もUI要素がレイアウ...
--このような特徴から、この「トランスフォーム処理」は、~
表示を垂直から水平に切り替えたり、ズームしたりするなどの...
-以下は、LayoutTransformプロパティにRotateTransformクラス...
--画面
#ref(AfterLayoutTransform.png,left,nowrap,回転、拡大縮小...
--XAML
<Grid>
<Border Height="100" Width="100" BorderBrush="Black" B...
<Rectangle Height="100" Width="100" Fill="Blue">
<Rectangle.LayoutTransform>
<RotateTransform CenterX="50" CenterY="50" Angle...
</Rectangle.LayoutTransform>
</Rectangle>
</Border>
</Grid>
***アニメーションなど一時効果の追加 [#g7192384]
-UIElement.RenderTransformプロパティに設定されたTransform...
レイアウト後に「トランスフォーム処理」しレンダリングする。
--このため、場合によってはUI要素がレイアウトの描画領域の...
--このような特徴から、この「トランスフォーム処理」は、~
「アニメーション」(後述)と組み合わせるなどしてUI要素に...
-以下は、RenderTransformプロパティにRotateTransformクラス...
--画面
#ref(AfterRenderTransform.png,left,nowrap,アニメーション...
--XAML
<Grid>
<Border Height="100" Width="100" BorderBrush="Black" B...
<Rectangle Height="100" Width="100" Fill="Blue">
<Rectangle.RenderTransform>
<RotateTransform CenterX="50" CenterY="50" Angle...
</Rectangle.RenderTransform>
</Rectangle>
</Border>
</Grid>
※ なお、こちらの「トランスフォーム処理」は「Silverlight」...
***参考 [#z347d280]
-MSDN
--System.Windows.Media.Transformクラス
---.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
---Silverlightの.NET Frameworkクラス ライブラリ~
http://msdn.microsoft.com/ja-jp/library/system.windows.me...
**アニメーション [#x6c21b91]
***実装 [#idce5d4d]
***説明 [#m9ad9bf8]
***参考 [#df9654b1]
*MVVMデザイン パターン [#i380f3a3]
**概要 [#w9210446]
MVVM(Model - View - View Model)モデルとは、~
前述の「データ バインディング」の仕組みを活用したデザイン...
従来の3層デザイン パターンの「モデル オブジェクト」、「...
「バインディング ソース」である「ビュー・モデル オブジェ...
**メリット [#z0b52812]
このデザイン パターンのメリットは、~
「モデル オブジェクト」、「ビュー オブジェクト」間の結合...
「データ バインディング」による「ビュー・モデル オブジェ...
**ガイドライン [#s86bd6d9]
なお、MVVMデザイン パターンのためのガイドライン には、以...
+XAMLで実装できるものは、コードビハインドに実装しない。
+「ビュー・モデル オブジェクト」はDataContextとして「ビュ...
+「ビュー・モデル オブジェクト」と「モデル オブジェクト」...
「データ バインディング」により結合されるため、「ビュー ...
+「ビュー・モデル オブジェクト」は、INotifyPropertyChange...
+「ビュー・モデル オブジェクト」は、「モデル オブジェクト...
「ビュー オブジェクト」から、データ ストレージの複雑さを...
**参考 [#xb7f1d2d]
-MSDNマガジン > 発行物 > Model - View - ViewModelデザイン...
http://msdn.microsoft.com/ja-jp/magazine/dd419663.aspx
-Moving from Windows Applications to WPF - CodeProject~
http://www.codeproject.com/KB/WPF/WPF_with_MVVM.aspx?msg=...
#ref(MVVM.png,left,nowrap,Model - View - ViewModelデザイ...
*バリデーション [#wff8a95a]
-WPFのバリデーション・フレームワークの使い方。
-以下をプロトタイプ開発したので参考にすることができる。
--SampleProgram/UISubsystem/WPF/Validation at master · Op...
https://github.com/OpenTouryoProject/SampleProgram/tree/m...
**単項目のバリデーション [#ob9f2bf4]
https://github.com/OpenTouryoProject/SampleProgram/tree/m...
**一覧のバリデーション [#ad58117e]
https://github.com/OpenTouryoProject/SampleProgram/tree/m...
**フォーカス制御 [#ue997b59]
フォーカス制御については、いろいろ試しているが~
問題が多いので使わない方向で考えた方が良さそう。
----
Tags: [[:.NET開発]], [[:UIサブシステム]], [[:WPF/Silverli...
ページ名: