GUIサンプル(ボタン)

Javaアプレットのボタンのサンプルです。



ボタンサンプル

このページには、以下のサンプルを掲載しています。 下の項目をクリックをすると各サンプルにジャンプします。 ※2週間以内の新着記事はNewアイコン、更新記事はUpアイコンが表示されます。
  1. ボタンのサンプル ( ButtonSample01.java )  
  2. アイコン付きボタン( ButtonSample02.java )  
  3. ボタン内テキストの改行( ButtonSample03.java )  
  4. ボタン内テキストでスタイル設定(その1)( ButtonSample04.java )  
  5. ボタン内テキストでスタイル設定(その2)  
  6. 色付きボタン  
  7. ボタン内テキストのフォント設定  
  8. ボタンの利用不可設定  
  9. ボタンでの右クリックアクション  

■ボタンのサンプル

[ サンプルプログラムのソースコード - ButtonSample01.java - ]
  1. package sample.applet.action;
  2. import java.awt.BorderLayout;
  3. import java.awt.Button;
  4. import java.awt.Color;
  5. import java.awt.Graphics;
  6. import java.awt.Graphics2D;
  7. import java.awt.event.ActionEvent;
  8. import java.awt.event.ActionListener;
  9. import java.awt.image.BufferedImage;
  10. import javax.swing.JApplet;
  11. public class ButtonSample02 extends JApplet implements ActionListener {
  12.   private static final long serialVersionUID = 1L;
  13.   Button button = new Button("ボタン");
  14.   BufferedImage bi;
  15.   Graphics2D offs;
  16.   int w,h;
  17.   public void init() {
  18.     w = getWidth();
  19.     h = getHeight();
  20.     bi = new BufferedImage(w,h,BufferedImage.TYPE_INT_ARGB);
  21.     offs = (Graphics2D)bi.getGraphics();
  22.     offs.setBackground(Color.WHITE);
  23.     offs.setColor(Color.BLUE);
  24.     offs.drawString("青", 10, 10);
  25.     setLayout(new BorderLayout());
  26.     button.addActionListener(this);
  27.     add(button, BorderLayout.SOUTH);
  28.   }
  29.   public void actionPerformed(ActionEvent e) {
  30.     if (e.getSource() == button) {
  31.       offs.clearRect(0, 0, w, h);
  32.       if (offs.getColor() == Color.RED ) {
  33.         offs.setColor(Color.BLUE);
  34.         offs.drawString("青",10,10);
  35.       } else {
  36.         offs.setColor(Color.RED);
  37.         offs.drawString("赤",10,10);
  38.       }
  39.     }
  40.     repaint();
  41.   }
  42.   
  43.   public void paint(Graphics g) {
  44.     g.drawImage(bi, 0, 0, null);
  45.   }
  46.   
  47.   public void update(Graphics g){
  48.     paint(g);
  49.   }
  50. }
[ サンプルプログラムの実行結果 ]
実行結果を見るには下のボタンをクリックしてください。
ボタンを押すたびに画面上に「赤」と言う文字と「青」と言う文字を交互に表示します。 ※実行結果は、別ウィンドウで開きます。実行には時間がかかることがありますのでご注意ください。


[ サンプルプログラムの解説 ]
アプレット上にボタンを追加する場合、まずアプレットにアクションリスナーをインプリメント(14行目)します。 そしてアプレットの初期化メソッドでレイアウトマネージャーを設定(33行目)します。ここでは、ボーダーレイアウトを使用しています。 レイアウトには、ボーダーレイアウトの他にもいくつかの種類があります。
34行目でボタンオブジェクトをアクションリスナーに追加しています。 アクションリスナーに追加しないと、ボタンを押しても何もおきません。 25行目でボタンオブジェクトをボーダーレイアウト上に配置しています。
ボタンが押された時に行う処理は、actionPerformedメソッドに記述します。サンプルでは、39行目から51行目になります。
if文でどのボタンオブジェクトが押されたのか判定します。 ボタンを利用するときの大体の構造は、下のような感じになります。
public class [アプレットの名前] extends JApplet implements ActionListener {

