Presentation is loading. Please wait.

Presentation is loading. Please wait.

GUIコンポーネントの設定と配置 Creation and positioning of GUI components

Similar presentations


Presentation on theme: "GUIコンポーネントの設定と配置 Creation and positioning of GUI components"— Presentation transcript:

1 GUIコンポーネントの設定と配置 Creation and positioning of GUI components
java.awt 継承階層 Inheritance hierarchy コンポーネント Component コンポーネントレイアウト Layout パネル Panel フレーム Frame 

2 (abstract window toolkit) Hierarchy
java.awt継承階層 (abstract window toolkit) Hierarchy Component例 TextField java.lang.Object java.lang.Object | +--java.awt.Component +--java.awt.Label TextComponent TextArea CheckboxGroup Button Component Label Container Panel Java.applet.Applet FlowLayout List Window Frame BorderLayout Choice GridLayout Checkbox 三種類のレイアウト GUI Components 次に説明します

3 コンポーネント:ラベル Label ラベル: 編集不能なテキストを表示する部品。 読み出し専用テキストを一行だけ表示する。 例のソース
ラベル: 編集不能なテキストを表示する部品。       読み出し専用テキストを一行だけ表示する。 例のソース コンストラクタとメソッド 使い方 private Label label; label = new Label(); label.setText(“Label demo”); //label = new Label(“Label demo”); label.setAlignment(Label.CENTER); //label = new Label(“Label demo”, Label.CENTER); add(label); …… g.drawString(“text is: ” + label.getText(), 20, 30); public Label() public Label(String s) public Label(String s, int alignment) public String getText() public void setText(String s) public void setAlignment(int alignment) String s は ラベルのテキスト int alignment は表示位置: Label.LEFT Label.CENTER Label.RIGHT Containerから継承したadd()メソッドを使って(add(label); )、labelをアプレットに追加します。

4 コンポーネント:テキストフィールド TextField テキストフィールド: キーボードからテキストを入力できる部品。 例のソース
テキストフィールド: キーボードからテキストを入力できる部品。                ユーザがテキストフィールドにデータを入力して                Enterキーを押すと、アクションイベントが生成されます。 例のソース コンストラクタとメソッド 使い方 private TextField password; password = new TextField(“secrete”, 20); password.setEchoChar(‘*’); //マスク文字 password.setEditable(false); //編集不可 //password.setEditable(true); 編集可 add(password); …… public TextField() public TextField(int columns) public TextField(String s) public TextField(String s, int columns) public void setEditable(boolean b) public void setEchoChar(Char c) true: 編集可能 false: 編集不能 String s は 表示するテキスト Containerから継承したadd()メソッドを使って(add(password); )、passwordテキストフィールドをアプレットに追加します。 マスク文字は パスワードを入力する時に利用すると便利 int columns は列数(長さ)

5 Button, Choice, Checkbox
ボタン:押しボタン、選択ボタン Button, Choice, Checkbox ボタンはクリックして特定のアクションを選択するためのGUIコンポーネントです。 Javaでは、押しボタン、選択ボタン、チェックボックスの3種類がつかえます。 例のソース コンストラクタとメソッド 使い方 public Button(String s) public Choice() public String getItem(int index) public synchronized void add(String s) public synchronized String getSelectedItem() public int getSelectedIndex() public synchronized void insert(String s, int index) public synchronized void remove(String s) private Button button; button = new Button("addition"); // button.addActionListener(this); add(button); private Choice choice; choice = new Choice(); choice.add("English"); choice.add(“日本語”);   //choice.addItemListener(this); add(choice); choice.insert(“中国語”, 1); 指定した項目を選択ボタンに追加する 指定インデックスに新しい項目を追加する

6 Checkbox, Checkbox + CheckboxGroup
ボタン: チェックボックス、ラジオボタン Checkbox, Checkbox + CheckboxGroup チェックボックスとラジオボタンはクラスCheckboxから作ります。 使い方 ソース Demo コンストラクタとメソッド public Checkbox(String s) public CheckboxGroup() //CheckboxGroupオブジェクトを生成する public Checkbox( String s, //ラジオボタンのラベル CheckboxGroup c, boolean state)   //ラジオボタンの状態 private Checkbox fontBold; fontBold = new Checkbox("Bold"); //fontBold.addItemListener(this); add(fontBold);   private Checkbox fontcolor; private CheckboxGroup fontcolor; fontcolor = new CheckboxGroup(); colorRed = new Checkbox("red", fontcolor, true); //colorRed.addItemListener(this); add(colorRed); …… 指定されたラベルと状態を持ちラジオボタンを一つ生成して、既存のCheckboxGroup cに追加する 1組のラジオボタンは、1個のCheckboxGroupオブジェクトおよび複数個のCheckboxオブジェクトから構成されますが、同時には1個ボタンしか選べません。

