Browsing articles in "ユーザインターフェース"

スワイプ動作でページ送りする(ViewPager)

9月 30, 2011   //   by @mhidaka   //   ユーザインターフェース  //  3 Comments

ViewPagerを使うとページ送りを簡単に実装することが出来ます。
ViewPagerは左右にページ送りできます。またアニメーションがつくので非常にわかりやすく、直感的なUIを提供できる機能です。
便利な機能ですが、2011/9/29時点ではAndroid SDKに含まれておらず、Android Compatibility package, revision 3(外部ライブラリー)として提供されています。
今回は、この外部ライブラリーの追加から実際のサンプルコードが動作するまでを紹介します。ポイントは次の2点です。

  • 外部ライブラリ「Android Compatibility package, revision 3」の導入
  • ViewPagerをつかうためにはPagerAdapterが必要

ごく簡単に言えば、ViewPagerは入れ物です。表示する内容(ギャラリーアプリであれば写真、動画など)はPagerAdapter経由でViewPagerに指示することになります。
それでは、外部ライブラリの導入からソースコードの解説まで順番に確認していきましょう。

Read more >>

Notificationを使ってステータスバーに情報を表示する / Getting Started

9月 23, 2011   //   by kseto   //   ユーザインターフェース  //  コメントは受け付けていません。

Notification(ノーティフィケーション)とはAndroidの画面上部に配置されているステータスバー上に
表示することができるメッセージのことを指します。

Activityを持たずにバックグラウンドで動作するサービスなどはNotificationを使うことで
ユーザに情報を通知することができます。

Notificationにはテキストメッセージを含め、以下のような設定をすることができます。

  • テキストメッセージ
  • アイコン
  • バイブレーション
  • LED

Notificationを使うのに重要となるメソッドは以下の通りです。

メソッド名説明
ContextクラスのgetSystemService()NotificationManagerやLocationManagerなど、Androidの各種サービスのインスタンスを取得するときに使用します。
NotificationクラスのsetLatestEventInfo()Notification詳細画面の表示設定を行う。
NotificationManagerクラスのnotify()生成したNotificationを通知する。

続きからこれらのメソッドの詳しい使い方について紹介します。

Read more >>

ダイアログを表示する / Getting Started

9月 19, 2011   //   by UpDown-G   //   Android, ユーザインターフェース  //  No Comments

AlertDialogは、ユーザーに警告を出したり、確認を促したりすることができるダイアログです。
今回は、AlertDialogの基本的な使い方を解説します。

図1 : AlertDialogサンプル

基本的なAlertDialogでは、主に以下の要素を利用することが可能です。

  • アイコン(無くても良い)
  • タイトル
  • メッセージ
  • ボタン (個数は3つまで表示が可能)

それでは以上を踏まえて、サンプルを例にAlertDialogの使い方を見ていきましょう。

Read more >>

オプションメニューの使い方 / Getting Started

9月 16, 2011   //   by kkato   //   ユーザインターフェース  //  No Comments

オプションメニューは端末のメニューボタン押すことで画面下にメニューを表示するGUI部品です。

機能をボタンに割り当てて画面に表示させておくことは、ユーザーがすぐに目的の機能にアクセスできるので便利です。

しかし、全ての機能をボタンに割り当てて画面に表示させておくと、画面が煩雑になってユーザビリティが悪化してしまうことがあります。そんな時は全てをボタンに割り当てるのではなく、必要に応じてメニューに機能を割り当てて、ユーザーがメニューボタンを押してアクセスできるようにしましょう。

機能が多く、メニューも煩雑になってしまうようなら、サブメニューを使って階層化することも検討しましょう。

OptionMenuを使う際に大事なメソッド

メソッド説明
ActivityクラスonCreateOptionsMenuメソッドこのメソッドの中で必要に応じてメニューボタンが押された際に表示されるメニューにメニューアイテム(メニューに表示されるそれぞれの項目)を追加する
ActivityクラスonOptionsItemSelectedメソッドメニューアイテムが選択された時に呼び出される

続きからこれらのメソッドについて詳しく解説していきます。

それでは続きをご覧ください。

Read more >>

DatePickerDialogで日付を入力する / Getting Started

9月 16, 2011   //   by furusin   //   アプリケーション, ユーザインターフェース  //  No Comments

日付入力に便利なダイアログ、DatePickerDialogの紹介です。
DatePickerDialogは日付選択画面が簡単に作れ、カレンダーアプリやスケジュール管理アプリ等によく用いられます。
端末の言語設定に応じた//日表示をしてくれるため、非常に便利です。
例)
日本語の場合://日
英語の場合 :/日/
韓国語の場合://日

DatePickerDialogの大事なメソッド

DatePickerDialogを使う際には以下のメソッドを使いこなすことがポイントとなります。
メソッド・インターフェース説明
DatePickerDialog.OnDateSetListenerDatePickerDialog の内容が変更されたときに呼び出されるリスナー
OnDateSetListener.onDateSet()設定ボタンが押された時に呼び出されるメソッド
DatePickerDialog.show()作成したDatePickerDialogを表示するためのメソッド。これが無いと、せっかく設定してもDatePickerDialogが表示されません

続きはソースコード、テーマの適応例などです。
Read more >>

シークバーの使い方 / Getting Started

9月 14, 2011   //   by @mhidaka   //   ユーザインターフェース  //  No Comments


