awt の主要なクラスを下記に示す クラス Component Container Button Label Panel Frame 説明画面にユーザインターフェイス要素として表示し, ユーザとのやり取りを行うコンポーネントを表すすべてのコンポーネントのスーパークラスになる ほかのコンポーネントを含

Transcription

1 第 3 章 GUI による電卓の実装 GUI の基礎とイベント処理について理解し, 前章で作成した演算プログラムを組み込んで電卓を作成 ( 実装 ) する 3.1 インターフェイス 文字などのコマンドだけでやりとりするインターフェイスを CUI(Command User Interface) と呼び, マウスなどでウインドウを操作して行うインターフェイスを GUI(Graphical User Interface) と呼ぶ GUI はユーザがアプリケーションを操作する際に視覚的な認識や操作を可能にする これらを利用してプログラミングすることにより, 電卓のような GUI を作成することができる GUI を作成するためのクラスとして awt と swing がある awt(abstract window toolkit) とは,Java の GUI 作成を目的として提供されているクラス ライブラリで, ウインドウ, フォーム, ボタンなど GUI に必要なクラスが準備されている awt クラスの拡張機能として,swing がある awt と同様に GUI 作成を目的として提供されているクラス ライブラリであり,awt と比較して実行速度, 安定性の向上を図っている 3-1

2 awt の主要なクラスを下記に示す クラス Component Container Button Label Panel Frame 説明画面にユーザインターフェイス要素として表示し, ユーザとのやり取りを行うコンポーネントを表すすべてのコンポーネントのスーパークラスになる ほかのコンポーネントを含むことができるコンテナを表すすべてのコンテナのスーパークラスになる ラベル付きボタンを表すテキストを配列するために使われるほかのコンポーネントを配置する単純なコンテナを表す見出しやボーダを持つトップレベルのウインドウを表す Component クラスの主要メソッドを下記に示す メソッド void paint(graphics g) void setvisible(boolean b) Color getbackground() void setbackground(color c) 説明コンポーネントを描画する b が true の場合, コンポーネント表示 b が false の場合, コンポーネント非表示コンポーネントのバックグラウンドカラーを返すコンポーネントのバックグラウンドカラーを設定する Container クラスの主要メソッドを下記に示す メソッド Component add(component comp) void paint(graphics g) 説明コンポーネントをコンテナ最後に追加するコンテナを描画する 3-2

3 3.2 GUI でのパネル表示 GUI 表示をおこなうためには,awt および swing パッケージにあるクラスを使用する クラス JFrame,JPanel,JLabel Container パッケージ javax.swing java.awt パネルの追加 ( 組み込み ) の概略例は以下のようになる 1 文字列 Hi, World!! を追記した JLanel オブジェクト label を生成 JLabel label = new JLabel( Hi, World!! ); 2 JPanel オブジェクト panel を生成し, これに label を追加 JPabel panel = new JPanel(); panel.add(label); 3 JFrame オブジェクト frame を生成して, その ContentPane の情報 ( パネル用文字列表示領域など ) を得たものを, さらに Container オブジェクト cont を生成してそこに入れる JFrame frame = new JFrame(); Container cont = frame.getcontentpane(); 4 cont に panel を追加 cont.add(panel); 3-3

