NetBeansによるテキスト入力処理

第3回目のエントリーではSwingを使ったGUIアプリケーションにボタンを追加してラベルの内容を変える事を学びました。NetBeansでは、ラベルの情報はプロパティとして管理され、ボタンへのアクションはダブルクリックで追加できたのです。あまりプログラムを作っているような感じがしなかったと思います。今回もNetBeansの機能を使ってプログラムを作っていきますが、自然にプログラムで重要なことが学べるようになっていますのでご安心ください。やはり変数はまだ使いません*1
今回のエントリーではテキストフィールドを設置し、入力された文字列を大文字に変換するアプリケーションを作成します。

テキストフィールド

これまでのエントリーでは、Swingコントロールのラベルとボタンを使いました。今回のエントリーでは入力可能なテキストフィールドを使います。テキストフィールドはHTMLの画面と同様に1行の文字列を入力することができるSwingコンポーネントです。ログインフォームや商品データの入力フォームなどラベルとボタンに次いでよく使うコンポーネントです。
プロジェクトは前回のエントリーのものを引き続き拡張していきます。プロジェクトを開いたならば、プロジェクトツリーからMyFrameを開きデザインビューを開いてください。テキストフィールドもラベルやボタンと同様に、パレットのSwingコントロールからドラッグ&ドロップで画面に追加することができます。

テキストフィールドを追加したならば、初期表示されているテキストを削除するためにプロパティのtextを削除します。

テキストフィールドの幅が非常に狭くなってしまいました。これは、テキストフィールドの中に含まれる文字列の長さから計算された幅に調整されているのが原因です。当然、テキストフィールドの幅は自由に設定したいところです。

コンポーネントの幅を調整する

コンポーネントにはそれぞれ推奨サイズというものが設定されます。推奨サイズは内側に含まれるコンポーネントなどの大きさから概ね決まります。これは、HTML/CSSのレイアウトと同じようなものです。HTML/CSSではボックスに幅や高さを指定できますが、Swingのコンポーネントでも幅や高さを指定することができます。
サイズの指定方法は幾つかありますが、最も直感的な方法はマウスで大きさを調整する方法です。テキストフィールドをクリックして選択し、横に広げてみましょう。

コンポーネントの幅や高さをピクセル単位で指定したい場合はプロパティを指定します。プロパティパネルの一番下の方にあるレイアウトの水平サイズ(垂直サイズ)を指定して下さい。

ボタンとラベルを配置

次に入力されたテキストを処理するアクションを定義します。今回は入力された文字列を大文字に変換するアクションを作成します。まずはコントロールパネルからボタンをドラック&ドロップで配置し、textプロパティを「大文字に変換」と設定します。

次に変換後の文字列を表示するラベルを配置します。コントロールパネルからラベルをドラッグ&ドロップで配置し、textプロパティに「−(ハイフン)」を設定します*2

続けてアクションを設定するために「大文字に変換」ボタンをダブルクリックし、アクションの雛形を作成します。

テキストボックスから入力テキストを取得する

ラベルに文字列を設定するにはsetTextというメソッドを使いましたが、テキストボックスから入力テキストを取得するにはgetTextメソッドを使用します。Javaではこのようにsetとgetは対になっていることが多く、setter/getter(セッター/ゲッター)やアクセサなどと呼ばれています。setter/getterはその名前の通り値を設定/取得する為のメソッドです。プロパティとして設定できるもののほとんどはgetメソッドで取得できると考えて良いでしょう。
それでは最初に入力されたテキストを標準出力してみます。soutと入力してTab*3を押し、System.out.printlnを呼び出します。尚、プログラムに慣れてきたようならば、直接入力しても構いません。途中まで(例えばSys)入力してコード補完機能*4を活用することもできます。別の箇所からコードをコピーしても構いません。System.out.println("");が入力されたならば、文字列の範囲を表す"(ダブルコーテーション)は削除します。

    private void jButton2ActionPerformed(java.awt.event.ActionEvent evt) {
        System.out.println();
    }

次に()の中にカーソルがあることを確認し、this.と入力してコード補完機能を呼び出します。テキストフィールドはJavaではjTextFieldという名前なのでさらにjを入力してください。

jTextField1が見つかると思いますので、選択してからエンターキーを押します。

続けて.を入力してコード補完機能からgetTextを探して入力します。getTまで入力すれば簡単に見つかるでしょう。

    private void jButton2ActionPerformed(java.awt.event.ActionEvent evt) {
        System.out.println(this.jTextField1.getText());
    }

これでテキストフィールドから文字列を取得できるようになりました。早速、実行して試してみましょう。

ボタンをクリックすればテキストフィールドに入力された文字列が出力されます。

大文字に変換する

テキストフィールドからはgetTextメソッドを使うことで文字列が取得できました。次にこの文字列を大文字に変換する方法を学びます。ですが、NetBeansの入力補完を使うので簡単です。まずはSystem.outのコードをもう1度入力するかコピーしてください。

    private void jButton2ActionPerformed(java.awt.event.ActionEvent evt) {
        System.out.println(this.jTextField1.getText());
        System.out.println(this.jTextField1.getText());
    }

