チェックボックスに選択時と非選択時の画像をそれぞれ表示する

チェックボックスには文字列だけではなく画像を表示することもできます。ここではチェックボックスに画像を表示する方法について解説します。なおチェックボックスに画像を設定すると、チェックボックスの左側に表示されている選択されているかどうかを表示する小さなボックスが表示されなくなります。その為、チェックボックスが選択されている時は、それが分かるように異なる画像を設定する方法もあわせて解説します。

(2022 年 04 月 11 日公開 / 2022 年 04 月 11 日更新)

チェックボックスに画像を表示する

最初に JCheckBox のコンストラクタで画像を指定する方法です。次のコンストラクタを使用します。

public JCheckBox(Icon icon)

初期状態で選択されていない、アイコン付きのチェックボックスを生成します。

パラメータ:
icon - 表示するIconイメージ

引数には表示したい画像を表す Icon インターフェースを実装したクラスのオブジェクトを指定します。 Java では Icon インターフェースを実装したクラスとして ImageIcon クラスが用意されており、今回は ImageIcon クラスのオブジェクトを指定してみます。( ImageIcon クラスについては「ImageIconクラス」を参照して下さい)。

実際の使い方は次のようになります。

ImageIcon icon = new ImageIcon("./img/sample.png");
JCheckBox? check = new JCheckBox(icon);

PNG形式の画像からImageIconクラスのオブジェクトを作成し、ボタンのコンストラクタの引数に指定しています。

また画像の指定と同時に選択状態を指定する次のコンストラクタも用意されています。

public JCheckBox(Icon icon, boolean selected)

アイコン付きのチェックボックスを生成し、それが初期状態で選択されるかどうかを指定します。

パラメータ:
icon - 表示するIconイメージ
selected - 初期選択状態を示すboolean値。 trueの場合、チェックボックスが選択される

1 番目の引数にはコンストラクタの場合と同じく Icon インターフェースを実装したクラスのオブジェクトを指定します。 2 番目の引数にチェックボックスを選択した状態にするか非選択の状態にするかを表す boolean 型の値を指定します。 true を指定すれば選択状態となり false を指定すれば非選択の状態となります。

実際の使い方は次のようになります。

ImageIcon icon = new ImageIcon("./img/sample.png");
JCheckBox? check = new JCheckBox(icon, true);
サンプルコード

それでは簡単なサンプルプログラムを作って試してみます。テキストエディタで次のように記述したあと、 JSample8_1.java という名前で保存します。

import javax.swing.JFrame;
import javax.swing.JCheckBox;
import javax.swing.JPanel;
import javax.swing.ImageIcon;
import java.awt.Container;
import java.awt.BorderLayout;

class JSample8_1 extends JFrame{
  public static void main(String args[]){
    JSample8_1 frame = new JSample8_1("MyTitle");
    frame.setVisible(true);
  }

  JSample8_1(String title){
    setTitle(title);
    setBounds(100, 100, 600, 400);
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    ImageIcon icon = new ImageIcon("./noncheck.png");

    JCheckBox check1 = new JCheckBox("Movie");
    JCheckBox check2 = new JCheckBox(icon, false);
    JCheckBox check3 = new JCheckBox(icon, true);

    JPanel p = new JPanel();
    p.add(check1);
    p.add(check2);
    p.add(check3);

    Container contentPane = getContentPane();
    contentPane.add(p, BorderLayout.CENTER);
  }
}

次のようにコンパイルを行います。

javac JSample8_1.java

チェックボックスに画像を表示する(1)

コンパイルが終わりましたら実行します。

java JSample8_1

チェックボックスを 3 つ追加しました。 1 つ目は文字列を指定したチェックボックス、 2 つ目と 3 つ目のチェックボックスは画像を指定して作成しています。

チェックボックスに画像を表示する(2)

チェックボックスでは画像を設定するとチェックボックスの左側に表示されていた小さなボックスの位置に画像が表示されるためボックスが表示されなくなります。その為、チェックボックスが現在選択されているかどうか区別が付きません。画像を設定する場合にはデフォルトで表示される画像とは別に選択されている時に別の画像を表示するように設定します。

チェックボックスに画像と文字列を両方表示する

チェックボックスには文字列と画像のどちらかではなく両方を表示することができます。次のコンストラクタを使用します。

public JCheckBox(String text, Icon icon)

初期状態で選択されていない、指定されたテキストおよびアイコン付きのチェックボックスを
生成します。

パラメータ:
text - チェックボックスのテキスト。
icon - 表示するIconイメージ

1 番目の引数にはチェックボックスに表示する文字列を String クラスのオブジェクトで指定します。 2 番目の引数には前のコンストラクタと同じくIconインターフェースを実装したクラスのオブジェクトを指定します。

実際の使い方は次のようになります。

ImageIcon icon = new ImageIcon("./img/sample.png");
JCheckBox check = new JCheckBox("Travel", icon);

文字列を引数に指定してチェックボックスを作成したあとで setIcon メソッドを使って画像を設定することもできます。この場合、文字列が画像に置き換わるのではなく文字列に画像が追加されます。

setIcon は JCheckBox クラスの親クラスである AbstractButton クラスで定義されています。

public void setIcon(Icon defaultIcon)

