テキスト入力のガイドラインとチェック リスト (Windows ストア アプリ)

Applies to Windows only

C++、C#、または Visual Basic を使った Windows ストア アプリにテキスト入力コントロールを追加するには、次のガイドラインに従ってください。

ロードマップ: このトピックと他のトピックとの関連については、以下をご覧ください。

適切なコントロールの選択

テキスト入力コントロールを使うと、ユーザーはテキストまたは数値を入力したり編集したりすることができます。テキスト入力コントロールを使うかどうかを判断する際には、次の点を考慮してください。

  • 有効なすべての値を効率的に列挙することが現実的か? そうである場合は、代わりにいずれかの選択コントロールを使うことを検討してください。
  • 有効なデータに、何も制約がないか? または、形式の制約 (長さや文字の種類による制約) だけがあるか? そうである場合は、テキスト入力コントロールを使います。
  • 値は専用のコモン コントロールがあるデータ型か? そうである場合は、テキスト入力コントロールではなく、適切なコントロールを使います。
  • データが数値の場合:
    • ユーザーは設定を相対的な量として認識しているか? そうである場合は、スライダーを使います。
    • 設定の変更による影響をすぐに確認できることがユーザーにとって便利か? そうである場合は、スライダーを使い、必要であれば付随するコントロールも使います。

テキスト入力コントロールには、単一行のものと複数行のものがあります。次のセクションでは、単一行のテキスト入力コントロールを使う場合について説明します。その後のセクションでは、複数行のテキスト入力コントロールについて説明します。

適切な単一行テキスト入力コントロールの選択

短い文字列の場合は、単一行テキスト入力コントロールを使います。次の表は、各種のテキスト入力コントロールの用途を示しています。

基本データ入力

ユーザーから少量のテキストを収集するには、単一行テキスト入力コントロールを使います。

次の例は、セキュリティの質問への回答を取得する単一行テキスト ボックスを示しています。 回答には短い文字列が想定されるので、単一行テキスト ボックスが適しています。 収集される情報は、Windows で認識される専用の入力型のいずれとも一致しないので、汎用の TextBox 型が適しています。

基本データ入力ボックス

書式付きのデータ入力

特定の書式のデータを入力するには、短い固定サイズの TextBox コントロールのセットを使います。

書式付きのデータ入力ボックス

補助付きのデータ入力

文字列を入力または編集するには、単一行の、制約のない TextBox コントロールと、ユーザーが有効な値を選択できるように補助するコマンド ボタンを組み合わせて使います。

補助付きのデータ入力ボックス

数値入力

数値を入力または編集する場合は、TextBox コントロールを使います。InputScope 値は InputScopeNameValue.Number に設定します。

電話番号入力

電話番号を入力する場合は、TextBox コントロールを使うか、短い固定サイズの TextBox コントロールのセットを使います。InputScope 値は InputScopeNameValue.TelephoneNumber に設定します。

メール入力

メール アドレスを入力する場合は、TextBox コントロールを使います。InputScope 値は InputScopeNameValue.EmailSmtpAddress に設定します。

メール アドレス入力ボックス

URL 入力

Web アドレスを入力する場合は、TextBox コントロールを使います。InputScope 値は InputScopeNameValue.Url に設定します。

パスワードおよび PIN 入力

パスワードと PIN を安全に入力するには、PasswordBox コントロールを使います。

パスワード入力ボックス

 

単一行の入力ボックスに関する推奨と非推奨

推奨

少量のテキスト情報を多数取得する場合は、いくつかの単一行テキスト ボックスを使います。それらのテキスト ボックスに本来の関連性がある場合は、グループ化します。

値を入力するための追加の指示がユーザーに必要だと考えられる場合は、単一行テキスト ボックスにプレースホルダー テキストを用意します。

単一行テキスト ボックスのサイズを、予測される最長の入力より少し広くします。そのようにするとコントロールが広くなり過ぎる場合は、2 つのコントロールに分割します。たとえば、1 つの住所の入力を "Address line 1" と "Address line 2" に分割できます。

最大長を設定します。バッキング データ ソースが長い入力文字列を許可しない場合は、MaxLength を設定して入力を制限し、制限に達したら検証ポップアップを使ってユーザーに知らせます。

非推奨

テキスト ボックスは、検索ボックスとしては使いません。Web ページでは、検索ボックスを作成するために TextBox 要素を使うことが一般的な習慣になっています。 しかし、代わりに検索チャームを使うと、より便利で一貫性のあるエクスペリエンスを実現できます。 検索チャームは、アプリがプラグインとして使用できる、一貫性のある検索エクスペリエンスを提供します。詳しくは、「検索の追加」をご覧ください。

パスワード入力ボックスのすぐ横に、他のコントロールを配置しないようにします。PasswordBox には、入力したパスワードをユーザーが確認するための、パスワード表示ボタンがあります。他のコントロールをすぐ横に配置すると、ユーザーが他のコントロールを操作しようとしたときに、誤ってパスワードを表示してしまう可能性があります。 そうならないようにするために、PasswordBox と他のコントロールの間には少し間隔をおくか、他のコントロールを次の行に配置します。

 

適切な複数行テキスト入力コントロールの選択

ユーザーが長い文字列を入力または編集する必要がある場合は、複数行テキスト コントロールを使います。複数行テキスト入力コントロールには、次の 2 種類があります。

  • 複数行テキスト ボックスの主な目的がドキュメントの作成 (ブログのエントリ、メール メッセージのコンテンツなど) であり、ドキュメントでリッチ テキストが必要な場合は、RichEditBox コントロールを使います。
  • ユーザーがテキストを書式設定できるようにする場合は、RichEditBox コントロールを使います。
  • 内部的に使うだけで、後でユーザーに再表示しないテキストを取得する場合は、TextBox コントロールを使います。たとえば、アンケートを行うとします。ユーザーが回答を終了すると、データはサーバーに送信されますが、ユーザーが再度データを見ることはありません。 通常は、ユーザーがテキストのスタイルを設定できるようにする必要はありません。
  • 他のすべてのシナリオでは、可能な限り、TextBox コントロールを使います。

複数行テキスト入力コントロールに関する推奨と非推奨

推奨リッチ テキスト ボックスを作る場合は、スタイル設定ボタンを用意し、その動作を実装します (C++、C#、Visual Basic を使った Windows ストア アプリでは、これらのコントロールは自動的には提供されません)。
アプリの雰囲気に合ったフォントを使います。
テキスト コントロールの高さは、典型的な入力が十分に入るように設定します。

長いテキストを取得する場合、ユーザー入力のワード数または文字数が最大値未満になるようにするには、プレーン テキスト ボックスを使い、ライブ実行のカウンターを用意して、制限までの残りの文字数または単語数をユーザーに示します。カウンターは自分で作成する必要があります。テキスト ボックスのそばに配置し、ユーザーが文字や単語を入力するたびに動的に更新します。

文字カウンター付きの入力ボックス

非推奨ユーザーの入力中にテキスト入力コントロールの高さが増加するようにはしません。
ユーザーが 1 行しか必要としていない場合は、複数行テキスト ボックスを使いません。
プレーン テキストで十分な場合は、リッチ テキスト コントロールは使いません。

 

関連トピック

TextBox
RichEditBox
PasswordBox

 

 

表示:
© 2014 Microsoft