テキストフィールドにはテキストフィールドに含まれる文字列を取得するメソッドがありました。これと同じように文字列にも色々なメソッドが用意されており、その中の1つに「大文字に変換する」メソッドも含まれています。このようにあるモノに対して、その情報を取得したり(getText)、情報を与えたり(setText)する操作の事をメソッドと言うのです。文字列を大文字に変換するメソッドはtoUpperCaseです。これまでと同様にgetText()の後ろにカーソルを移動させ、.を入力して下さい。メソッドの候補がたくさん出てきますが、tを入力して絞り込めばすぐにtoUpperCaseメソッドに辿り着くでしょう。

    private void jButton2ActionPerformed(java.awt.event.ActionEvent evt) {
        System.out.println(this.jTextField1.getText());
        System.out.println(this.jTextField1.getText().toUpperCase());
    }

それでは実行してみます。

結構プログラムっぽくなってきたと思いませんか?

ラベルに書き込みたいがラベルがいっぱいある件に関して

それでは最後の仕上げとしてラベルへ文字数を書き込んでいきましょう。これまでと同じようにthis.jとまで入力し入力補完を使います。

すると、困ったことにjLabelはこれまでのプログラム作成の過程で追加してきたラベルも含め3つあります。最後に追加した筈なのでおそらくはjLabel3と思いますが、このままラベルが増えていくとどれがどのラベルか解らなくなってしまうでしょう。ボタンも同様に多くなってくれればどれがどのボタンか解らなくなるでしょう。これではExcelで対応表を作ることになってしまいます。
問題なのは名前が連番で解り難い事です。そこで後から誰が見てもわかりやすい名前に変更します。まずはエラーが残っていると名前を変えることができないので、入力した行は削除してください。

名前の変更はデザインビューから行う為、デザインビューに切り替えてください。名前を変更するには幾つかの方法がありますが、インスペクタビューを使用する方法を使いましょう。インスペクタビューはデフォルトでは左下の方にあります。インスペクタビューでは各コンポーネントがツリー状に表示されています。

例によって見つからない/表示されていない場合はウィンドウからナビゲート−インスペクタを選択してください。

次にインスペクタビューで名前を変更したいコンポーネント(jLabel3)を選択します*5。続けてF2を押すかもう一度左クリックをすれば値の編集が行えます。ラベルであることが解り、大文字に変換した文字列を表示するところなので「upperTextLabel」としました。

尚、名前には日本語を使うことも可能ですが、CSSのクラス名のように原則としては英語表記で行います。また、先頭を小文字にして単語区切りは大文字にするという慣習があるのでそれに従いましょう。例えば、UpperTextLabelやupper_text_labelにはせず、upperTextLabelとしてください。これも強制ではありませんが、同じような表記をすることで他の人も読みやすいプログラムになります。

あわせて、ボタンの名前もclickButton, upperTextButtonに修正しす*6

ソースを確認する

名前を修正したのでソースコードを確認しましょう。デザインビューからソースビューへ切り替えてください。

    private void clickButtonActionPerformed(java.awt.event.ActionEvent evt) {                                            
        System.out.println("ボタンがクリックされました。");
        this.jLabel1.setText("クリックされました");
    }

    private void upperTextButtonActionPerformed(java.awt.event.ActionEvent evt) {
        System.out.println(this.jTextField1.getText());
        System.out.println(this.jTextField1.getText().toUpperCase());
    }

一見、なにも変わっていないようにも見えますが、jButton2ActionPerformedがupperTextButtonActionPerformedに変更され、ソースコードの意味が解りやすくなったはずです。

ラベルにテキストを表示する

それでは入力補完もやりやすくなったので、upperTextLabelにsetTextで文字数を設定してみましょう。

    private void upperTextButtonActionPerformed(java.awt.event.ActionEvent evt) {
        System.out.println(this.jTextField1.getText());
        System.out.println(this.jTextField1.getText().toUpperCase());
        this.upperTextLabel.setText(this.jTextField1.getText().toUpperCase());
    }

実行してみます。

テキストフィールドに文字列(英単語など)を入力し、「大文字に変換」をクリックすれば右側のラベルに出力されるでしょう。尚、日本語や全角文字の場合は大文字に変換できないのでアルファベットでお試しください。

まとめ

今回はテキストフィールドを使い入力されたテキストの取得方法と、各コンポーネントには名前をつけることが出来、意味のある解りやすい名前をつける事が重要であることを学びました。
少しずつはプログラムっぽくなってきましたが、同じようなコードがたくさんあったりと読みにくい箇所があります。次回はいよいよ変数を導入してみましょう。次回もNetBeansの機能を使いながら学習していきますので自然に変数の意味が解ると思います。

*1:裏側ではNetBeansがたくさん作っていますが

*2:textは空にしても良いですが、どこにラベルがあるか解りにくくなるので「−(ハイフン)」としました

*3:NetBeansのコードテンプレート機能

*4:Ctrl + SPACE

*5:デザインビューで選択しても構いません

*6:その他の項目も必要に応じて修正しますが、あまり意味のないラベルだと名前をつけるのが難しいのでjLabel1などはそのままにしてあります