ボタンのデフォルトのアイコンを設定します。 明示的な指定がない場合、このアイコンはボタンが「押された」状態、および「無効な」
状態を示すアイコンにも使用されます。

パラメータ:
defaultIcon - デフォルト状態の表示に使用されるアイコン

実際の使い方は次のようになります。

ImageIcon icon = new ImageIcon("./img/sample.png");
JCheckBox check = new JCheckBox("Travel");
check.setIcon(icon);

画像を引数に指定してチェックボックスを作成したあとで setText メソッドを使って文字列を設定することもできます。この場合、画像が文字列に置き換わるのではなく画像に文字列が追加されます。

ImageIcon icon = new ImageIcon("./img/sample.png");
JCheckBox check = new JCheckBox(icon);
check.setText("Travel");

なお文字列と画像の両方をチェックボックスに表示した場合、デフォルトでは画像が左、文字列が右、という位置関係で表示されます。

サンプルコード

それでは簡単なサンプルプログラムを作って試してみます。テキストエディタで次のように記述したあと、 JSample8_2.java という名前で保存します。

import javax.swing.JFrame;
import javax.swing.JCheckBox;
import javax.swing.JPanel;
import javax.swing.ImageIcon;
import java.awt.Container;
import java.awt.BorderLayout;

class JSample8_2 extends JFrame{
  public static void main(String args[]){
    JSample8_2 frame = new JSample8_2("MyTitle");
    frame.setVisible(true);
  }

  JSample8_2(String title){
    setTitle(title);
    setBounds(100, 100, 600, 400);
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    ImageIcon icon = new ImageIcon("./noncheck.png");

    JCheckBox check1 = new JCheckBox("Movie");
    JCheckBox check2 = new JCheckBox("Movie", icon);

    JPanel p = new JPanel();
    p.add(check1);
    p.add(check2);

    Container contentPane = getContentPane();
    contentPane.add(p, BorderLayout.CENTER);
  }
}

次のようにコンパイルを行います。

javac JSample8_2.java

チェックボックスに画像と文字列を両方表示する(1)

コンパイルが終わりましたら実行します。

java JSample8_2

チェックボックスを 2 つ追加しました。 1 つ目はデフォルトのチェックボックス、 2 つ目のチェックボックスはテキストと画像を指定して作成しています。

チェックボックスに画像と文字列を両方表示する(2)

チェックボックスが選択されている時に別の画像を表示する

チェックボックスに画像を設定した場合、チェックボックスが選択されている状態かそうでないのかが分からなくなります。その為、チェックボックスに画像を設定する場合は、合わせてチェックボックスが選択されている時に別の画像を表示するように設定をします。

チェックボックスで選択された時の画像を設定するには JCheckBox クラスの親クラスである AbstractButton クラスで用意されている setSelectedIcon メソッドを使います。

public void setSelectedIcon(Icon selectedIcon)

選択された状態のボタンのアイコンを設定します。

パラメータ:
selectedIcon - 「選択されたボタン」の表示に使用されるアイコン

引数にはコンストラクタで画像を設定した時と同じくIconインターフェースを実装したクラスのオブジェクトを指定します。

実際の使い方は次のようになります。

ImageIcon icon = new ImageIcon("./img/sample.png");
ImageIcon icon_check = new ImageIcon("./img/check.png");

JCheckBox check = new JCheckBox("Travel", icon);
check.setSelectedIcon(icon_check);

チェックボックスにデフォルトで sample.png の画像を表示し、チェックボックスが選択されている時は check.png の画像を表示します。

サンプルコード

それでは簡単なサンプルプログラムを作って試してみます。テキストエディタで次のように記述したあと、 JSample8_3.java という名前で保存します。

import javax.swing.JFrame;
import javax.swing.JCheckBox;
import javax.swing.JPanel;
import javax.swing.ImageIcon;
import java.awt.Container;
import java.awt.BorderLayout;

class JSample8_3 extends JFrame{
  public static void main(String args[]){
    JSample8_3 frame = new JSample8_3("MyTitle");
    frame.setVisible(true);
  }

  JSample8_3(String title){
    setTitle(title);
    setBounds(100, 100, 600, 400);
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    ImageIcon icon = new ImageIcon("./noncheck.png");
    ImageIcon icon_check = new ImageIcon("./check.png");

    JCheckBox check = new JCheckBox("Movie", icon);
    check.setSelectedIcon(icon_check);

    JPanel p = new JPanel();
    p.add(check);

    Container contentPane = getContentPane();
    contentPane.add(p, BorderLayout.CENTER);
  }
}

次のようにコンパイルを行います。

javac JSample8_3.java

チェックボックスが選択されている時に別の画像を表示する(1)

コンパイルが終わりましたら実行します。

java JSample8_3

チェックボックスを 1 つ追加しました。チェックボックスをクリックして選択状態にするとデフォルトの画像とは異なる画像が表示されます。

チェックボックスが選択されている時に別の画像を表示する(2)

チェックボックスが選択されている時に別の画像を表示する(3)

-- --

チェックボックスに画像を表示する方法について解説しました。

( Written by Tatsuo Ikura )

プロフィール画像

著者 / TATSUO IKURA

これから IT 関連の知識を学ばれる方を対象に、色々な言語でのプログラミング方法や関連する技術、開発環境構築などに関する解説サイトを運営しています。