趣味のこと、技術的なこと、適当につらつら書きます。Phoneのアプリを開発していたり、使っていたりしてると、ふと気づく事があります。ボタンコントロールの使い方を考えよう一番思うことは、「はたしてその場所にボタンがあっていいかどうか」ということ。確かにボタンは便利です。使い方によっては不便になってしまうことがあります。ボタンはどんなときに不便かずばり「ユーザーに何かを入力させてからアクションをするとき」だと考えています。文字を入力する際、TextBoxにフォーカスがあたると、その位置によってOS側が入力中の文字が見えるように自動で位置を調整します。そのとき、TextBoxだけでなくボタンも一緒に動きますから、配置によってはボタンが見えなくなる時があります。注意したいのは、TextBoxの上下にボタンがあるパターン。下の図のように、入力する時にボタンが見えなくなってしまうと、次にユーザーにさせたいことがユーザーに伝わらなくなってしまう(忘れてしまう)ため、ユーザーに一度フォーカスを外してもらう必要があります。これならまだフォーカスを外すためにタップする場所はありますが、もしかするとタップしたら予期しない動作をするかもしれない配置になっているかもしれません。下のような状態だと、フォーカスを外すためのタップ領域はごくわずかになってしまいます。Backボタンを押した時に間違えて二度押してしまうかもしれません。TextBoxの横にボタンを置けばいいよね。なるのですが、それもそれで不便だったりします。TextBoxからボタンへフォーカスが移動するということは、キーボード領域が折りたたまれるということで、ボタンも一緒に元の位置に戻ります。そのときボタンを押したはずなのに押されなかった(半押し状態でカーソルが別領域に移動した)扱いになることが多いのです。エミュレーター上ではクリック動作が一瞬で終了するので確認しづらいですが、指でタップするときはその誤作動が顕著に表れます。エミュで動作確認をする場合は、クリックする時は1秒以上ボタンを押し続けるつもりで確認をした方がいいでしょう。この例がすぐわかるのは、「乗換案内」アプリですね。押してもなかなか反応しません。Barを使いましょう。文字を入力させて、次にボタンを押してアクションするタイプの場合は特に有効です。Barに次のアクションをするボタンがあれば、人は自然とそのボタンを押すようになります。アイコンはそれらしいものを使えば、絵だけで次に何を押せば目的の動作に移れるかがわかりますし、1個だけ置いておけばそのボタンを押すしかないなっていうのがわかります。(2月16日追記)もうひとつ、キーボードの入力種を「Search」にする方法もあります。Enterキーの色が反転してわかりやすくなります。/>この状態で以下のようなイベントハンドラーを書いておけば、Enterキーを押した時に次のアクションへうつることもできます。this.Focus();}}これで注意しなければいけないのは、次のアクションが予測できるかどうかです。この入力種は端末下のSearchボタンをクリックした時のキーボードでも同じ状態になりますが、この場合はEnterキーを押せば次は検索動作が起きるだろうということがすぐわかります。この方法は、複数行入力する事を可能にしているTextBoxでは使えないのでご注意を。ボタンが便利なときざっくり話すと、文字の入力だけで操作が終了しないときとか、単にボタンを押してもらうだけのとき、文字を入力してからのアクションの場合は「配置が自動で移動しない位置に置ける」ときが有効ではないかと考えています。配置が自動で移動しない位置というのは、PivotやPanoramaを使わず、画面最上部にTextBoxとボタンが置ける位置のことです。この場所だと、キーボードが展開されてもTextBoxが隠れることがありませんので、配置は移動しません。Barを使いましょう。»Profileid:ChiiAyano趣味のこと、技術的なこと、適当につらつら書きます。Phoneはてなブログをはじめよう!ChiiAyanoさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。