PasswordBox コントロールのスタイル処理のヒント

  • [アーティクル]

Ee341382.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(JA-JP,Expression.30).png

[PasswordBox] コントロールは、ユーザーが入力した文字をマスキングするオブジェクトです。

他のコントロールと同様に、[PasswordBox] コントロールも既定の外観を変更できます。既定の [PasswordBox] コントロールは、次のように表示されます。

Ee341382.4e1556e5-03f0-4881-8283-8281cb11c978(JA-JP,Expression.30).png

PasswordBox コントロールのプロパティ

[PasswordBox] コントロールはテキスト コントロールです。文字が入力された状態で [PasswordBox] を表示したい場合は、[プロパティ] パネルにある [共通プロパティ] の [Password] プロパティを変更します。[Password] プロパティにはユーザーが入力する文字が格納されます。

ユーザーが [PasswordBox] コントロールに文字を入力するときに表示されるマスク文字を変更するには、[PasswordChar] プロパティを変更します。このプロパティは、[プロパティ] パネルの [テキスト] カテゴリの [詳細プロパティの表示] Ee341382.de239c9d-42ce-4f5e-83b9-5f9924c0431f(JA-JP,Expression.30).png をクリックすると表示されます。

これらのプロパティを設定するには、次の方法があります。

  • オブジェクトのプロパティを設定する   アートボードに [PasswordBox] オブジェクトを描いた後で、そのプロパティを直接設定します。複数の [PasswordBox] オブジェクトで同じ値を使用する場合は、これらのプロパティをスタイルとして設定します。

  • プロパティをスタイルとして設定する   [PasswordBox] オブジェクトのプロパティをスタイル Ee341382.94fa7fc4-4f3e-4e84-9ba1-287f1b894371(JA-JP,Expression.30).png として設定すると、このスタイルを使用するすべての [PasswordBox] オブジェクトのプロパティが同じ値になります。特定のオブジェクトの値を上書きすることもできます。

    詳細については、「スタイルの作成」を参照してください。

ユーザーが [PasswordBox] コントロールにパスワードを入力したときに実行される処理を指定するには、PasswordChanged イベントをイベント ハンドラーにフックします。

詳細については、「イベントに応答するコードを記述」を参照してください。

PasswordBox テンプレートのパーツ

[PasswordBox] コントロールは外観を定義するために 「PasswordBox テンプレート」というテンプレートを 1 つ使用します。このテンプレートの各パーツによって、テンプレートが適用される [PasswordBox] オブジェクトの外観と動作が決まります。

[PasswordBox] コントロールの見栄えをよくするために他のオブジェクトをテンプレートに入れることはできますが、次の表にあるパーツは、コントラクトで定義されている動作しか行えません。

テンプレートのパーツを見るには、テンプレートを変更するときに [パーツ] パネルを開きます。[オブジェクトとタイムライン] パネルのオブジェクトの横に表示される Ee341382.6cf58c39-edba-4a0e-acbc-1da272f9a387(JA-JP,Expression.30).png アイコンは、そのオブジェクトが [パーツ] パネルでパーツの役割を果たしていること示します。

Ee341382.5b6101ee-86c4-48c6-a025-664d28142285(JA-JP,Expression.30).png

パーツ名

オブジェクトの種類

説明

ContentElement

FrameworkElement

ユーザーがパスワードを入力したときにマスクする文字を表示するオブジェクト。

これは、必須のパーツです。

PasswordBox テンプレートの他のオブジェクトを使って、さまざまな状態の [PasswordBox] コントロールの外観を変更します。

PasswordBox コントロールの状態

既定では、[PasswordBox] コントロールは、次の表にある CommonStates 状態グループの 4 つの状態のいずれかになります。これらの状態は、[PasswordBox] テンプレートを変更するときに、[状態] パネルで見ることができます。

状態名

説明

Normal

[PasswordBox] コントロールに対してユーザーが何も行わず、単に表示されているだけの状態。

MouseOver

ユーザーが [PasswordBox] コントロールの上にポインターを動かしたときの状態。

Pressed

ユーザーが [PasswordBox] コントロールをクリックしたか、[PasswordBox] コントロールがフォーカスされているときに Enter キーまたはスペース バーを押したときの状態。

Disabled

[IsEnabled] プロパティを [False] に設定したときの状態。

[PasswordBox] コントロールは、次の FocusStates 状態グループに属する状態のいずれかになることができます。

状態名

説明

Unfocused

[PasswordBox] コントロールがキーボードでフォーカスされていないときの状態。

Focused

[PasswordBox] コントロールがキーボードでフォーカスされたときの状態。たとえば、アプリケーション内でユーザーが Tab キーを押してフォーカスを切り替えていき、[PasswordBox] コントロールにフォーカスが移った場合が相当します。