  Button [ボタンオブジェクトのオブジェクト変数名] = new Button();;

  public void init() {

    setLayout([使用するレイアウト])
    [ボタンオブジェクトのオブジェクト変数名].addActionListener(this);
    add([ボタンオブジェクトのオブジェクト変数名],[使用するレイアウト]);


  }

  public void actionPerformed(ActionEvent e) {
    if (e.getSource() == [ボタンオブジェクトのオブジェクト変数名]) {
      [ボタンが押されたときの処理を記述]
    }
  }


  public void paint(Graphics g) {

    [描画処理等]

  }

}



■アイコン付きボタン

[ サンプルプログラムのソースコード - ButtonSample02.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Color;
  3. import java.net.MalformedURLException;
  4. import java.net.URL;
  5. import javax.swing.ImageIcon;
  6. import javax.swing.JApplet;
  7. import javax.swing.JButton;
  8. import javax.swing.JPanel;
  9. public class ButtonSample02 extends JApplet {
  10.   private static final long serialVersionUID = 1L;
  11.   JButton button;
  12.   public void init() {
  13.     setBackground(Color.WHITE);
  14.     setLayout(new BorderLayout());
  15.     try {
  16.       URL url = new URL(getCodeBase() + "icon/test.png");
  17.       ImageIcon icon = new ImageIcon(url);
  18.       button = new JButton("Icon付きボタン", icon);
  19.     } catch ( MalformedURLException e) {
  20.       e.printStackTrace();
  21.     }
  22.     JPanel panel = new JPanel();
  23.     panel.setBackground(Color.WHITE);
  24.     panel.add(button);
  25.     add(panel, BorderLayout.CENTER);
  26.   }
  27. }
[ サンプルプログラムの実行結果 ]


[ サンプルプログラムの解説 ]
サンプルのプログラムでは、ボタン内へのイメージ画像貼り付けのサンプルのためボタンとしての機能はありません。 ボタンとしての機能は、ボタンのサンプルを参照してください。
このサンプルのプログラムでは、下の画像ファイルをボタンに貼り付けています。

ボタンにアイコン画像をつける場合は、下のような手順で行います。
 1.イメージファイルがあるURLを指定してURLオブジェクトを生成。(33行目)
 2.URLオブジェクトを引数にして、イメージアイコンオブジェクトを生成。(34行目)
 3.イメージアイコンオブジェクトを引数にして、ボタンオブジェクトを生成。(35行目)
URLオブジェクト生成時に例外が発生した場合、MalformedURLExceptionをスローするためtry〜catch節で囲んであります。 MalformedURLExceptionは、URLの形式が不正な場合などに発生します。

■ボタン内テキストの改行

[ サンプルプログラムのソースコード - ButtonSample03.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Color;
  3. import java.awt.Dimension;
  4. import javax.swing.JApplet;
  5. import javax.swing.JButton;
  6. import javax.swing.JPanel;
  7. public class ButtonSample03 extends JApplet {
  8.   private static final long serialVersionUID = 1L;
  9.   JButton button;
  10.   public void init() {
  11.     setBackground(Color.WHITE);
  12.     setLayout(new BorderLayout());
  13.     button = new JButton("<html>改行<br />ボタン</html>");
  14.     button.setPreferredSize(new Dimension(120,80));
  15.     JPanel panel = new JPanel();
  16.     panel.setBackground(Color.WHITE);
  17.     panel.add(button);
  18.     add(panel, BorderLayout.CENTER);
  19.   }
  20. }
[ サンプルプログラムの実行結果 ]


[ サンプルプログラムの解説 ]
サンプルのプログラムでは、ボタン内でのテキストの改行サンプルのためボタンとしての機能はありません。 ボタンとしての機能は、ボタンのサンプルを参照してください。
ボタン内のテキストを改行する場合は、ボタンに設定するテキストをHTMLで記述し 改行位置に<br / >タグを記述します。(18行目)


■ボタン内テキストでスタイル設定(その1)

ボタン内テキストの改行のサンプルでは、改行するのにHTMLの<BR>タグを使っていました。 スタイルシートとかも使えるでしょうか?ちょっとやってみましょう。
[ サンプルプログラムのソースコード - ButtonSample04.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Color;
  3. import java.awt.Dimension;
  4. import javax.swing.JApplet;
  5. import javax.swing.JButton;
  6. import javax.swing.JPanel;
  7. public class ButtonSample04 extends JApplet {
  8.   private static final long serialVersionUID = 1L;
  9.   JButton button;
  10.   public void init() {
  11.     setBackground(Color.WHITE);
  12.     setLayout(new BorderLayout());
  13.     StringBuilder text = new StringBuilder();
  14.     text.append("<html>");
  15.     text.append("<div style=\"color:red; ");
  16.     text.append("font-size:large; ");
  17.     text.append("text-decoration:line-through;\">");
  18.     text.append("打ち消し線</div>");
  19.     text.append("</html>");
  20.     button = new JButton(text.toString());
  21.     button.setPreferredSize(new Dimension(160,80));
  22.     JPanel panel = new JPanel();
  23.     panel.setBackground(Color.WHITE);
  24.     panel.add(button);
  25.     add(panel, BorderLayout.CENTER);
  26.   }
  27. }
[ サンプルプログラムの実行結果 ]


[ サンプルプログラムの解説 ]
サンプルのプログラムでは、ボタン内でのテキストにスタイルシートを設定しています。text-decorationは、タグ内の文字列に 装飾を施すスタイルシートです。サンプルでは、打ち消し線(line-through)を設定しています。(19行目〜24行目)


■ボタン内テキストでスタイル設定(その2)

スタイルシートで一文字ごとに色を変えてみます。
[ サンプルプログラムのソースコード - ButtonSample05.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Color;
  3. import java.awt.Dimension;
  4. import javax.swing.JApplet;
  5. import javax.swing.JButton;
  6. import javax.swing.JPanel;
  7. public class ButtonSample05 extends JApplet {
  8.   private static final long serialVersionUID = 1L;
  9.   JButton button;
  10.   public void init() {
  11.     setBackground(Color.WHITE);
  12.     setLayout(new BorderLayout());
  13.     StringBuilder text = new StringBuilder();
  14.     text.append("<html>");
  15.     text.append("<span style=\"color: #FF0000\">赤</span>");
  16.     text.append("<span style=\"color: #00FF00\">緑</span>");
  17.     text.append("<span style=\"color: #0000FF\">青</span>");
  18.     text.append("<span style=\"color: #FFFF00\">黄</span>");
  19.     text.append("<span style=\"color: #FFA500\">橙</span>");
  20.     text.append("<span style=\"color: #FF00FF\">紫</span>");
  21.     text.append("</html>");
  22.     button = new JButton(text.toString());
  23.     button.setPreferredSize(new Dimension(120,80));
  24.     JPanel panel = new JPanel();
  25.     panel.setBackground(Color.WHITE);
  26.     panel.add(button);
  27.     add(panel, BorderLayout.CENTER);
  28.   }
  29. }
[ サンプルプログラムの実行結果 ]


[ サンプルプログラムの解説 ]
サンプルのプログラムでは、1文字ごとに色を変えています。(19行目〜26行目)


■色付きボタン

[ サンプルプログラムのソースコード - ButtonSample06.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Color;
  3. import java.awt.Dimension;
  4. import javax.swing.JApplet;
  5. import javax.swing.JButton;
  6. import javax.swing.JPanel;
  7. public class ButtonSample06 extends JApplet {
  8.   private static final long serialVersionUID = 1L;
  9.   JButton button;
  10.   public void init() {
  11.     setBackground(Color.WHITE);
  12.     setLayout(new BorderLayout());
  13.     button = new JButton("赤色ボタン");
  14.     button.setPreferredSize(new Dimension(120,80));
  15.     button.setBackground(Color.RED);
  16.     JPanel panel = new JPanel();
  17.     panel.setBackground(Color.WHITE);
  18.     panel.add(button);
  19.     add(panel, BorderLayout.CENTER);
  20.   }
  21. }
[ サンプルプログラムの実行結果 ]


[ サンプルプログラムの解説 ]
サンプルのプログラムでボタンの背景色を変えています。
ボタンの背景色を変えるにはボタンオブジェクトからsetBackgroundメソッドに設定したい背景色を引数として渡してあげます。(20行目)

■ボタン内テキストのフォント設定

[ サンプルプログラムのソースコード - ButtonSample07.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Color;
  3. import java.awt.Dimension;
  4. import java.awt.Font;
  5. import javax.swing.JApplet;
  6. import javax.swing.JButton;
  7. import javax.swing.JPanel;
  8. public class ButtonSample07 extends JApplet {
  9.   private static final long serialVersionUID = 1L;
  10.   JButton button;
  11.   public void init() {
  12.     setBackground(Color.WHITE);
  13.     setLayout(new BorderLayout());
  14.     button = new JButton("Font設定");
  15.     button.setPreferredSize(new Dimension(120,80));
  16.     button.setFont(new Font(Font.MONOSPACED,Font.BOLD,20));
  17.     JPanel panel = new JPanel();
  18.     panel.setBackground(Color.WHITE);
  19.     panel.add(button);
  20.     add(panel, BorderLayout.CENTER);
  21.   }
  22. }
[ サンプルプログラムの実行結果 ]


[ サンプルプログラムの解説 ]
フォントの設定は、22行目で行っています。
ボタンオブジェクトからsetFontメソッドを使ってFontの設定を行います。setFontメソッドの引数に設定したFontのオブジェクト渡してあげます。


■ボタンの利用不可設定

[ サンプルプログラムのソースコード - ButtonSample08.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Color;
  3. import java.awt.Dimension;
  4. import javax.swing.JApplet;
  5. import javax.swing.JButton;
  6. import javax.swing.JPanel;
  7. public class ButtonSample08 extends JApplet {
  8.   private static final long serialVersionUID = 1L;
  9.   JButton button;
  10.   public void init() {
  11.     setBackground(Color.WHITE);
  12.     setLayout(new BorderLayout());
  13.     button = new JButton("利用不可");
  14.     button.setPreferredSize(new Dimension(120,80));
  15.     button.setEnabled(false);
  16.     JPanel panel = new JPanel();
  17.     panel.setBackground(Color.WHITE);
  18.     panel.add(button);
  19.     add(panel, BorderLayout.CENTER);
  20.   }
  21. }
[ サンプルプログラムの実行結果 ]


[ サンプルプログラムの解説 ]
実行結果のボタンは、あんまりボタンに見えませんが一応ボタンです。(^^;
ボタンには利用不可設定がしてあります。
21行目でボタンの利用不可設定を行っています。 ボタンオブジェクトのsetEnableメソッドにboolean値のfalseを指定すると利用不可にtrueを指定すると利用可に設定できます。 ある条件がそろわないとボタンを押すことが出来ないというような制御を行いたい場合に利用します。 例えばアプレットを利用するユーザが入力する項目がいくつかあったとしします。 その中に必須の入力項目がいくつかあって必須入力項目が全て入力されるまでボタンを利用不可にしておいて入力されたら利用可状態に するといったようなことを行いたい時などに使います。


■ボタンでの右クリックアクション

[ サンプルプログラムのソースコード - ButtonSample09.java - ]
  1. import java.awt.BorderLayout;
  2. import java.awt.Canvas;
  3. import java.awt.Color;
  4. import java.awt.FlowLayout;
  5. import java.awt.Graphics;
  6. import java.awt.Graphics2D;
  7. import java.awt.event.ActionEvent;
  8. import java.awt.event.ActionListener;
  9. import java.awt.event.MouseAdapter;
  10. import java.awt.event.MouseEvent;
  11. import java.awt.image.BufferedImage;
  12. import javax.swing.JApplet;
  13. import javax.swing.JButton;
  14. import javax.swing.JPanel;
  15. public class ButtonSample09 extends JApplet implements ActionListener {
  16.   private static final long serialVersionUID = 1L;
  17.   Canvas canvas;
  18.   JButton button1 = new JButton("ボタン1");
  19.   JButton button2 = new JButton("ボタン2");
  20.   JPanel panel    = new JPanel();
  21.   BufferedImage bi;
  22.   Graphics2D offs;
  23.   int w, h;
  24.   public void init() {
  25.     w = getWidth();
  26.     h = getHeight();
  27.     bi = new BufferedImage(w, h-40, BufferedImage.TYPE_INT_ARGB);
  28.     offs = (Graphics2D) bi.getGraphics();
  29.     canvas = new Canvas(){
  30.       private static final long serialVersionUID = 1L;
  31.       public void paint(Graphics g) {
  32.         g.drawImage(bi, 0, 0, null);
  33.       }
  34.     };
  35.     button1.addActionListener(this);
  36.     button1.addMouseListener(new MouseAdapter(){
  37.       public void mouseClicked(MouseEvent e) {
  38.         if ( e.getModifiers() == MouseEvent.BUTTON3_MASK ){
  39.           offs.clearRect(0, 0, w, h);
  40.           offs.setColor(Color.BLACK);
  41.           offs.drawString("ボタン1右クリック", 10, 10);
  42.           canvas.repaint();
  43.         }
  44.       }
  45.     });
  46.     button2.addActionListener(this);
  47.     button2.addMouseListener(new MouseAdapter(){
  48.       public void mouseClicked(MouseEvent e) {
  49.         if ( e.getModifiers() == MouseEvent.BUTTON3_MASK ){
  50.           offs.clearRect(0, 0, w, h);
  51.           offs.setColor(Color.BLACK);
  52.           offs.drawString("ボタン2右クリック", 10, 10);
  53.           canvas.repaint();
  54.         }
  55.       }
  56.     });
  57.     panel.setLayout(new FlowLayout());
  58.     panel.add(button1);
  59.     panel.add(button2);
  60.     setLayout(new BorderLayout());
  61.     add(canvas, BorderLayout.CENTER);
  62.     add(panel, BorderLayout.SOUTH);
  63.   }
  64.   public void start(){
  65.     offs.setBackground(Color.WHITE);
  66.     offs.clearRect(0, 0, w, h);
  67.     offs.setColor(Color.BLUE);
  68.     offs.drawString("まだボタンは押されてないよ", 10, 10);
  69.   }
  70.   public void actionPerformed(ActionEvent e) {
  71.     if (e.getSource() == button1) {
  72.       offs.clearRect(0, 0, w, h);
  73.       offs.setColor(Color.BLUE);
  74.       offs.drawString("ボタン1左クリック", 10, 10);
  75.     }
  76.     if (e.getSource() == button2) {
  77.       offs.clearRect(0, 0, w, h);
  78.       offs.setColor(Color.RED);
  79.       offs.drawString("ボタン2左クリック", 10, 10);
  80.     }
  81.     canvas.repaint();
  82.   }
  83. }
[ サンプルプログラムの実行結果 ]
実行結果を見るには下のボタンをクリックしてください。
ボタンが2つ配置されていますが、左のボタンを普通に押した場合(左クリック)は、「ボタン1左クリック」と表示されます。 右のボタンの場合は、「ボタン2左クリック」。そして各ボタンで右クリックをしたときは、それぞれ「ボタン1右クリック」、「ボタン2右クリック」 と表示されます。
※実行結果は、別ウィンドウで開きます。実行には時間がかかることがありますのでご注意ください。


[ サンプルプログラムの解説 ]
ボタン上で右クリックされた時になにかの処理を行う場合は、右クリックアクションを行うボタンオブジェクトにマウスリスナーを登録します。サンプルでは、 addMouseLisnerメソッドを使って48〜59行目でボタン1のオブジェクト(button1)にマウスリスナーのクラスを登録しています。62〜73行目でボタン2へのマウスリスナー登録を行っています。 マウスの右クリックアクションの動作は、登録したマウスリスナークラスのmouseClickedメソッド内に記述します。右クリックが押されたかどうかの判定は、「egetModifiers() == MouseEvent.BUTTON3_MASK」 で行っています。

[ 関連ページ ]
マウス入力(マウスイベント)サンプル





最終更新日:2019/02/13

2015-03-01からの訪問者数
  1651 人