corner imagecorner image
IDEPlatformPluginsDocs & SupportCommunityPartners

ビジュアルモバイルデザイナのカスタムコンポーネント: モバイルアプリケーション用の待機画面の作成

Java ME アプリケーションが適切に動作するために、ネットワークへの接続が必要になることがよくあります。ところが、ワイヤレスネットワークは現在でも比較的低速です。ネットワーク接続やデータ転送を待機するバックグラウンドタスクによってアプリケーションが一時停止した場合に、表示画面が完全に固まってしまったのか、中止してあとでやり直したほうがいいのか、判断に迷うことがあります。このようなユーザーにとって不愉快で、ありがちな事態に、開発者はどのように対処したらよいでしょうか。

答えは「待機画面」を追加することです。待機画面では、ユーザーがバックグラウンド作業 (ネットワークへの接続など) のブロックを実行したり、作業の進捗状況を表示したり、アプリケーションが正常に動作中であることをユーザーに通知するメッセージを画面に表示することができます。このチュートリアルでは、ビジュアルモバイルデザイナ (VMD) を使用して、カスタマイズ可能な待機画面カスタムコンポーネントを含む待機画面の作成を簡素化し、アプリケーションフローに追加できます。

NetBeans でのモバイルアプリケーション開発に習熟していない場合、次に進む前に「NetBeans Java ME MIDP 開発のクイックスタートガイド」から始めることをお勧めします。

注: NetBeans IDE 6.8 を使用している場合は、「モバイルアプリケーション用の待機画面の作成」チュートリアル (NetBeans IDE 6.8 ドキュメント) を参照してください。

目次

このページの内容は NetBeans IDE 6.9 および 7.0 が対象です

このチュートリアルを完了するには、次のソフトウェアとリソースが必要です。

ソフトウェアまたはリソース 必須バージョン
NetBeans IDE と Java ME version 6.9 以上
Java Development Kit (JDK) version 6

待機画面コンポーネントの動作方法

待機画面コンポーネントのためのバックグラウンドタスクの作成には、2 種類の方法があります。取消可能タスクインタフェースを実装するクラスを記述するか、または簡易取消可能タスクリソースを使用できます。setTask() メソッドを使用して、バックグラウンドタスクを待機画面に割り当てることができます。

待機画面コンポーネントでは、バックグラウンドタスクの完了時に、表示可能な別のオブジェクトへの切り替えが自動的に行われます。タスクが正常に終了した場合、待機画面は setNextDisplayable() メソッドによって提供される画面に切り替わります。タスクが正常に終了しなかった場合、待機画面は setFailureDisplayable() メソッドによって提供される画面に切り替わります。デフォルトの表示可能なオブジェクトが設定されていない場合、待機画面は setNextDisplayable() メソッドで指定される画面に切り替わります。次に表示可能な画面が設定されていない場合、待機画面は以前に表示された画面に戻ります。

このコンポーネントは、MIDP 2.0 デバイスプロファイルがサポートされたアプリケーションでのみ使用できます。

ページの先頭へ

サンプルアプリケーションのインストールと実行

始める前に、チュートリアルの最終結果を確認します。

次の手順で waitscreenexample サンプルアプリケーションをインストールします。

  1. WaitScreenExample.zip をダウンロードします。
  2. ファイルを展開します。
  3. IDE で、「ファイル」>「プロジェクトを開く」を選択し、展開したファイルがあるフォルダを選択します。
  4. 「プロジェクトを開く」をクリックします。
    「プロジェクト」ビューは次のようになります。
  5. WaitScreenExample ファイルが表示された「プロジェクト」ウィンドウ

  6. 「プロジェクト」ウィンドウでプロジェクトノードを右クリックし、「実行」を選択するか、F6 キーを押します。アプリケーションが実行されると、エミュレータウィンドウが開き、デフォルトのデバイスエミュレータでアプリケーションが実行されるところが表示されます。
  7. 「エミュレータ」ウィンドウで「起動」の下のボタンをクリックします。エミュレータに NetBeans Web サイトの URL アドレスである http://netbeans.org が表示されます。
  8. 「OK」の下のボタンをクリックします。通信時間を使用してよいかどうかを尋ねる画面が表示されます。
  9. 「Yes」の下のボタンをクリックして続行します。エミュレータで Web サイトへの接続が試行され、待機画面が表示されます。

    サンプル待機画面アプリケーションが表示された DefaultColorPhone エミュレータ

  10. エミュレータを接続したら、アプリケーションを閉じます。

ページの先頭へ

待機画面カスタムコンポーネントを使用したモバイルアプリケーションの作成