[PasswordBox] コントロールは、次の ValidationStates 状態グループにある 3 つの状態の 1 つになることができます。

状態名

説明

Valid

[PasswordBox] コントロールが有効な状態。

InvalidUnfocused

[PasswordBox] コントロールが無効で、キーボードでフォーカスされていないときの状態。

InvalidFocused

[PasswordBox] コントロールが無効で、キーボードでフォーカスされているときの状態。
Ee341382.alert_tip(JA-JP,Expression.30).gifヒント :

状態グループは、コントロールの表示状態を論理的に分類したものです。1 つのグループに属する複数の状態を同時に表示することはできません。たとえば、CommonStates グループには、ユーザーがマウスなどの入力デバイスで行う操作に関係のある状態が含まれています。1 つのグループ内で一度に表示できる状態は 1 つだけですが、別々のグループに属する状態を同時に表示することはできます。

状態を 1 つ選択すると、その状態の変更の記録が開始されます。状態の記録を無効にするには、記録ボタン Ee341382.0dcc6415-6d4e-4fcf-a9a3-eb4664cb6cbc(JA-JP,Expression.30).png をクリックするか、[状態] パネルで [ベース] を選択します。2 つの状態がアクティブになったときのコントロールの外観を変更するには、1 つのグループに属する状態のプレビューを固定しておき、別のグループに属する状態を変更します。

オブジェクトを PasswordBox コントロールに変換するには

[PasswordBox] コントロールのテンプレートを変更するには、次のいずれかの操作を行います。

  • アートボードに [PasswordBox]Ee341382.343296b4-5c7d-4145-84cc-91b08ba67a1b(JA-JP,Expression.30).png を描いてから、既定のテンプレートのコピーを作成します。

    詳細については、「テンプレートの作成または変更」を参照してください。

  • [PasswordBox] コントロールにするオブジェクトを描くかアートをインポートして、その外観をデザインしてから、[コントロールの作成] コマンドを使用します。

[コントロールの作成] コマンドを使用する場合は、次の手順に従って、[PasswordBox] テンプレートに必要なオブジェクトをすべて作成します。

  1. まず、オブジェクトをグループにまとめてレイアウト パネルに配置します。そのレイアウト パネルを選択し、[ツール] メニューの [コントロールの作成] をクリックします。

  2. 表示されたダイアログ ボックスで [PasswordBox] を選択してテンプレートに名前を付け、テンプレートの保存場所を選択します。

    保存場所については、「リソースの作成」を参照してください。

  3. [OK] をクリックすると、Microsoft Expression Blend がテンプレート編集モードになり、[PasswordBox] コントロールを構成しているオブジェクトが表示されます。

  4. [TextBlock]オブジェクトなど、テキストを表示するオブジェクトがテンプレートに含まれる場合は、そのオブジェクトを右クリックし、[PasswordBox のパーツの作成] をポイントして、[ContentElement] をクリックします。それ以外の場合は、[パーツ] パネルで [ContentElement] パーツをダブルクリックし、テンプレートに [Grid] オブジェクトを作成して [ContentElement] パーツとして使用します。[プロパティ] パネルの [レイアウト] カテゴリでプロパティを変更し、目的の場所に新しい [Grid] オブジェクトを表示します。

  5. このモードで、テンプレートの変更を続けます。たとえば、オブジェクトの追加や変更を行ったり、[状態] パネルで状態を選択して、その状態のテンプレートの外観を変更します。

  6. 必要に応じて、このテンプレートを使うことになる [PasswordBox] オブジェクトの次のプロパティと、オブジェクトのブラシ プロパティをバインドします。

    • Background

    • BorderBrush

    • Foreground

    • BorderThickness

    詳細については、「オブジェクト プロパティをテンプレートに反映させる」を参照してください。

  7. テンプレート編集モードを終了するには、アートボードの上端にある階層リンク バーの [PasswordBox] をクリックするか、[オブジェクトとタイムライン] パネルの [上へスコープ]Ee341382.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(JA-JP,Expression.30).png をクリックします。

新しく作成した PasswordBox テンプレートを別の [PasswordBox] オブジェクトに適用する方法については、「リソースの適用と削除」を参照してください。

参照

Microsoft Silverlight の [PasswordBox] コントロールのプロパティとイベントの詳細については、MSDN の「Silverlight Control Gallery (Silverlight コントロール ギャラリー)」を参照してください。

関連項目

概念

一般的な Silverlight コントロールのスタイル処理のヒント

テンプレートをサポートするコントロールのスタイル処理

テキストの描画