Archive for 11月, 2005
データセンターで
さて、今日は技術系の話から少し脱線して季節ねたをかきます。
今、仕事の関係でデータセンターに通っているのですが、
データセンターってとても乾いているし空気も循環しているだけ、
おまけに誇りっぽいと、とても風邪菌が繁殖しやすい環境です。
実際、JavaOneが開催する直前もこのデータセンターに通っていて、
大風邪を引いてしまいました。
病院の先生に無理を言って、点滴を打ってもらったのですが、
開催日の前々日まで熱を出しておりました。
やっと風邪が治りって安心していて
今日また行くと少し喉が痛くなりました。
データセンター等に出かける皆様くれぐれも御気をつけてくださいね。
あと、これから、インフルエンザや風邪のはやるシーズンになりますが、
くれぐれも体調には気をつけましょう。
Creator2でValidatorの実装
今日は、JSFのバリデータを取り上げます。
まず、「ValidatorTest」という新規プロジェクトを作成して下さい。
そして、今までと同様、ドラッグ&ドロップにてコンポーネントを貼り付けます。
今回は、「Label」コンポーネントを2つ貼り付けて、プロパティを変更します。
ここでは「名前(漢字)」、「名前(カナ)」とします。
次に、「TextField」を2つ貼り付けてください。
そして「Message」コンポーネントを2つ貼り付けてください。
最後にボタンを2つ貼り付けます。
画面作成イメージ
次に、「TextField」コンポーネントと「Message」コンポーネントとの関連付けを
行います。
「Message」コンポーネント上で「Ctrl+Shiftキーを押した状態で
マウスでドラッグ」してください。そして「TextField」上でドロップしてください。
コンポーネントをドラッグした状態でマウスを移動すると「Message」
コンポーネントが青枠で囲まれて、波線が表示されます。
そして「TextField」上でドロップすると「Message summary for textField**」という
文字列が「Message」コンポーネント上に表示されます。
これで、「TextField」コンポーネントと「Message」コンポーネントの関連付けが完了です。
Validatorの設定(標準Validatorの利用)
それでは、実際にValidatorを使用していきます。
まず始めはJSF標準のValidatorを利用します。
今回は、入力された文字列の長さを検証する「LengthValidator」を使用します。
そして5文字以上10文字以内でなければエラーを出力するようにします。
それでは「TextField」コンポーネントのプロパティより「validator」のコンボボックスを
開き「(new LengthValidator)」を選択して下さい。
すると、プロパティの値は「lengthValidator1」に変更されます。
「maxLength」はValidatorの最大値の設定項目ではありません。
入力値の範囲の設定は、「Outline」タブの「lengthValidator1」を選択し
設定します。
「Outline」タブより「lengthValidator1」を押下してください。
すると、「Properties」タブに「maximum」、「minimum」を設定する項目が
表示されます。ここに適切な値(範囲)を設定してください。
今回は、maximum=15,minimum=5を入力します。
この状態で、プログラムを1度ビルドしてデプロイ、実行してみてください。
すると下記のような実行結果が得られます。
以上で、標準Validatorを使用したサンプルができましたが、如何でしょうか?
補足:
標準Validatorのエラーメッセージは、プロパティの値を上書きしていただく事で
メッセージを変更できます。例えば、LengthValidatorの場合、下記のプロパティを
作成して下さい。(詳細はJSFの関連書籍を参考にしてください。)
message.properties
javax.faces.validator.LengthValidator.MAXIMUM=15文字以上入力できません。
javax.faces.validator.LengthValidator.MINIMUM=5文字以上入力してください。
Validatorの設定(独自Validatorの作成)
次に独自のValidatorを作成しましょう。
まず、「TextField」でマウス右クリックをし「Edit Event Handler」から
「validate」を選択してください。
すると下記のコードが自動的に作成されるかと思います。
public void textField2_validate(FacesContext context, UIComponent component, Object value) {
// TODO: Check the value parameter here, and if not valid, do something like this:
// throw new ValidatorException(new FacesMessage(“Not a valid value!”));
}
この部分に独自コードを実装します。例えば半角カナと空白のみ入力を
受け付けるコードは下記のようになります。
public void textField2_validate(FacesContext context, UIComponent component, Object value) {
// TODO: Check the value parameter here, and if not valid, do something like this:
// throw new ValidatorException(new FacesMessage(“Not a valid value!”));
if(value instanceof String){
if(isKatakanaString((String)value) == false){
showErrorMessage(“カタカナを入力してください。”);
}
}else{
showErrorMessage(“不正な値です。”);
}
}
/**
* 引数で与えられた文字列をMessageコンポーネントに表示する。
*
* @param value – エラーメッセージ
*/
private void showErrorMessage(String errorMessage){
FacesMessage message = new FacesMessage(errorMessage);
message.setSeverity(FacesMessage.SEVERITY_ERROR);
throw new ValidatorException(message);
}
/**
* 入力された文字がカタカナかを判定する。
*
* @param value – 判定する文字列
* @return true:全角・半角カタカナ・全角空白・空白 false:不正文字列
*/
private boolean isKatakanaString(String value){
logger.debug(“isKatakanaString() started.”);
boolean returnValue = false;
for(int i=0;i<value.length();i++){
char code = value.charAt(i);
//カタカナと全角空白・半角空白ならばOK
/*
if(code >= 0x30a1 && code <= 0x30fe){ //全角カナ
returnValue = true;
}else if(code == 0x3000 ||
*/
if(code == 0x20){ //半角空白・全角空白
returnValue = true;
}else if(code >= 0xff61 && code <= 0xff9f){ //半角カナ
returnValue = true;
}else{
returnValue = false;
return returnValue;
}
}
return returnValue;
}
上記で、showErrorMessage()メソッドは重要ですが、ここで独自のエラーメッセージを
設定し、ValidatorException()を送出しています。
上記のコードの実行結果は下記の通りです。
実行例1
実行例2
補足
独自Validatorは、実際のプロジェクトでは標準Validatorを利用する以上に
よく使われるかと思います。しかし、isKatakanaString()メソッドのように切り分ける事で
JSFに精通していないJavaエンジニアも検証用のコードを記述することが可能になります。
そこでこのValidatorの実装はできるだけ作業分担しましょう。
最後に、今回紹介したValidatorも重要ですが、今後AJAXと併用してリアルタイムで
バリデーションを行う機能や入力補完機能と共に使われることも多くなってくるのでは
ないかと思いますので是非下記もチェックしてみてください。
https://bpcatalog.dev.java.net/nonav/ajax/textfield-jsf/design.html(AJAX Auto-Completion)
https://bpcatalog.dev.java.net/nonav/ajax/validation/design.html(Realtime Valiadtion)
次回は、コンバータかFileUploadを紹介します。
NetBeans4.1でSun Java System WS6.1にデプロイ
さて、今日はちょっとしたTipsを御紹介します。
NetBeansで開発をしていてSun Java System Web Server 6.1(AppServer7.x)に
Webアプリケーションをデプロイしたいという方はいないでしょうか?
NetBeans4.1で正式にサポートされているサーバは下記です。
NetBeansサーバプラグインより
- Java.net GlassFish Java EE 5 server (the Open Source Reference Implementation and production quality for Java EE 5 specification)
- Sun Java System Application Server 8.1 (A free J2EE 1.4 compliant application server from Sun)
- JBoss 4
- WebLogic 9
- WebSphere 6
私は、過去の案件でWeb Server6.1にデプロイをしたいという状況がありました。
その際、NetBeans4.1ではデフォルトでWS6.1が対応していなかった為、
自分でsun-web.xmlファイルを変更しました。
web/WEB-INFディレクトリ配下にsun-web.xmlファイルがあります。
これを、下記のようにsun-web-app_2_3-0.dtdベースに変更してみてください。
すると、NetBeans4.1でもWebServer6.1上に問題なくデプロイさせ動作させる
ことができます。
<?xml version=”1.0″ encoding=”UTF-8″?>
<!DOCTYPE sun-web-app PUBLIC “-//Sun Microsystems, Inc.//DTD Sun ONE Application Server 7.0 Servlet 2.3//EN” “http://www.sun.com/software/sunone/appserver/dtds/sun-web-app_2_3-0.dtd”>
<sun-web-app>
<context-root>/webapp</context-root>
<class-loader delegate=”true”/>
<jsp-config>
<property name=”classdebuginfo” value=”true”>
<description>Enable debug info compilation in the generated servlet class</description>
</property>
<property name=”mappedfile” value=”true”>
<description>Maintain a one-to-one correspondence between static content and the generated servlet class’ java code</description>
</property>
</jsp-config>
</sun-web-app>
Creator2でGoogle WebServiceを実装する
さて、本日は予定を変更してGoogleの検索WebServiceをCreator2で実装します。
作成するWebアプリケーションは、テキストフィールドに入力された検索キーワードを元に
Googleに問い合わせ、検索結果を表示するアプリケーションです。
作成イメージ
まず、実際にGoogleのWebServiceを利用する前に、Google Web APIについて、
簡単に御紹介します。
Google Web APIを使用するとWebアプリケーションの開発者は
自身のサイト上で直接Googleに問い合わせ、世界中のWebサイトを検索できるようになります。
GoogleはSOAPとWSDLを使用しているため、JavaやPerl等を使用して利用が可能です。
Googleが提供しているサービスとして以下があります。
- 検索
- キャッシュの取得
- スペルチェック
Google Web APIに関する詳細は下記を御参照ください。
Google Web APIs (beta)
次に、実際にアプリケーションを構築する前に、事前に準備していただく事が
一つだけあります。
それは、Google上でアカウントを作成していただく事です。
アカウントを取得後、「ライセンスキー」を取得してください。
ライセンスキーを使用すると1ライセンスキー辺り、1日に1000回まで検索することが
可能です。
ライセンスキーを取得するまでの大まかな流れは下記となりますので、
下記に従いライセンスキーを入手してください。
- Googleへの登録
- Googleからメールを受信
- 受信したメールに記述されているURLにアクセス
- ライセンスキーが記述されたメールを受信
ライセンスキーのサンプルを下記に示します(最後10桁は変更してます)。
kZ7RVhlQFHKFUh/ZN8h7epABCDEFGHIJ
問題なく、ライセンスキーは入手できましたか?
それでは、実際にGoogleの検索Webアプリケーションを作成していきましょう。
まず、今までと同様新規プロジェクトを作成してください。
プロジェクト名として「GoogleSearch」を指定してください。
次に、画面上に表示するコンポーネントをドラッグ&ドロップにて貼り付けてください。
ここでは、検索キーを入力するテキストフィールド「TextField」と、実行ボタン
「Button」、検索結果を表示するテーブル「Table」を貼り付けて下さい。
次に、検索結果を表示する表(テーブル)に対して、データプロバイダを指定します。
ここでは、デフォルトのデータプロバイダに変え、「Object Array Data Provider」を
指定します。
「Palette」タブより「Data Providers」を選択し「Object Array Data Provier」
を表示してください。このプロバイダを画面デザイン上の「Table」へドラッグ&ドロップ
します。
これにより、自動的に「Page1.java」に下記のコードが追加されます。
private ObjectArrayDataProvider objectArrayDataProvider1 = new ObjectArrayDataProvider();
public ObjectArrayDataProvider getObjectArrayDataProvider1() {
return objectArrayDataProvider1;
}
public void setObjectArrayDataProvider1(ObjectArrayDataProvider oadp) {
this.objectArrayDataProvider1 = oadp;
}
次に、WebServiceをプロジェクト上に配置します。
「Servers」タブより、「Web Services」→「Samples」→「GoogleSearch」を
選択してください。そして「GoogleSearch」を画面デザイン上にドラッグ&ドロップ
します。
すると、「Outline」タブ上に「googleSearchClient1」というプロパティが表示されている
事が確認できます。
(本来は上のデータプロバイダの指定の前にこの項目をやったほうがいいのですが、、)
次に、プロパティを追加します。追加するプロパティはGoogleからの検索結果を
格納する為の配列となります。
追加方法は、「Projects」タブの「Page1.java」ファイルを選択し、
マウス右クリックしてください。すると「Property」が表示されますので、
これを選択実行します。
「Property」を選択すると下記の画面が表示されます。
それぞれの項目に値を入力し、「OK」ボタンを押下してください。
プロパティの追加により、「Page1.java」に下記のコードが追加されます。
private webservice.googlesearchservice.ResultElement[] resultElement;
public webservice.googlesearchservice.ResultElement[] getResultElement() {
return this.resultElement;
}
public void setResultElement(webservice.googlesearchservice.ResultElement[] resultElement) {
this.resultElement = resultElement;
}
次に、先ほど作成した「Object Array Data Provider」と「resultElement」を対応させます。
まず、「Outline」タブより「objectArrayDataProvider1」を選択しプロパティ設定画面を
確認します。ここで「array」の要素のコンボボックスを押下すると、「resultElement」が
追加されていることが確認できますので、これを選択します。
これで、「Object Array Data Provider」と「resultElement」の対応付けが完了です。
それでは画面デザインに戻ってください。Tableのデータは今までの操作で
「resultElement」の値を対応付けさせました。
そこで「resultElement」の構成要素から表示項目を選択します。
表示項目の選択は、「Table」よりマウス右クリックにて「Table Layout」を選択します。
次に、項目中よりタイトル(title)・要約(snippet)・URLを選択します。
以上で表示項目の選択は完了です。
以上が終了すると画面デザインは下記のように変更されていることが
確認できます。
最後に、ボタン押下時の処理を記述してください。
画面デザインで、ボタンをダブルクリックしてJavaソースエディタを開いてください。
そして下記のコードを記述してください。
#下記では便宜上、例外処理等、詳細な実装は抜いています。
public String button1_action() {
String searchString = (String)textField1.getText();
try{
GoogleSearchClient sclient = getGoogleSearchClient1();
GoogleSearchResult result = sclient.doGoogleSearch(“kZ7RVhlQFHKFUh/ZN8h7epABCDEFGHIJ”, //Googleライセンスキー
searchString, //検索キーワード
0,
10, //検索結果の最大件数
false,
“lang_ja”,
false,
null,
null,
null);
resultElement = result.getResultElements();
objectArrayDataProvider1.setArray(resultElement);
}catch(Exception e){
return “error”;
}
return null;
}
上記のコードを実装後、ビルド・デプロイして実行してください。
Google検索Webアプリケーションの実行結果、下記の画面が表示されます。
補足:
「Servers」タブで「GoogleSearch」を選択した際に、処理可能な内容(メソッド)が表示されますが、
Creator2上から簡単にテストできます。
「GoogleSearch」より「doGoogleSearch」を選択してください。
ここで、マウス右クリックにて「Test Method」という項目が表示されます。
これを選択してください。
「Test Method」にて表示される画面にて必要項目を入力し「Submit」ボタンを押下します。
すると、「Results」欄に結果が表示されます。
以上で、Creator2を使用したWebサービスの使い方について説明しましたが、如何ですか?
とても簡単にWebサービスを利用できますよね!!
他にもWebサービスに関するサンプルが多くあるので、是非試してみてください。
また、今回は、とりあえずGoogleのWebServiceを使ってみるということが目的だったため、
WSDLの登録や表示項目についての詳細は取り上げませんでした。
(リンクを押下しても画面遷移されない等。)
この辺は、また後日説明します。
次回は、ナビゲーションか、バリデータどちらかを紹介する予定です。
James GoslingのT-Shirtsなげコンテストも開始
James GoslingのBlogによると、
来年、サンフランシスコで開催されるJavaOne2006のT-Shirts投げコンテストの方も
スタートし始めたようです。皆様も是非クールなT-Shirts投げ機を考えて、
JavaOneの無料チケットをゲットしていただければと思います。
http://blogs.sun.com/roller/page/jag
UIコンポーネントとDBのバインド
さて、本日は、UIコンポーネントとDBのバインドについて説明します。
今回のプログラムは、前回のプログラムを少し改造して作成を行います。
実行結果:
DBより人間の名前を取得しドロップダウンリスト(コンボボックス)上に
表示させます。
そして、リストより名前を選択し、ボタンを実行すると対応する人に対して、
「こんにちは、***さん」と表示するプログラムを作成します。
事前情報:
まず、プログラムを作成する前に、事前情報を少し話しします。
今回、ここで提供したい情報はCreator2がJDBCのRowSetをサポートしている
ということです。
JSR 114: JDBC Rowset Implementations
このJDBC RowSet(行セット)テクノロジにより、Creatorでは、
データベースにドラッグ & ドロップでグラフィカルに
アクセスしたり、照会をグラフィカル編集したりできます。
加えて、JDBC 互換の為、Creator から、広範囲の SQL データベース
を利用できるようになります。
プログラムの作成:
さて、前置きはここまでにして、実際にプログラムを作成していきましょう。
まず、前回のプロジェクトからテキストフィールドを削除してください。
削除は、テキストフィールドを選択し、マウスの右ボタンをクリックします。
そして、「Delete」を選択実行するとコンポーネントを削除できます。
そしてDropDownListコンポーネントをドラッグ&ドロップにて、
画面に貼り付けてください。すると下記の画面が表示されます。
ここで、下記の「outline」パレットを確認してください。
デフォルトで設定されている、dropDownListコンポーネントのオプションの値が
確認できます。仮に現在の状態でプログラムを実行するとドロップダウンリスト
(コンボボックス)には「Item1」、「Item2」、「Item3」の文字列が表示され
選択可能になっていることが確認できます。
UIコンポーネントとDBテーブルのバインド
この状態は、まだDBにはバインドされていませんが、これからdropDownList
コンポーネントをDBのテーブルにバインドする方法を行います。
今回は、DBテーブルとしてCreator2にデフォルトで登録されている、「Person」
テーブルにバインドします。
補足:CreatorはデフォルトでPointBaseという簡易データベースサーバが同梱されています。
手順として、まず「Server」タブを選択します。「Server」タブ中の「Data Sources」
ツリーより、「Trabel」→「Tables」→「PERSON」テーブルを表示させます。
そして、「PERSON」テーブルをドラッグ&ドロップでdropDownListコンポーネント上に
配置します。
すると、dropDownListコンポーネント上に表示されていた、「Item1」の項目は
「abc」という文字列に変わります。
ここで、ドロップダウンリスト上で選択可能な表示項目、そして選択した後の
実行結果を設定します。ドロップダウンリスト上でマウス右クリックを押下して
ください。すると下記の項目が表示されます。ここで「Bind to Data」を実行します。
「Bind to Data」を実行すると下記の画面が表示されます。
ここで、「Value Field」と「Display Field」を選択します。
今回の例では、表示も実行結果も人間の名前を設定したい為、両方ともに、
「PERSON.NAME」を選択し「OK」ボタンを押下してください。
これで、UIコンポーネントとDBへのバインドは完了です。
とても簡単ですよね!!
さて、それではこのプログラムの実装を行いたいと思います。
前回のプロジェクトと同様、画面デザインに戻って、「こんにちは」ボタンを
ダブルクリックしてください。
すると、button1_action()メソッドを記述する画面が表示されるかと思います。
ここで、下記のコードを記述してください。
public String button1_action(){
//TODO: Replace with your code
String name = (String) dropDown1.getSelected();
String splitnames[] = name.split(“,”);
staticText1.setText(“こんにちは” + splitnames[1] + “さん!!”);
return null;
}
コードを若干説明します。ドロップダウンリストをドラッグ&ドロップした際、
dropDown1というIDが割り当てられ、そしてCreatorにより自動的に
下記のコードが生成されています。今回、DropDownクラスのインスタンスメソッド
getSelected()を実行し、選択された値を取得しています。
取得した文字列(名前)は、”,”(カンマ)によって分割されたFirstNameと
LastNameとなっています。今回LastNameだけを表示させるため、文字列を分割して
表示させています。
private DropDown dropDown1 = new DropDown();
public DropDown getDropDown1() {
return dropDown1;
}
public void setDropDown1(DropDown dd) {
this.dropDown1 = dd;
}
さて、上記のコードを記述したら、後は「Build」して実行します。
無事コンパイル(Build)は完了しましたか?実行すると下記のような
実行結果が得られるかと思います。
最後に、先ほどは表示名と返り値を共に「PERSON.NAME」としましたが、
色々と変えて実行してみてください。
以上で、UIコンポーネントとDBテーブルとのバインドについて説明しましたが、
問題なくできたでしょうか?
次回は、HTMLの<TABLE>(表)に対してDBテーブルをバインドさせる方法について
記載する予定です。
Yahoo AJAX 対応 (an aerial photograph.)
YahooもGoogle Mapと同様マウスでスクロール可能な地図を
発表したようです。(β版のようですが)。これも最近話題の、
AJAX(Asynchronous JavaScript+XML)という技術で実装されています。
下記の写真はSun Microsystemsの用賀オフィスを航空写真で表示した
地図ですが、マウスで中心を移動させるとスムーズに画像が切り替わります。
さて、紹介はさておき、今後Webアプリケーションを作成していく上で、
今後も益々AJAXは使用されてくるようになるかと思います。
AJAXとJSFを組み合わせた使い方は世の中に数多く報告されてきていますが、
下記にSun Java Studio Creatorを使用したAJAX JSFのサンプル作成チュートリアルが
記載されていますので、御紹介します。
http://developers.sun.com/prodtech/javatools/jscreator/ea/jsc2/learning/tutorials/textcompletion.html
ぷらっとフォーム閉店(T_T)
もう、すでに他の方もブログに書かれているが、
「ぷらっとフォーム」が閉店になるそうな。。
http://www.itmedia.co.jp/news/articles/0511/14/news062.html
私も、大学時代にLinuxやFreeBSDで研究室のネットワーク管理を行っていて、
その際にはこちらで随分お世話になってました。
最近は、めっきり行く機会がなかったんですが、(秋葉自身にあまり行かなくなってる)
実際に閉店になると聞くと少し寂しい気分です。
おそらくうちの社員も数多く訪問していたのではないかと思うけれど、
私が大学当時は、秋葉でUnix系の製品を扱っているのはこのぷらっとフォーム
Amulet(アミュレット?!)だったっけ?しかなく、色々な情報収集や
グッズを購入するため良く足を運んだものでした。
(今でも自宅の自作PCケースにはぷらっとフォームで購入したペンギンロゴの
シールを貼り付けています。)
大学時代をふと振り返り、懐かしく、また少し寂しくなったニュースでした。
Creator2によるHelloWorldプロジェクトの作成
今回より実際に、プロジェクトを実装していくことになりますが、
プロジェクトを進めていく上で重要な画面機能について理解する必要があります。
それは、下記の「Projectsタブ」と「Filesタブ」です。
「Projectsタブ」で表示される項目ファイル等はプロジェクトを実装する上で
必要な項目が含まれます。「Filesタブ」はOSのファイルシステム上に存在する
ファイルを示し、プロジェクトで削除された項目を実際にファイルシステム上から
削除したいような場合は、こちらのタブを使用してください。
Projectsタブ | Filesタブ |
次に、画面を作成する為に使用するパレットについて説明します。
Creator2ではCreator1を使用して実際に開発を行っている、
開発者からの多くの声を反映し非常によく使われるコンポーネント
(ファイルアップロードやカレンダー等)を標準で利用できるように
なっています。
また、この独自拡張UIコンポーネントを使用する事を前提として
作成されているため、逆にJSFの標準タグのみを使用して画面を
作成する事は難しくなります。
(Creator1のプロジェクトをインポートすると作成できると
Creator2のエンジニアから言われているがまだ実際には試していません。)
ただし、利点として今までファイルアップロード、カレンダー、Tree等の
コンポーネントを利用したい場合、MyFacesもしくは、独自に作成しなければ
利用できなかったのですが、Creator2を利用するとこれらが簡単に
利用できるようになります。
Creator2の拡張コンポーネントを利用した場合、JSP中では、<ui:***>
というタグが使用されます。
UIタグの使用例(ボタン):
<ui:button action=”#{Page1.button1_action}” binding=”#{Page1.button1}” id=”button1″ style=”left: 288px; top: 72px; position: absolute” text=”ボタン”/>
Basic パレット(Creator2独自拡張) | Standard パレット(JSF標準) |
それでは、画面を作成していきましょう。
画面を作成する方法は非常に簡単でパレットよりコンポーネント
(ボタン、テキストフィールド等)をドラッグ&ドロップして画面
(グリッド表示されている画面)に配置していきます。
配置した際のイメージは下記のようになります。
ここで、赤線で引いた部分「Design」、「JSP」、「Java」とありますが、
それぞれを押下すると、デザインに対応するJSPファイル、Javaファイルを参照
できます。
(Creatorで画面を作成すると対応する***.jsp,***.javaが自動作成されます。)
上記の画面に対応するJSPのコードは下記となります。
ここで、画面デザインに一度戻ります。
個々のコンポーネントはそれぞれプロパティをもっています。
下記に、ボタンとテキストフィールドのプロパティをしめします。
ここで、ボタンの表示名やテキストフィールドの初期値を設定することができます。
それ以外にも多くのプロパティが存在しますので、それぞれ確認してください。
ボタンプロパティの編集
テキストプロパティの編集
コンポーネントプロパティの編集を完了すると、
最後に実装コードを記述します。
実装は、画面デザインに作成したコンポーネントをダブルクリックして編集します。
下記の例では、ボタンが押下された際の処理を記述するために、
ボタンをダブルクリックした際に表示されるコードを示します。
public String button1_action() {
// TODO: Process the button click action. Return value is a navigation
// case name where null will return to the same page.
return null;
}
ここでは、Text Fieldコンポーネントに入力された値を取得し、
Static Textに入力値を表示するコードを記述します。
コードは下記のようになります。
public String button1_action() {
// TODO: Process the button click action. Return value is a navigation
// case name where null will return to the same page.
String name = (String)textField1.getText();
staticText1.setText(“こんにちは” + name + “さん!!”);
return null;
}
これで入力された値を表示するプログラムの完成です。
しかし、ここで疑問がでる方もいらっしゃるかと思います。
何故、textField1.getText()で入力値が取得できるの?
これに対しては、明確な理由があります。下記に理由を説明します。
まず、Creator2の「Design」にて画面作成した全コンポーネントには、
それぞれのコンポーネントを一意に識別するIDが存在します。
たとえば、Text Fieldのコンポーネントを貼り付けると、画面右部に
下記のプロパティが表示されることがわかります。
– General
(id) textField1
このIDがこのText Fieldコンポーネントを識別するIDとなります。
「Design」にて画面にコンポーネントを貼り付けた後、
作成されたJSPのコードを確認します。
すると、下記のJSPコードが自動生成されていることを確認できます。
ここで、先ほどの「Design」で入力したIDに一致するid=”textField1″が
存在していることがわかります。
<ui:textField binding=”#{Page1.textField1}” id=”textField1″/>
また、ここで注目して頂きたい部分がbinding=”#{Page1.textField1}”
の部分です。
これは、Page1というManaged BeanのプロパティtextField1に値をバインドしている
ということです。
では、そのManaged BeanのtextField1の実体はどこに存在しているのでしょう。
これは、「Java」を選択して表示されるPage1.javaファイル中に存在します。
デフォルトで非表示部分に記述されていますので、Page1.javaより探してみましょう。
public class Page1 extends AbstractPageBean {
のクラス定義直後に下記のタブが存在していることを確認できます。
これを展開してみましょう。
+ [Creator-Managed Component Definition]
すると、Creatorが自動的に作成したコンポーネントに1対1で対応する
インスタンス変数、セッター、ゲッターが存在することが確認できます。
private TextField textField1 = new TextField();
public TextField getTextField1() {
return textField1;
}
public void setTextField1(TextField tf) {
this.textField1 = tf;
}
先ほど、皆様は、Page1.java中のbutton1_action()メソッド中から
textField1.getText()を呼び出しました。
つまり、これは通常のインスタンス変数のメソッドを実行しているのと
同じことが理解できます。
以上で、「Design」、「JSP」、「Java」についての説明を行いましたが、
理解されましたか?
以上、コードの入力を完了しプロジェクトを実行してみましょう。
Creator2のメニューより、「Run」→「Run Main Project」を実行します。
実行結果、ブラウザに下記のような結果が得られます。
補足1
上記で、binding=”#{Page1.***}”と記述しましたが、これは
managed-beans.xmlファイル中で定義しています。
これは、hellowwebパッケージ中のPage1クラスをPage1として参照可能であることを
定義しています。またこのPage1というBeanはrequestスコープで使用することを
定義しています。
<managed-bean>
<managed-bean-name>Page1</managed-bean-name>
<managed-bean-class>helloweb.Page1</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
補足2
最後に、今後、Creator2を御使用いただいていただく上でのTipsを一つ
御紹介します。
コードを入力する際に、「Ctrl + Space」(Solaris,Linuxの場合 Ctrl + \)を
入力してください。すると自動的にコード補完を行ってくれますので、
入力の際に非常に役立ちます。
今回は、簡単なプロジェクトの作成方法についてまなびました。
次回は、コンポーネントを使ったDBへのリンクについて説明します。
起動とプロジェクトの作成方法について
Sun Java Studio Creator2の起動
インストールが正常に完了しプログラムを実行すると下記の画面が表示されます。
これが、Creator2のインストール直後の起動画面になります。
JSFの新規プロジェクトの作成
上記画面で、「Create New Project」ボタンを押下すると
プロジェクトを作成することができます。
そして、今回JSFのアプリケーションを作成しますので、
「JSF Web Application」を選択し「Next >」ボタンを押下します。
すると下記の画面が表示されます。そして「Project Name」にプロジェクト名を入力し、
最後に「Finish」ボタンを押下します。
これで、Sun Java Studio Creator2の新規プロジェクトが作成されます。
新規プロジェクトが作成されると下記の画面が表示されます。
正常にプロジェクトは作成できましたか?
御覧頂いたようにとても簡単にプロジェクトを作成できます。
JSFのWeb Application以外にもさまざまなプロジェクトを作成できますので、
それぞれ試してみてください。
次回は、HelloWebアプリケーションの実装について記載します。