選択状態時の画像の設定

広告

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

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

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

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

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

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

ImageIcon icon = new ImageIcon("./img/sample.png");
ImageIcon icon_select = new ImageIcon("./img/select.png");

JCheckBox checkbox = new JCheckBox(icon);
checkbox.setSelectedIcon(icon_select);

上記ではチェックボックスが選択されていない時は「sample.png」を表示し、選択されている時は「select.png」を表示します。

サンプルプログラム

では実際に試してみます。

SSample9_1.java

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

class SSample9_1 extends JFrame{
  public static void main(String args[]){
    SSample9_1 frame = new SSample9_1("タイトル");
    frame.setVisible(true);
  }

  SSample9_1(String title){
    setTitle(title);
    setBounds(100, 100, 300, 250);
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    JPanel p = new JPanel();

    ImageIcon icon_nonselect = new ImageIcon("./nonselect.png");
    ImageIcon icon_select1 = new ImageIcon("./select1.png");
    ImageIcon icon_select2 = new ImageIcon("./select2.png");
    ImageIcon icon_select3 = new ImageIcon("./select3.png");

    JCheckBox ckbox1 = new JCheckBox("Orange", icon_nonselect);
    ckbox1.setSelectedIcon(icon_select1);
    JCheckBox ckbox2 = new JCheckBox("Banana", icon_nonselect, true);
    ckbox2.setSelectedIcon(icon_select2);
    JCheckBox ckbox3 = new JCheckBox("Melon", icon_nonselect);
    ckbox3.setSelectedIcon(icon_select3);

    p.add(ckbox1);
    p.add(ckbox2);
    p.add(ckbox3);

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

ではコンパイルを行った上で実行してみます。

選択状態時の画像の設定

3つのチェックボックスを表示しています。2つ目のチェックボックスは初期状態で選択状態にしてありますので、選択状態用の画像が表示されています。

では2番目のチェックボックスをクリックしてみます。

選択状態時の画像の設定

選択状態から非選択状態になるため、非選択状態用の画像が表示されます。

他のチェックボックスもクリックすることで選択と非選択の状態が切り替わり、状態に応じた画像が表示されます。

選択状態時の画像の設定

選択状態時の画像の設定

( Written by Tatsuo Ikura )