Mais conteúdo relacionado Semelhante a 60分でわかる!SilverlightとWPFの入力チェック (20) 60分でわかる!SilverlightとWPFの入力チェック1. VSUG DAY 2010 Winter
60分でわかる!
SilverlightとWPFの
入力チェック
グレープシティ株式会社
八巻 雄哉
3. 検証とアクション
検証 アクション
TextBoxに入力された メッセージをToolTipで
値が数値かどうかを 表示する
確認する
VSUG DAY 2010.12.11 3
6. 本セッションのデモを図解
abc@
Customer
TextBox バインディング
オブジェクト
オブジェクト
Text AccountName
プロパティ プロパティ
検証
abc@ abc@
バインディングターゲット バインディングソース
VSUG DAY 2010.12.11 6
7. 検証処理実装方法の種類
Windows
WPF 4 Silverlight 4 Phone OS
7.0
ValidationRuleを継承した
① ✔ - -
カスタムクラス
Exception(例外)によるエラー通知
② ExceptionValidationRule ✔ - -
ValidatesOnExceptions ✔ ✔ ✔
IDataErrorInfoによるエラー通知
③ DataErrorValidationRule ✔ - -
ValidatesOnDataErrors ✔ ✔ -
INotifyDataErrorInfoによるエラー通知
④
ValidatesOnNotifyDataErrors - ✔ -
ValidatesOn***プロパティをTrueに設定した場合、***ValidationRuleを
設定したときと同じ動作となる。 Silverlight 4/Windows Phone OS 7.0には
ValidationRulesプロパティが存在しないため、 必ずValidatesOn***を使用する。
VSUG DAY 2010.12.11 7
10. 2つの検証処理実装場所
②Exception
③IDataErrorInfo
①ValidationRule ④INotifyDataErrorInfo
バインディングターゲット バインディングソース
UI要素 データオブジェクト
依存関係
プロパティ
プロパティ
VSUG DAY 2010.12.11 10
12. ①ValidationRule
<Binding Path="AccountName">
<Binding.ValidationRules>
<local:AccountNameValidationRule/>
</Binding.ValidationRules>
</Binding>
WPF 4
バインディング
TextBox オブジェクト Customer
カスタムValidationRule
Text AccountName
プロパティ ValidationResultを返す プロパティ
VSUG DAY 2010.12.11 12
13. カスタムValidationRule
class AccountNameValidationRule : ValidationRule
{
public override ValidationResult Validate(object value, System.Glob・・・
{
if (string.IsNullOrEmpty((string)value))
{
return new ValidationResult(false, "必須入力項目です。");
}
else if (!Regex.IsMatch((string)value, "^[0-9A-Za-z]{5,12}$"))
{
return new ValidationResult(false, "半角英数字5 文字以上12文字以下で入力
してください。");
}
return ValidationResult.ValidResult;
}
}
WPF 4
VSUG DAY 2010.12.11 13
16. ②Exception
<TextBox Text="{Binding AccountName, ValidatesOnExceptions=
True}"/>
WPF 4 Silverlight 4 Windows Phone OS 7.0
バインディング
TextBox オブジェクト Customer
ValidatesOnExceptions=True AccountName
Text プロパティ
プロパティ 検証処理
例外をスロー
VSUG DAY 2010.12.11 16
17. Exception(例外)によるエラー通知
public string AccountName
{
get { return _accountName; }
set
{
if (string.IsNullOrEmpty((string)value))
{
throw new Exception("必須入力項目です。");
}
else if (!Regex.IsMatch((string)value, "^[0-9A-Za-z]{5,12}$"))
{
throw new Exception("半角英数字5文字以上12文字以下で入力して
ください。");
}
_accountName = value;
}
} WPF 4 Silverlight 4 Windows Phone OS 7.0
VSUG DAY 2010.12.11 17
21. 検証属性を利用した検証処理
カスタムの検証属性
CustomValidationAttribute
DataType列挙体に用意された
ValidationAttribute(検証属性)
DataTypeAttribute
データ型(電話番号など)を指定
特定の列挙体を指定し、値が含まれ
EnumDataTypeAttribute
ることを保証
最小値および最大値の制約を指定
RangeAttribute
RegularExpressionAttribute 正規表現を使用して有効な値を指定
RequiredAttribute 値が必須であることを指定
StringLengthAttribute 最大文字数および最小文字数を指定
VSUG DAY 2010.12.11 21
27. IDataErrorInfoのメンバー
Errorプロパティ
オブジェクトの検証エラーを説明する文字列
を取得。エラーが存在しない場合はnull参照。
Itemプロパティ(インデクサ)
指定されたプロパティの検証エラーを説明す
る文字列を取得。エラーが存在しない場合は
null参照。
VSUG DAY 2010.12.11 27
28. サンプルコード( IDataErrorInfo )
public string this[string columnName]
{
get
{
switch (columnName)
{
case "AccountName":
if (string.IsNullOrEmpty(AccountName))
{
return "必須入力項目です。";
}
else if (!Regex.IsMatch(AccountName, "^[0-9A-Za-z]{5,12}$"))
{
return "半角英数字5文字以上12文字以下で入力してください。";
}
break;
}
return null;
}
}
WPF 4 Silverlight 4
VSUG DAY 2010.12.11 28
31. 検証属性を使用して判定
public string this[string columnName]
{
get
{
var results = new List<ValidationResult>();
if (Validator.TryValidateProperty(
GetType().GetProperty(columnName).GetValue(this,
null), new ValidationContext(this, null, null)
{ MemberName = columnName }, results))
{
return null;
}
return results.First().ErrorMessage;
}
}
WPF 4 Silverlight 4
VSUG DAY 2010.12.11 31
34. ④INotifyDataErrorInfo
<TextBox Text="{Binding AccountName, ValidatesOnNotifyDataE
rrors=True}"/> 既定でTrue
Silverlight 4
バインディング
TextBox オブジェクト Customer
ValidatesOnNotifyDataErrors=True AccountName
Text プロパティ
プロパティ
検証エラー情報の GetErrors
コレクションを返す メソッド
ErrorsChangedイベント
VSUG DAY 2010.12.11 34
35. INotifyDataErrorInfoのメンバー
GetErrorsメソッド
指定されたプロパティの検証、およびオブジェクト
の検証におけるエラー情報(複数可)を取得。エ
ラーが存在しない場合はnull参照。
HasErrorsプロパティ
オブジェクトの検証エラーの有無をBoolean値として
取得
ErrorsChangedイベント
プロパティまたはオブジェクト全体の検証エラーが
変更されたときに発生
VSUG DAY 2010.12.11 35
42. 本セッションのデモを図解
Validation.Errors添付プロパティ
ValidationErrorオブジェクト
“5文字以上12文字以下です。”
ValidationErrorオブジェクト
“半角英数字のみ使用できます。”
Customer
TextBox バインディング
オブジェクト
オブジェクト
Text AccountName
プロパティ プロパティ
検証
abc@ abc@
バインディングターゲット バインディングソース
VSUG DAY 2010.12.11 42
43. 検証アクション実装方法の種類
Validation.Errors添付プロパティの値に
応じて、各種検証アクションのための仕
組みが動作する
WPF Silverlight Windows
Phone OS 7.0
a. ErrorTemplate ✔ - -
b. ValidationStates ✔ ✔ ✔
既定ではVisualStateは定義 既定で定義されている
(VSM) されていない VisualStateは空
c. HasError
✔ ✔ ✔
添付プロパティ
(プロパティトリ
✔ - -
ガー)
✔ ✔ ✔
d. イベント Validation.Error FrameworkElement.Bindi FrameworkElement.Bindi
添付イベント ngValidationErrorイベント ngValidationErrorイベント
VSUG DAY 2010.12.11 43
46. a. ErrorTemplate添付プロパティ
Validation.ErrorTemplate(ControlTemplate型)
デフォルトのErrorTemplate
<Validation.ErrorTemplate>
<ControlTemplate>
<Border BorderBrush="#FFFF0000" BorderThickness="1,1,1,1">
<AdornedElementPlaceholder />
</Border>
</ControlTemplate>
</Validation.ErrorTemplate>
WPF 4
AdornedElementPlaceholderはErrorTemplateが
適用される要素(今回の場合TextBox)を表す
VSUG DAY 2010.12.11 46
49. b. VisualStateManager(VSM)
動的な外観状態と、その外観状態に遷移する
条件や遷移にかかる時間を管理する一連の機能
を提供するのがVSM
ValidationStates(VisualStateGroup)
Errors添付 VisualState 説明
プロパティ
空 Valid コントロールが有効
InvalidFocused フォーカスがある状態で、コントロールが
無効
空でない
InvalidUnfocused フォーカスがない状態で、コントロールが
無効
“見た目”を決めるコントロール・テンプレート - @IT
http://www.atmarkit.co.jp/fdotnet/vblab/uiframework_04/uiframework_04_03.html
VSUG DAY 2010.12.11 49
53. c. HasError添付プロパティ(プロパティトリガー)
Validation.HasError
ValidationErrorが存在する場合はTrue
<Style TargetType="TextBox">
<Style.Triggers>
<Trigger Property="Validation.HasError" Value="True">
<Setter Property="ToolTip"
Value="{Binding RelativeSource={RelativeSource Self},
Path=(Validation.Errors)[0].ErrorContent}"/>
<Setter Property="Background" Value="Red"/>
</Trigger>
</Style.Triggers>
</Style>
WPF 4
VSUG DAY 2010.12.11 53
54. Silverlightのドキュメントより抜粋
WPFでは、プロパティトリガーによってデータ検証が実
行される場合があります。その場合、
Validation.HasErrorは、TriggerのProperty属性値を
チェックするためのプロパティ条件として使用されます。
このようなイベントハンドラーは、コード中のオブジェ
クトのValidation.HasError添付プロパティをチェック
することができますが、通常はGetHasErrorメソッドを
呼び出すか、またはHasErrorProperty識別子を使用し
て GetValue メソッドを呼び出します。
BindingValidationErrorイベントのハンドラーは、通常、
検証を行うためにそのロジックの一部として特定の
VisualStateに変更されます。
VSUG DAY 2010.12.11 54
55. d. イベント
WPF 4 Silverlight 4 Windows Phone OS 7.0
VSUG DAY 2010.12.11 55
56. d. イベント
WPF 4
Validation.Error添付イベント
Silverlight 4/Windows Phone OS 7.0
FrameworkElement.BindingValidationErrorイベント
ValidationErrorが追加/削除された際に
発生するイベント
Binding.NotifyOnValidationErrorプロパティを
Trueに設定する必要あり
これらのイベントはルーティングイベント
(バブル)となっているため、親要素の
イベントハンドラーで通知を受け取ることが可能
VSUG DAY 2010.12.11 56
57. d. イベント
イベントの引数ValidationErrorEventArgsに
含まれているActionプロパティ
ValidationErrorEventAction.Added
新しいValidationErrorオブジェクトが検出された
ValidationErrorEventAction.Removed
既存のValidationErrorが削除された
if (e.Action == ValidationErrorEventAction.Added)
{
// 検証エラーが発生した時の処理
}
else if (e.Action == ValidationErrorEventAction.Removed)
{
//検証エラーがなくなった時の処理
}
WPF 4 Silverlight 4 Windows Phone OS 7.0
VSUG DAY 2010.12.11 57
59. まとめ
検証
① ValidationRule
② Exception
③ IDataErrorInfo
④ INotifyDataErrorInfo
アクション
a. ErrorTemplate添付プロパティ
b. VisualStateManager(VSM)
c. HasError添付プロパティ(プロパティトリガー)
d. イベント
VSUG DAY 2010.12.11 59
60. 検証のまとめ図
① ② ③ ④
ValidationRule Exception IDataErrorInfo INotifyDataErr
orInfo
検証処理実装 バインディング バインディング バインディング バインディング
場所 ターゲット ソース ソース ソース
検証属性の利用 - ✔ ✔ ✔
文字列以外の ✔ - - ✔
検証エラー内容
複数の検証 - - - ✔
エラー通知
任意のタイミン - - - ✔
グで検証
利用可能プラッ WPF 4 WPF 4 WPF 4
トフォーム Silverlight 4 Silverlight 4 Silverlight 4
Windows Phone
VSUG DAY 2010.12.11 60
61. アクションのまとめ図
a. b. c. d.
ErrorTemplate VisualStateMa HasError添付プ イベント
添付プロパティ nager(VSM) ロパティ(プロパ
ティトリガー)
サポートされる 有効 有効 有効
検証結果 無効 無効(フォーカス有) 無効 無効
無効(フォーカス無) ※フォーカス対応化
アクションの記 XAML XAML XAML コード
述 (コードの場合
GetHasErrorメソッド)
遷移アニメー - ✔ ✔
ションサポート
対象コントロー - - ✔ ✔
ルと無関係の要
素の外観を変更
利用可能プラッ WPF 4 WPF 4 WPF 4 WPF 4
トフォーム Silverlight 4 Silverlight 4 Silverlight 4
Windows Phone Windows Phone Windows Phone
VSUG DAY 2010.12.11 61
65. InputMan for Silverlight 1.0J
Silverlight標準に不足している業務コントロールをカバー
GcTextBox テキストコントロール
GcMask マスクコントロール
GcDateTime 日付コントロール
GcNumber 数値コントロール
GcDropDownCalculator ドロップダウン電卓コントロール
GcDropDownCalendar ドロップダウンカレンダーコントロール
GcValidationIndicator 検証インジケータコントロール
GcImeManager ふりがな取得コンポーネント
和暦の表示/入力(M・T・S・Hや元年表示にも対応)
文字種指定の入力制御(ひらがな、カタカナ、記号、全角、半角、
スペース、サロゲートペア文字など)
ノンコーディングでフォーカス制御
フリガナ自動取得
祝日の登録や曜日のスタイルを設定できるカレンダー
VSUG DAY 2010.12.11 65
66. GcTextBox.Formatプロパティ
<im:GcTextBox Format="Aa9" />
WPF 4 Silverlight 4
全角 半角 説明
A A 大文字のアルファベット(A~Z)
a a 小文字のアルファベット(a~z)
K K カタカナ(促音・拗音の小書き表記あり)
N N カタカナ(促音・拗音の小書き表記なし)
9 9 数字(0~9)
# # 数字および数字関連記号(0~9、+ - $ % ¥ , .)
@ @ 記号(! " # $ % & ' ( ) - = ^ ~ ¥ | @ ` [ { ; + : * ] } , < . > / ? _)
B B 2進数(0または1)
X X 16進数(0~9、A~F)
J - ひらがな(促音・拗音の小書き表記あり)
G - ひらがな(促音・拗音の小書き表記なし)
Z - すべての全角文字
T - サロゲート ペア文字
S S 空白文字
- H すべての半角文字
- ^ 指定した書式に含まれないすべての文字
- ¥ エスケープシーケンス
VSUG DAY 2010.12.11 66
69. 検証属性の自動適用
Silverlight 4
VSUG DAY 2010.12.11 69
70. 検証属性の自動適用
Silverlight 4のDataGrid
データ注釈を使用したデータ クラスのカスタマイズ
http://msdn.microsoft.com/ja-jp/library/dd901590.aspx
WCF RIA Services
How to: Validate Data
http://msdn.microsoft.com/en-us/library/ee707335.aspx
VSUG DAY 2010.12.11 70
72. ValidationRule.ValidationStepプロパティ
ValidationSt 説明 ExceptionVa DataErrorVa ValidationR
ep 列挙値 lidationRule lidationRule uleを継承し
たカスタムク
ラス
RawPropose 変換が行われ
デフォルト 不可 デフォルト
dValue る前
ConvertedPr 変換が行われ
oposedValu た後 可 不可 可
e
UpdatedVal ソースの更新
可 可 可※
ue 後
CommittedV 値がソースに
alue コミットされ 可 デフォルト 可※
た後
※Validationメソッドの引数valueはBindingExpressionオブジェクト
WPF 4
VSUG DAY 2010.12.11 72
74. BindingGroupプロパティ
以下の条件のどちらかを満たしている場合、
Bindingがグループ化される
BindingのソースとBindingGroupを設定した要素の
DataContextが同じ
BindingのBindingGroupNameプロパティが
BindingGroupのNameと同じ
<Grid.BindingGroup>
<BindingGroup>
<BindingGroup.ValidationRules>
<local:ObjectValidation/>
</BindingGroup.ValidationRules>
</BindingGroup>
</Grid.BindingGroup>
WPF 4
VSUG DAY 2010.12.11 74
75. 個々の検証をまとめて実行
Bindingがグループ化されることにより、
各Bindingは個別に更新されなくなる。
任意のタイミングで
一気にすべての項目を更新させることが可能
個々の検証をまとめて実行できる。
個々ValidationRuleは、ValidationStepが
RawProposedValueであるもののみがBindingGroupの
ValidationRuleよりも前に実行される。
VSUG DAY 2010.12.11 75
76. 編集トランザクション
メソッド名 説明
BeginEdit 編集トランザクションを開始します。
CommitEdit すべてのValidationRuleを実行し、
成功した場合はバインディングソースを更新します。
CancelEdit 編集トランザクションを終了し、保留中の変更を破棄します。
VSUG DAY 2010.12.11 76
77. 編集トランザクション
Private Sub SubmitButton_Click(ByVal sender As System.Object,
ByVal e As System.Windows.RoutedEventArgs)
If LayoutRoot.BindingGroup.CommitEdit() Then
MessageBox.Show("登録されました。")
LayoutRoot.BindingGroup.BeginEdit()
End If
End Sub
Private Sub CancelButton_Click(ByVal sender As System.Object,
ByVal e As System.Windows.RoutedEventArgs)
LayoutRoot.BindingGroup.CancelEdit()
LayoutRoot.BindingGroup.BeginEdit()
End Sub
WPF 4
VSUG DAY 2010.12.11 77