blob: 167ad0150ef5d2d277589f85a372b22be0cad6a0 [file] [log] [blame]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- Copyright (c) 2009, 2010, Oracle and/or its affiliates. All rights reserved. -->
<!-- Use is subject to license terms.-->
<html>
<head>
<title>ビジュアルモバイルデザイナのカスタムコンポーネント: Java ME アプリケーションでのスプラッシュ画面の使用 - NetBeans IDE チュートリアル</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
<link rel="stylesheet" type="text/css" href="../../../netbeans.css">
<meta name="Karol Harezlak" content="NetBeans Visual Mobile Designer">
</head>
<body>
<a name="top"></a>
<h1>ビジュアルモバイルデザイナのカスタムコンポーネント: Java ME アプリケーションでのスプラッシュ画面の使用</h1>
<p>スプラッシュ画面は、アプリケーションの Look &amp; Feel を向上するために使用されます。通常、スプラッシュ画面をプログラムの起動時に使用したり、またはロゴやブランド情報を表示するために使用します。この画面が、アプリケーションに対するユーザーの最初の印象を形作ります。NetBeans のビジュアルモバイルデザイナ (VMD) には、VMD パレットにスプラッシュ画面のカスタムコンポーネントが含まれています。この短い例では、NetBeans でスプラッシュ画面コンポーネントを使用して、新しい Java ME プロジェクトを作成する方法を示します。この機能を使用して独自のスプラッシュ画面を設計および実装する機能の使用方法も説明します。</p>
<p>NetBeans でのモバイルアプリケーション開発に習熟していない場合、次に進む前に「<A HREF="quickstart.html">NetBeans Java ME MIDP 開発のクイックスタートガイド</A>」から始めることをお勧めします。</p>
<!--<p class="notes"><b>注:</b> NetBeans IDE 6.8 を使用している場合、<a href="../../68/javame/splashscreen.html">「Java ME アプリケーションでのスプラッシュ画面の使用」(NetBeans IDE 6.8)</a> チュートリアルを参照してください。</p>-->
<h3>目次</h3>
<img src="../../../images_www/articles/69/netbeans-stamp-69-70-71.png" class="stamp" alt="このページの内容は NetBeans IDE 6.9 以降が対象です" title="このページの内容は NetBeans IDE 6.9 以降が対象です" >
<ul>
<li><a href="#sample" title="サンプルアプリケーションのインストールと実行">サンプルアプリケーションのインストールと実行</a></li>
<li><a href="#create" title="スプラッシュ画面カスタムコンポーネントを使用したモバイルアプリケーションの作成">スプラッシュ画面カスタムコンポーネントを使用したモバイルアプリケーションの作成</a>
<div>
<ul>
<LI><A HREF="#create">SplashScreenExample プロジェクトの作成</A> </LI>
<LI><A HREF="#add">プロジェクトへのパッケージとビジュアル MIDlet の追加</A> </LI>
<li><a href="#addcomponent">MySplashScreenMidlet へのコンポーネントの追加</a></li>
<li><a href="#timeout">スプラッシュ画面コンポーネントの「タイムアウト」プロパティーの変更</a></li>
<li><a href="#addexit">フォームコンポーネントへの終了コマンドおよび戻るコマンドの追加</a></li>
<li><a href="#addimage">画像リソースの追加</a></li>
<li><a href="#bindimage">コンポーネントへの画像のバインド</a></li>
<li><a href="#connect">コンポーネントの接続</a></li>
<LI><A HREF="#run">プロジェクトの実行</A> </LI>
</ul>
</div>
</li>
<li><a href="#javadoc-splashscreen" title="スプラッシュ画面コンポーネントの Javadoc">スプラッシュ画面コンポーネントの Javadoc</a></li>
<li><a href="#nextsteps" title="関連項目">関連項目</a></li>
</ul>
<p><b>このチュートリアルを完了するには、次のソフトウェアとリソースが必要です。</b></p>
<table>
<tbody>
<tr>
<th class="tblheader" scope="col">ソフトウェアまたはリソース</th>
<th class="tblheader" scope="col">必須バージョン</th>
</tr>
<tr>
<td class="tbltd1"><a href="https://netbeans.org/downloads/index.html">NetBeans IDE と Java ME</a></td>
<td class="tbltd1">version 6.9 以降 </td>
</tr>
<tr>
<td class="tbltd1"><a href="http://www.oracle.com/technetwork/java/javase/downloads/index.html">Java Development Kit</a> (JDK)</td>
<td class="tbltd1">version 6 または version 7 </td>
</tr>
</tbody>
</table>
<h2><a name="sample"></a>サンプルアプリケーションのインストールと実行</h2>
<p>始める前に、チュートリアルの最終結果を確認します。 <br>
次の手順で <tt>SplashScreenExample</tt> アプリケーションをインストールします。</p>
<ol>
<li><a href="https://netbeans.org/projects/samples/downloads/download/Samples/Mobile/SplashScreenExample.zip">SplashScreenExample.zip</a> をダウンロードします。</li>
<li>ファイルを展開します。 </li>
<li>「プロジェクト」ウィンドウは次のようになります。
<p class="align-center"><img src="../../../images_www/articles/71/mobility/splashscreen/splash-open.png" border=1 alt="SplashScreen プロジェクトが表示された「プロジェクトを開く」ウィンドウ" > </p>
</li>
<li>「プロジェクト」ウィンドウでプロジェクトノードを右クリックし、「プロジェクトを実行」を選択します (または F6 キーを押す)。アプリケーションが実行されると、エミュレータウィンドウが開き、デフォルトのデバイスエミュレータでアプリケーションが実行されるところが表示されます。 </li>
<li>「エミュレータ」ウィンドウで「起動」の下のボタンをクリックします。次に示すように、エミュレータでスプラッシュ画面が表示されます。
<p class="align-center"><img src="../../../images_www/articles/71/mobility/splashscreen/splash-emulator.png" border=1 alt="10 秒間待つか、任意のキーを押して閉じるかをたずねるスプラッシュ画面が表示されたデバイスエミュレータ"></p>
</li>
</ol>
<p class="align-center"><a href="#top">ページの先頭へ</a></p>
<h2><a name="create"></a>スプラッシュ画面カスタムコンポーネントを使用したモバイルアプリケーションの作成 </h2>
<div class="indent">
<p>スプラッシュ画面コンポーネントが動作するところを確認できたので、最初に戻ってこのアプリケーションを作成します。アプリケーションを作成するには、次の手順を実行します。 </p>
</div>
<ol>
<li> <a href="#creating">SplashScreen プロジェクトの作成</a></li>
<li> <a href="#addpackage">プロジェクトにパッケージとビジュアル MIDlet を追加する</a>
</li>
<li><a href="#addcomponent">MySplashScreenMidlet へのコンポーネントの追加</a></li>
<li><a href="#timeout">スプラッシュ画面コンポーネントの「タイムアウト」プロパティーの変更</a></li>
<li><a href="#addexit">フォームコンポーネントへの終了コマンドと戻るコマンドの追加</a></li>
<li><a href="#addimage">画像リソースの追加</a></li>
<li><a href="#bindimage">コンポーネントへの画像のバインド</a></li>
<li><a href="#connect">コンポーネントの接続</a></li>
<li><a href="#run">プロジェクトを実行する</a></li>
</ol>
<h3 class="tutorial"><a name="creating"></a>SplashScreen プロジェクトの作成</h3>
<ol>
<li><tt>ファイル</tt>」&gt;「<tt>新規プロジェクト</tt>」(Ctrl-Shift-N) を選択します。「カテゴリ」から「Java ME」を選択します。「プロジェクト」で「モバイルアプリケーション」を選択して、「次へ」をクリックします。 </li>
<li> 「プロジェクト名」フィールドに「<code>SplashScreenExample</code>」と入力します。「プロジェクトの場所」をシステム上の任意のディレクトリに変更します。このディレクトリを <tt>$PROJECTHOME</tt> とします。 </li>
<li> 「Hello MIDlet を作成」チェックボックスの選択を解除します。「次へ」をクリックします。 </li>
<li> 「エミュレータプラットフォーム」は、「Sun Java Wireless Toolkit 2.5.2」を選択したままにしておきます。「完了」をクリックします。 </li>
<!--li> Click Finish on the Add Additional Configurations dialog to create the project.
The Projects window displays the project sources and metadata such
as the project Ant script. The application itself is displayed in the Flow
Design window of the Visual Mobile Designer. </li-->
</ol>
<h3 class="tutorial"><a name="addpackage"></a>プロジェクトへのパッケージとビジュアル MIDlet の追加</h3>
<ol>
<li> 「プロジェクト」ウィンドウで <code>SplashScreenExample</code> プロジェクトを選択し、「<tt>ファイル</tt>」&gt;「<tt>新規ファイル</tt>」(Ctrl-N) を選択します。「カテゴリ」から「Java」を選択します。「ファイルの種類」として「Java パッケージ」を選択します。「次へ」をクリックします。 </li>
<li> 「パッケージ名」フィールドに「<code>splashscreenexample</code>」と入力します。「完了」をクリックします。 </li>
<li> 「プロジェクト」ウィンドウで <code>splashscreenexample</code> パッケージを選択し、「<tt>ファイル</tt>」&gt;「<tt>新規ファイル</tt>」(Ctrl-N) を選択します。「カテゴリ」にある「MIDP」を選択します。「ファイルの種類」として「ビジュアル MIDIlet」を選択します。「次へ」をクリックします。 </li>
<li> 「MIDlet 名」フィールドと「MIDP クラス名」フィールドに「<code>MySplashScreenMIDlet</code>」と入力します。「完了」をクリックします。 </li>
</ol>
<h3 class="tutorial">MySplashScreenMidlet へのコンポーネントの追加<a name="addcomponent"></a></h3>
<ol>
<li> ビジュアル MIDlet を「フロー」ウィンドウに切り替えます。次の画面コンポーネントをパレットからドラッグし、フローデザイナにドロップします。
<ul>
<li>スプラッシュ画面</li>
<li>フォーム</li>
</ul>
</li>
<li> スプラッシュ画面コンポーネントは、フローデザイナで次のように表示されます。
<p class="align-center"><img src="../../../images_www/articles/71/mobility/splashscreen/splash-flowscreen.png" border=1 alt="選択したコンポーネントを表示した VMD の「フロー」デザインビュー" ></p></li>
<li><tt>splashScreen1</tt>」コンポーネントを選択します。このコンポーネントの「プロパティー」で、「タイトル」を「<code>Splash Screen</code>」に変更し、「<code>Wait for 10 sec. or press a key to close it</code>」と「<tt>テキスト</tt>」プロパティーに入力します。</li>
<li>フォームコンポーネントを選択し、「タイトル」プロパティーを「<code>Form</code>」に変更します。</li>
<li>「フロー」ウィンドウのフォームコンポーネントをダブルクリックし、スクリーンデザイナに切り替えます。</li>
<li>パレットにあるフォームの項目セクションから「<tt>StringItem</tt>」コンポーネントを選択し、これをドラッグして「form1」にドロップします。</li>
<li>スクリーンデザイナの「<tt>stringItem1</tt>」をダブルクリックします。タイトル「<tt>stringItem1</tt>」を削除し、「<code>&lt;Enter Text&gt;</code>」を「<code>Press Exit to close application</code>」に変更します。</li>
</ol>
<h3 class="tutorial">スプラッシュ画面コンポーネントの「タイムアウト」プロパティーの変更<a name="timeout"></a></h3>
<ol>
<li>「ビジュアルモバイルデザイナ」ウィンドウの最上部の「フロー」を選択し、「フロー」デザインビューを再度開きます。</li>
<li>スプラッシュ画面コンポーネントを選択します。 </li>
<li>「プロパティー」ウィンドウで「<tt>タイムアウト</tt>」プロパティーを見つけ、値を「<tt>5000</tt>」から「<tt>10000</tt>」ミリ秒に変更します。</li>
</ol>
<h3 class="tutorial">フォームコンポーネントへの終了コマンドおよび戻るコマンドの追加<a name="addexit"></a></h3>
<p>パレットの「コマンド」セクションから「<tt>終了コマンド</tt>」を選択し、ドラッグして「form1」コンポーネントにドロップします。 </p>
<h3 class="tutorial">画像リソースの追加<a name="addimage"></a></h3>
<ol>
<li>
<tt>splash.png</tt> ファイルを <code>$PROJECTHOME/src/splashscreenexample</code> フォルダにコピーします。
</li>
<li> <tt>splashScreen</tt> コンポーネントを右クリックし、ポップアップメニューから「プロパティー」を選択します。 </li>
<li>
「プロパティー」ダイアログボックスで、「画像」プロパティーの省略符号ボタン (<img src="../../../images_www/articles/71/mobility/splashscreen/ellipsis-button.png" border=1 alt="省略符号ボタン" >) をクリックします。 </li>
<li> 「画像」ダイアログで「追加」をクリックします。<br>
image1 コンポーネントが追加されます。</li>
<li>「開く」ダイアログボックスで、コピーされた <tt>splash.png</tt> ファイルへのパスを指定します。<br>
画像が追加されます。</li>
<li>「了解」をクリックして「開く」ダイアログボックスを閉じます。</li>
<li>「閉じる」をクリックして「プロパティー」ダイアログボックスを閉じます。</li>
</ol>
<a name="bindimage"></a>
<h3 class="tutorial">コンポーネントへの画像のバインド</h3>
<ol>
<li><tt>splashScreen1</tt>」コンポーネントを選択します。 </li>
<li> 「プロパティー」ウィンドウで、ドロップダウンメニューを使用して「画像」プロパティーを「image1」に変更します。コンポーネントをダブルクリックして、スクリーンデザイナでスプラッシュ画面を開きます。次のような画面が表示されるはずです。
<p class="align-center"><img src="../../../images_www/articles/71/mobility/splashscreen/splash-screendesigner.png" border=1 alt="画像と「Wait 10 sec. or press a key to close it.」というテキストが表示されたスプラッシュ画面" ></p>
</li>
</ol>
<h3 class="tutorial">コンポーネントの接続<a name="connect"></a></h3>
<p>「フロー」ビューで開始ポイントをクリックし、矢印を <tt>splashscreen1</tt> コンポーネントにドラッグします。同様に、次の図に示すようにコンポーネントを接続します。</p>
<p class="align-center"><img src="../../../images_www/articles/71/mobility/splashscreen/splash-flow.png" border=1></p>
<h3 class="tutorial">プロジェクトの実行<a name="run"></a></h3>
<p>F6 キーを押して主プロジェクトを実行します。あるいは、「<tt>実行</tt>」&gt;「<tt>主プロジェクトを実行</tt>」を選択してもかまいません。</p>
<h2><a name="javadoc-splashscreen"></a>スプラッシュ画面コンポーネントの Javadoc</h2>
<P>NetBeans IDE には、<tt>スプラッシュ画面</tt>コンポーネントや、VMD で使用できるその他のコンポーネントに関する API Javadoc が用意されています。<tt>スプラッシュ画面</tt>コンポーネントの Javadoc を表示するには:
</P>
<OL>
<li>ソースコードの<tt>スプラッシュ画面</tt>コンポーネントにカーソルを合わせ、Ctr-Shift- スペースキーを押します (または「<tt>ソース</tt>」&gt;「<tt>ドキュメントを表示</tt>」を選択します)。<br>
この要素の Javadoc がポップアップウィンドウに表示されます。 </li>
<li>ポップアップウィンドウで「外部 Web ブラウザにドキュメントを表示」アイコン (<img src="../../../images_www/articles/71/mobility/splashscreen/show-doc-button.png" alt="「外部 Web ブラウザにドキュメントを表示」">) をクリックすると、<tt>スプラッシュ画面</tt>コンポーネントについての詳細な情報がブラウザに表示されます。</li>
</OL>
<div class="feedback-box"><a href="/about/contact_form.html?to=6&subject=Using%20Splash%20Screens%20in%20Java%20ME%20Applications">ご意見をお寄せください</a></div>
<br style="clear:both;" >
<p class="align-center"><a href="#top">ページの先頭へ</a></p>
<h2><a name="nextsteps"></a>関連項目</h2>
<ul>
<li><a href="smscomposer.html">ビジュアルモバイルデザイナのカスタムコンポーネント: SMS コンポーザアプリケーション</a></li>
<li><a href="filebrowser.html">ビジュアルモバイルデザイナのカスタムコンポーネント: モバイルデバイスのファイルブラウザの作成</a></li>
<li><a href="pimbrowser.html">ビジュアルモバイルデザイナのカスタムコンポーネント: PIM (Personal Information Manager) アプリケーションの作成</a></li>
<li><a href="loginscreen.html">ビジュアルモバイルデザイナのカスタムコンポーネント: モバイルログイン画面の作成</a></li>
<li><a href="waitscreen.html">ビジュアルモバイルデザイナのカスタムコンポーネント: モバイルアプリケーション用の待機画面の作成</a></li>
<li><a href="tableitem.html">ビジュアルモバイルデザイナのカスタムコンポーネント: Java ME アプリケーションでの表項目の使用</a></li>
<li><a href="http://wiki.netbeans.org/VisualMobileDesignerPalatteReference">参照: ビジュアルモバイルデザイナのパレットのガイド</a></li>
</ul>
<p class="align-center"><a href="#top">ページの先頭へ</a></p>
</body>
</html>