待機画面コンポーネントが動作するところを確認できたので、最初に戻ってこのアプリケーションを作成します。アプリケーションを作成するには、次の手順を実行します。

  1. WaitScreenExample プロジェクトを作成する
  2. MyWaitScreen プロジェクトにパッケージとビジュアル MIDlet を追加する
  3. MyWaitScreenMidlet にコンポーネントを追加する
  4. 画像リソースを追加する
  5. 了解、戻る、終了コマンドをテキストボックスコンポーネントと待機画面コンポーネントに追加する
  6. アプリケーションフローを作成する
  7. 待機画面のバックグラウンドタスクの作成
  8. プロジェクトを実行する

注: このプロジェクトを作成する前に、前の手順で作成した WaitScreenExample のサンプルプロジェクトを必ず終了または削除してください。NetBeans IDE では、同じ名前のプロジェクトを同時に開くことはできません。

WaitScreenExample プロジェクトの作成

  1. ファイル」>「新規プロジェクト」(Ctrl-Shift-N) を選択します。「カテゴリ」から「Java ME」を選択します。「プロジェクト」で「モバイルアプリケーション」を選択して、「次へ」をクリックします。
  2. 「プロジェクト名」フィールドに「WaitScreenExample」と入力します。「プロジェクトの場所」をシステム上の任意のディレクトリに変更します。このディレクトリを $PROJECTHOME とします。
  3. 「Hello MIDlet を作成」チェックボックスの選択を解除します。「次へ」をクリックします。
  4. 「エミュレータプラットフォーム」は、「Sun Java Wireless Toolkit 2.5.2」を選択したままにしておきます。「完了」をクリックします。

WaitScreenExample プロジェクトへのパッケージとビジュアル MIDlet の追加

  1. 「プロジェクト」ウィンドウで WaitScreenExample プロジェクトを選択し、「ファイル」>「新規ファイル」(Ctrl-N) を選択します。「カテゴリ」から「Java」を選択します。「ファイルの種類」として「Java パッケージ」を選択します。「次へ」をクリックします。
  2. 「パッケージ名」フィールドに「waitscreenexample」と入力します。「完了」をクリックします。
  3. 「プロジェクト」ウィンドウで waitscreenexample パッケージを選択し、「ファイル」>「新規ファイル」(Ctrl-N) を選択します。「カテゴリ」にある「MIDP」を選択します。「ファイルの種類」として「ビジュアル MIDIlet」を選択します。「次へ」をクリックします。
  4. 「MIDlet 名」フィールドと「MIDP クラス名」フィールドに「MyWaitScreenMidlet」と入力します。「完了」をクリックします。

MyWaitScreenMidlet へのコンポーネントの追加

「ビジュアル MIDlet」を選択してビジュアルモバイルデザイナ (VMD) を開きます。VMD ウィンドウ最上部の「フロー」ビューをクリックしてフローデザイナを開き、ここでアプリケーションフローを設計します。

  1. ビジュアル MIDlet を「フロー」ビューに切り替えます。次の画面コンポーネントをコンポーネントパレットからドラッグし、フローデザイナにドロップします。
    • テキストボックス
    • 待機画面
    • リスト
    • 警告
  2. textBox を選択します。コンポーネントパレットの下の「プロパティー」ウィンドウで、「タイトル」プロパティーを「Text Box」に変更します。
  3. 次のコンポーネントに対し、同じ操作を実行してタイトルを変更します。
    • waitScreen を「Wait Screen」に変更
    • list を「List」に変更
    • alert を「Alert」に変更
  4. 各コンポーネントで次のプロパティー値を使用します。
    • textBox の「テキスト」プロパティーを「http://netbeans.org」に変更
    • alert の「文字列」プロパティーを「Connection Failed」に変更
    • WaitScreen の「テキスト」プロパティーを「Please Wait...」に変更

「フロー」ビューは、次の画像のように表示されるはずです。

コンポーネントアイコンを配置した「フロー」ビュー

画像リソースの追加

このセクションでは、待機画面と警告画面に使用する画像を追加します。

  1. alert.png ファイルと sandglass.png ファイルをダウンロードして $PROJECTHOME/src/waitscreenexample フォルダにコピーします。
  2. alert コンポーネントを右クリックし、ポップアップメニューから「プロパティー」を選択します。
  3. 「プロパティー」ダイアログボックスで、「画像」プロパティーの省略符号ボタン (省略符号ボタン) をクリックします。
  4. 「画像」ダイアログボックスで「追加」をクリックします。
    image1 コンポーネントが追加されます。
  5. 「参照」をクリックし、コピーした alert.png ファイルのパスを「開く」ダイアログボックスで指定します。
  6. 「開く」をクリックします。
    画像が追加されます。
  7. 「了解」をクリックして「画像」ダイアログボックスを閉じます。
  8. 「閉じる」をクリックして「プロパティー」ダイアログボックスを閉じます。
    alert.png 画像が alert コンポーネントにバインドされます。
  9. waitScreen コンポーネントについて手順 2 - 8 を繰り返して、sandglass.png を image2 として追加し、コンポーネントにバインドします。