4 3.3 ユーザクラスの定義 これまでは 外部クラスを使用して処理を行うことがなかったため, クラス定義を意識することがなかった 本章からは,GUI 処理により外部クラスメソッドとの処理があるため, 改めてクラス定義について説明する クラスはデータメンバとそれを操作するためのメソッドを一体化したもので, 下記の書式で定義される class クラス名 { データメンバ宣言 ( 非公開部 ) public クラス名 ( 引数 1, ) { コンストラクタ ( 公開部 ) public 型メソッド名 ( 引数 1, ) { メソッド ( 公開部 ) コンストラクタは, クラスのオブジェクトが生成されるときに呼び出される特別な初期化メソッドであり, クラス名と同じ名前となる オブジェクト宣言時において, データメンバを初期化するのに用いられる また,GUI レイアウト ( 後述 ) では, 表示要素の初期値設定をしてコンストラクタを用いる 3-4

5 3.4 レイアウト レイアウトとは,GUI コンポーネントを配置する方法であり, レイアウトを管理するためのオブジェクトであるレイアウト マネージャを用いてレイアウト設定を行う レイアウトは下記記述例によりコンテナに登録することで設定できる レイアウトの登録方法 コンテナインスタンス名.setLayout( レイアウトマネージャインスタンス ) レイアウトには, フローレイアウト, ボーダーレイアウト, グリッドレイアウトがある ( フローレイアウトの例 ) ( ボーダーレイアウトの例 ) ( グリッドレイアウトの例 ) これらの各レイアウトについて, 以下説明する 3-5

6 3.4.1 フローレイアウト フローレイアウト (Flow Layout) は, コンポーネントを左から右方向に順に配置する なお,1 行に収まらない場合は次の行に移動して配置 ( 改行 ) する レイアウト指定を行わないパネルはフローレイアウトとなる コンストラクタ名 FlowLayout() FlowLayout(int align) FlowLayout(int align, int hgap, int vgap) 説明中央揃えデフォルト間隔 (5 単位 ) で配置 FlowLayout を生成 align 位置揃えとデフォルト間隔 (5 単位 ) で配置 FlowLayout を生成,align には次を指定できる FlowLayout.LEFT: 左揃え FlowLayout.RIGHT: 右揃え FlowLayout.CENTER: 中央揃え指定された位置揃え 横間隔 縦間隔で配置 FlowLayout を生成 メソッド名 gethgap() getvgap() layoutcontainer(container コンテナ ) 説明コンポーネント水平方向間隔を取得コンポーネント垂直方向間隔を取得指定したコンテナを配置 3-6

7 3.4.2 ボーダーレイアウト ボーダーレイアウト (Border Layout) は, ウインドウ境界とコンポーネント境界を接するように配置する フレームサイズ変更されても配置関係を保持できる コンストラクタ名 BorderLayout() 説明間隔を開けずに配置する BorderLayout を生成 BorderLayout.NORTH BorderLayout.SOUTH BorderLayout.WEST BorderLayout.CENTER BorderLayout.EAST BorderLayout(int h, int v) 指定された横と縦の間隔で配置して BorderLayout を生成 メソッド名 gethgap() getvgap() layoutcontainer(container コンテナ ) 説明コンポーネント水平方向間隔を取得コンポーネント垂直方向間隔を取得指定したコンテナを配置 フレームの大きさを変えると CENTER の大きさが変わる 3-7

8 3.4.3 グリッドレイアウト グリッドレイアウト (Grid Layout) は, 行数と列数および配置するコンポーネントの個数から格子状に配置する 行数の指定が 0 の場合列数の指定 : 有効行数 = ( コンポーネント数 + 列数 - 1 ) 列数列数 = 列数行数の指定が 1 以上の場合列数の指定 : 無効 ( 列数を指定しても使われない ) 行数 = 行数列数 = ( コンポーネント数 + 行数 - 1 ) 行数 コンストラクタ名 GridLayout() GridLayout(int r, int c) GridLayout(int r, int c, int h, int v) 説明格子状に配置する GridLayout を生成 (1 行と 1 列に 1 つのコンポーネント ) r ( 行 ) c ( 列 ) 個のコンポーネントを配置する GridLayout を生成 r( 行 ) c( 列 ) 個のコンポーネントを, 指定された水平方向, 垂直方向の間隔で配置する GridLayout を生成 メソッド名 gethgap() getvgap() layoutcontainer(container コンテナ ) 説明コンポーネント水平方向間隔を取得コンポーネント垂直方向間隔を取得指定したコンテナを配置 3-8

9 3.5 コンポーネントのイベント処理 イベントとは,GUI を持つプログラムに置いて, マウスのボタンクリックのように何らかの処理を引き起こす操作のことである Java では, イベントの発生元であるイベントソースを監視するオブジェクトにイベントリスナーを登録し, イベント処理メソッド内に処理内容を記述する 今回の場合は主に,Swing コンポーネントのイベント処理方法について学習する Swing コンポーネントのイベント処理には, 下記のクラス メソッドを用いて行う イベント イベントリスナー イベント処理 ( 対象クラス ) クラス名 クラス名 メソッド名 ActionEvent ActionListener actionperformed JButton ( ボタン系イベント用 ) JTextField JTextArea JRadioButton JCheckBox JComboBox JMenuItem JCheckBoxItem 例として, ボタン 1 とボタン 2 がクリックされたときのイベント処理記述を下記に示す addactionlistener クラスでボタンをアクションリスナーに登録し, イベント発生時の処理内容を e.getsource クラスで判定して記述する ボタンが単数の場合, 記述内容が少ないため問題ないが, 複数ある場合, 単数での書式を繰り返し記述するのは効率が悪い そこで, ボタンが複数の場合,implements を用いた記述を使うことで記述内容を整理することができる 3-9

10 イベント処理ボタンが単数の場合ボタンが複数ある場合 (ActionListener を implements) 書式例ボタン 1 名.addActionListener(new ActionListener(){ public void actionperformed(actionevent e){ // ボタン 1 の処理 ); public class クラス名 extends JFrame implements ActionListener{ // JFrame クラスに ActionListener クラスの機能を提供ボタン 1 名.addActionListener(this); ボタン 2 名.addActionListener(this); public void actionperformed(actionevent e){ // 以下, イベントを起こしたソースオブジェクトを取得 if(e.getsource() == ボタン 1 名 ){ // ボタン 1 の処理 else if(e.getsource() == ボタン 2 名 ){ // ボタン 2 の処理 3-10

11 3.6 レイアウトとイベント処理の統合 パネルレイアウトによる GUI パネル作成とイベント処理についてそれぞれ, これまで学習した また,extends( 拡張, すなわちクラスの継承 ) によってパネル作成クラスにイベント処理を拡張することができる CUI で作成した演算プログラム ( 前章 ) に織り込みを行う前に, ソースの利便性を考慮して,GUI パネル作成とイベント処理を,1 つのクラスにまとめる さらに, = ボタン以外の入力を積み上げて表示する機能をプログラムしておく 3-11

12 3.7 String クラスの文字列操作 String クラスには文字列操作を行うためにメソッドが準備されているが, 本演習での電卓プログラムの実装にあたり ( 前章でも使用したが ), この点について解説しておく 文字列は基本型ではなくクラスのオブジェクト (String 型 ) として扱うため, 文字列の操作には String クラスのメソッドを使うことはすでに学習している 追加で使用するメソッドとして下記がある String 型の文字列は, 基本的に変更できないものとして扱われる String 型の変数に文字列を代入すると, 定数と同様にその文字列を変更することができない ( 但し, 変数に別の文字列を代入することはできる ) 文字列からその一部を取り出すには,String クラスの substring() メソッドを使う メソッド 機能 使用例 int length() 文字列長 ( 文字数 ) 文字数を返す (int 型整数 ) 記述例 String s = ; System.out.println(s.length()); 上記の表示結果 6 substring(start) 文字列の取り出し開始位置は start + 1 終了位置は最後 記述例 String s = "123456"; System.out.println(s.substring(0)); System.out.println(s.substring(1)); System.out.println(s.substring(6)); substring(start, end) 文字列の取り出し開始位置は start + 1 終了位置は end 上記の表示結果 ( 無し ) 記述例 String s = "123456"; System.out.println(s.substring(0, 3)); System.out.println(s.substring(1, 3)); System.out.println(s.substring(3, 6)); 上記の表示結果