Problem
In this Part 2, we set the active state too so that the toggle button shows a different color when it's in the 'on' state as shown below:
Solution
- To create the rollover effect, we set a different background color for the PRELIGHT state.
- To make the 'on' state of a toggle button take on a different color, we set a different background color for the ACTIVE state.
Sample Code
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 | <?php $window = new GtkWindow(); $window->set_size_request(400, 150); $window->connect_simple('destroy', array('Gtk','main_quit')); $window->add($vbox = new GtkVBox()); // display title $title = new GtkLabel("Setup and Process Toggle Buttons - Part 2"); $title->modify_font(new PangoFontDescription("Times New Roman Italic 10")); $title->modify_fg(Gtk::STATE_NORMAL, GdkColor::parse("#0000ff")); $title->set_size_request(-1, 40); $vbox->pack_start($title, 0, 0); $vbox->pack_start(new GtkLabel(), 0); $vbox->pack_start($hbox = new GtkHBox(), 0); $button1 = setup_button($hbox, 'button 1'); $button2 = setup_button($hbox, 'button 2'); $button3 = setup_button($hbox, 'button 3'); $vbox->pack_start($status = new GtkLabel()); $window->show_all(); Gtk::main(); function setup_button($container, $button_label) { $button = new GtkToggleButton($button_label); $container->pack_start($button, 0); $container->pack_start(new GtkLabel(' '), 0); // add a small gap $button->modify_bg(Gtk::STATE_PRELIGHT, GdkColor::parse("#99FFB3")); // note 1 $button->modify_bg(Gtk::STATE_ACTIVE, GdkColor::parse("#99BFA2")); // note 2 $button->connect('clicked', 'on_click'); return $button; } function on_click($button) { global $status, $button1, $button2, $button3; print "You have clicked: ".$button->get_label()."\n"; $status1 = $button1->get_active()? 'on' : 'off'; $status2 = $button2->get_active()? 'on' : 'off'; $status3 = $button3->get_active()? 'on' : 'off'; $status->set_text( "button 1: $status1\n". "button 2: $status2\n". "button 3: $status3"); } ?> |
Output
As shown above.
Explanation
We make use of the code from How to setup and process toggle buttons - Part 1?
What's new here:
- Set the background color of the preflight state of the toggle button.
- Set the background color of the active state of the toggle button.
Read more...