了解、戻る、終了コマンドをテキストボックスコンポーネントと待機画面コンポーネントに追加

  1. パレットの「コマンド」セクションで「了解コマンド」を選択します。このコマンドを textBox にドラッグ&ドロップします。
  2. パレットの「コマンド」セクションで「戻るコマンド」を選択します。このコマンドを list にドラッグ&ドロップします。
  3. パレットの「コマンド」セクションで「終了コマンド」を選択します。このコマンドを list にドラッグ&ドロップします。

アプリケーションフローの作成

これで、アプリケーションフローを作成する準備ができました。

  1. 「フロー」ビューで、モバイルデバイスの「起動」をクリックし、textBox コンポーネントまでドラッグします。
  2. 同様に、次の図に示すようにコンポーネントを接続します。

    Mobile Device、textBox、waitScreen、list、Mobile Device の順に接続されたフローデザイナ画面。エラーコマンドから alert に接続したあとで、list に接続する

待機画面のバックグラウンドタスクの作成

  1. 「フロー」ビューで waitScreen コンポーネントを右クリックし、ポップアップメニューから「プロパティー」を選択します。
  2. 「プロパティー」ダイアログボックスで、「タスク」ドロップダウンメニューから <取り消し可能な新規のタスク> を選択して「閉じる」をクリックします。
    simpleCancellableTaskwaitScreen コンポーネントのバックグラウンドタスクになります。
  3. ビジュアルモバイルデザイナの上部にある「ソース」ボタンをクリックして、アプリケーションのソースコードに切り替えます。
  4. MyWaitScreenMIDlet ソースコードの public void destroyapp(boolean unconditional) { } のあとに、次のコードをペーストします。
  5.       private void getServerInfo() throws IOException {
          String url = textBox.getString();
          list.deleteAll();
          /**
          * HttpConnection を開く
          */ 
          HttpConnection hc = (HttpConnection) Connector.open(url);
    
          /**
          * 索引でヘッダーフィールドキーとヘッダーフィールドを
          * 取得し、list に挿入する。
          */
          list.setTitle(hc.getURL());   
          for (int i=0;hc.getHeaderFieldKey(i)!=null; i++){
          list.insert(i,hc.getHeaderFieldKey(i)+" :"+hc.getHeaderField(i),null);       
          }     
          /**
          * 終了時 ...
          */
          hc.close();
          } 
    
  6. ソースコード内で右クリックしてポップアップメニューから「インポートを修正」を選択するか、Ctrl+Shift+I キーを押します。
  7. public class MyWaitScreenMidlet extends MIDlet implements CommandListener { 文字列 (18 行目) を探し、次のように final を挿入します。
  8.  public final class MyWaitScreenMidlet extends MIDlet implements CommandListener {
  9. ソースコードから public MyWaitScreenMidlet() メソッド (38 行目) を探し、public MyWaitScreenMidlet() { のあとに次のコードを挿入します。
  10.  List list1 = getList();
  11. 「画面」をクリックして「画面」ビューに切り替え、SimpleCancellableTask を選択します。
  12. 「プロパティー」ウィンドウで、「Executable Code」プロパティーの省略符号ボタン (省略符号ボタン) をクリックします。
  13. 「Executable Code」ダイアログボックスで「ソースへ移動」をクリックします。
  14. ソースコードから getSimpleCancellableTask() メソッド (328 行目) を探し、public void execute() throws Exception { のあとの // write task-execution user code here とある箇所に次のコードを挿入します。
  15.  getServerInfo();

プロジェクトの実行

F6 キーを押して主プロジェクトを実行します。

「実行」>「主プロジェクトを実行」を選択する方法もあります。

ページの先頭へ

WaitScreen および SimpleCancellableTask コンポーネントの Javadoc

NetBeans IDE には、VMD で使用できるほかのコンポーネントと同様に、WaitScreen コンポーネントや SimpleCancellableTask コンポーネントの API Javadoc が用意されています。WaitScreen および SimpleCancellableTask コンポーネントの Javadoc を表示するには、次の手順を実行します。

  1. ソースコード内で WaitScreen または SimpleCancellableTask コンポーネントにカーソルを合わせて Ctrl-Shift-スペースキーを押します (または、「ソース」>「ドキュメントを表示」を選択します)。
    この要素の Javadoc がポップアップウィンドウに表示されます。
  2. ポップアップウィンドウで「外部 Web ブラウザにドキュメントを表示」アイコン (外部 Web ブラウザにドキュメントを表示) をクリックすると、WaitScreen または SimpleCancellableTask コンポーネントの詳細情報がブラウザに表示されます。

ページの先頭へ



関連項目

ページの先頭へ