シークバーはツマミをマウスで左右にドラッグしてパラメータを調整するGUI部品です。
オーディオのボリュームコントロール、パラメータの調整など、量的なパラメータを設定する場合に重宝します。
シークバーは、表示や動作にいくつかバリエーションが存在します。

  • 標準的なシークバー
  • 2つの設定値を同時に表示できるセカンダリ値を持ったシークバー
  • XMLをつかった独自レイアウトのシークバー

これらのシークバーは同じように実装することが可能です。この記事の中で順番に解説します。まずは大事なポイントから。

SeekBarを使う際の大事なポイント

ポイント 説明
SeekBarの初期値 SeekBar.setProgress()
レイアウト指定(android:progress)
SeekBarの上限 SeekBar.setMax()
レイアウト指定(android:max)


機能面のポイントは以下の通りです。

SeekBarを使う際に大事なメソッド・レイアウト

メソッド・インターフェイス 説明
SeekBar.setOnSeekBarChangeListenerインターフェイス シークバー変更時に呼び出されるOnSeekBarChangeListenerクラスを登録
OnSeekBarChangeListenerクラスonProgressChanged() ツマミの位置が変化した
OnSeekBarChangeListenerクラスonStartTrackingTouch() ツマミのドラッグを開始した
OnSeekBarChangeListenerクラスonStopTrackingTouch() ツマミのドラッグを終了した

ソースコード、サンプルなど詳細は続きからどうぞ。
Read more >>

ボタンの使い方 / Getting Started

9月 10, 2011   //   by kseto   //   ユーザインターフェース  //  No Comments

ボタンは押したりすることで何か処理をさせることができるGUI部品です。
AndroidのGUI部品の中では最も基本的なものと言えるでしょう。

今日はボタンの使い方について詳しく解説したいと思います。

ボタンを使う際には以下のメソッドを使いこなすことがポイントとなります。

Buttonを使う際に大事なメソッド

メソッド・インタフェース 説明
View.OnClickListenerインターフェイス onClickコールバックメソッドを実装することで、クリック時のイベントを取得できる
Activity.findViewById() View(ボタンなど)のインスタンスをandroid:idから引ける
View.setOnClickListener() View(ボタンなど)にクリック時のリスナーを登録する

続きからこれらのメソッドについて詳しく解説していきます。
それでは続きをご覧ください。

Read more >>

Toastをカスタマイズする

8月 22, 2011   //   by kseto   //   ユーザインターフェース  //  No Comments

デフォルトのToastはテキストを表示するだけのシンプルなものですが、
下の図のようにテキストと一緒に画像を表示するなど、ちょっと凝ったToastを作ることも可能です。

今回はToastのカスタマイズ方法についてご紹介したいと思います。
詳細は続きからどうぞ。

Read more >>

コンテキストメニューを作る

8月 8, 2011   //   by @mhidaka   //   ユーザインターフェース  //  1 Comment

AndroidのコンテキストメニューはWindowsの右クリックメニューと同じような機能です。今回はコンテキストメニューの設定方法について紹介します。
長押し操作(しばらくタップしつづけること)でメニューを表示できます。
ViewごとにContextMenuを登録することが可能です。一番ポピュラーな使われ方としてはListViewにコンテキストメニューを追加することです。リストビューの要素の追加、変更、削除など編集操作用にコンテキストメニューを用意すれば、直感的でわかりやすいUIになります。

以下の手順でコンテキストメニューを作成します。

  1. コンテキストメニューを表示するViewを登録する
  2. メニューを作成する
  3. 選択されたときのアクションコードを記述する

ContextMenuの関連メソッド

大事なメソッド・クラス 説明
Activity#registerForContextMenu コンテキストメニューの登録
Activity#onCreateContextMenu コンテキストメニューの作成
ContextMenu#setHeaderTitle メニュータイトル
ContextMenu#add メニュー追加
AdapterContextMenuInfoクラス コンテキストメニューの付加情報

コンテキストメニューはアイコン表示やショートカットキーによる操作をサポートしていない、など機能に制限があります。写真を見てもわかるように、シンプルな補助メニューという位置づけです。

サンプルコードは続きから
Read more >>

Style.xmlを使用してThemeをカスタマイズする

8月 6, 2011   //   by kei_i_t   //   ユーザインターフェース, 未分類  //  No Comments

AndroidではThemeというデザインを統一する仕組みがあります。

Themeを使用すると背景や文字色、各UIコンポーネントをアプリケーションやActivty単位で統一できます。

これは非常に便利な機能ですが、アプリを作っているとこの部分だけは違うデザインにしたいと思う箇所が出てくると思います。

そういう場合はstyle.xmlを使用して変更したい部分のデザインのみを変更するという方法が存在します。

詳細は以下から。

Read more >>

ページ:«12345678910»

技術書新刊 発売中

アンドロイドアカデミアには、CIやテスト、互換検証など実務に生きるノウハウをあつめています

技術書新刊 発売中

Android Next!はAndroid 7.0に対応したはじめての技術書です!


The Web Explorer 2はCSSの中央寄せやWebAudioなど未来を読み解く一冊です


Revised TypeScript in DefinitelylandはTypeScript 2.0(β)に対応した解説書です。インストールから型定義まで幅広くサポートしています


技術書をかこう!はエンジニアらしい執筆環境を構築、HowTo本です