7 コンポーネント:選択リスト List リスト: 選択項目のリストの中から1項目をクルックして選べる部品。
     1項目しか選択できないものを単一選択リスト、複数の項目     を同時に選択できるものを多重選択リストと呼びます。 ソース Demo 使い方 コンストラクタとメソッド private List colorlist; colorlist = new List(3, false); //単一選択リスト               //true 多重選択リスト //colorlist.addActionListener(this); //colorlist.addItemListener(this); colorlist.add("red"); colorlist.add("green"); colorlist.add("blue");   add(colorlist); colorlist.remove(“green”); public List(int item, boolean b) public String getItem(int index) public synchronized void add(String s) public synchronized String getSelectedItem() public int getSelectedIndex() public synchronized void remove(String s) 選択リストから指定した項目を削除する ComponentクラスにはChoiceやListで共通に使えるメソッドがいくつか定義されています。 指定した項目を選択リストに追加する

8 コンポーネント:テキストエリア TextArea TextArea:複数行のテキストを操作(入力、編集、表示) することができます。 ソース
       することができます。 ソース Demo コンストラクタとメソッド 使い方 public TextArea() public TextArea(int rows, int columns) public TextArea(String s) public TextArea(String s, int rows, int columns) public TextArea( String s, int rows, int columns, int scrollbar) public void setEditable(boolean b) private TextArea area; area = new TextArea("Hello!", 10, 40); //area = new TextArea(10, 40); //area.setText(“Hello!”); //area.addTextListener(this); area.setEditable(false); add(area); area.append("This is a demo." +"\n"); false – 編集不可 true – 編集可 TextFieldと違う: TextFieldは一行のテキスト(データ)を操作しますが、TextAreaは複数行のテキストを操作します。 この二行は以下の一行 area = new TextArea(“Hello!”, 10, 40);と同じです。 “\n” は改行です 指定したテキストをテキストエリアに追加します

9 レイアウトマネージャ Layout Manager ソース Demo ソース Demo ソース Demo
ソース  Demo FlowLayout GUIコンポーネントが」コンテナに追加された順に左から右に配置します setLayout(new FlowLayout(FlowLayou.RIGHT)); add(label); …… add(area); public FlowLayout() public FlowLayout(int p) public FlowLayout( int p, int h, int v) setLayout(new BorderLayout(5,5)); add(label, BorderLayout.WEST); add(textField, BorderLayout.CENTER); add(button, BorderLayout.EAST); add(colorlist, BorderLayout.NORTH); add(area, BorderLayout.SOUTH); ソース  Demo BorderLayout コンポーネントを5つの区域(N,S,E,W,C)に分けて配置します。 public BorderLayout() public BorderLayout(int h, int v) ソース  Demo GridLayout 格子(行と列)に沿ってコンポーネントを配置します。 setLayout(new GridLayout(3,4,2,2)); add(button); …… add(area); public GridLayout() public GridLayout(int r, int c, int h, int v)

10 パネル Panel 必要性:ために、FlowLauout()とかBorderLayout()とかGridLayout()とかどれだけでも、各コンポーネントを正確な位置に配置することが難しいから、異なる復数のパネルを使う。 Container クラス=> Panelクラス => Appletクラス private Panel panel1,panel2; panel1 = new Panel(); panel1.setLayout(new BorderLayout(5, 5)); …… panel1.add(button, BorderLayout.NORTH); panel2 = new Panel(); panel2.setLayout(new GridLayout(1, 5, 2, 2)); panel2.add(colorlist); Panel(オブジェクト)を利用してコンポーネントをより複雑にはいちすることができます。 public Panel() ソース  Demo

11 フレーム Frame: タイトルバーと境界領域を持ったウィンドウで、 ユーザがリサイズすることができます。
     ユーザがリサイズすることができます。 Container クラス=> Windowクラス => Frameクラス フレームのタイトル フレームのデフォルトレイアウトマネージャはBorderLayoutです。 private Frame myFrame; ……. myFrame = new Frame("New Frame"); myFrame.setSize(300,100); myFrame.setVisible(true); public Frame(String s) フレームのサイズ フレームを表示する ソース  Demo

12 課題 1. 電卓のGUIを作成せよ。 ex1 2. 印刷機のGUIを作成せよ。 ex2
Note: 作成したGUIには機能を持たせる必要はない。


Download ppt "GUIコンポーネントの設定と配置 Creation and positioning of GUI components"

Similar presentations


Ads by Google