# ButtonBox (JavaScript)

Meg Ford
megford@gnome.org 2013
Kontejner pro uspořádání tlačítek

# ButtonBox

Kalkulačka – tlačítka jsou umístěna do vodorovných widgetů ButtonBox.

# Kód použitý k vygenerování tohoto příkladu

#!/usr/bin/gjs

imports.gi.versions.Gtk = '3.0';

const GObject = imports.gi.GObject; const Gtk = imports.gi.Gtk;

class ButtonBoxExample {

// Vytvoří vlastní aplikaci constructor() { this.application = new Gtk.Application({ application_id: 'org.example.jsbuttonbox' });

// Napojí signály "activate" a "startup" k funkcím zpětného volání this.application.connect('activate', this._onActivate.bind(this)); this.application.connect('startup', this._onStartup.bind(this)); }

// Funkce zpětného volání pro signál "activate" zobrazujicí okno při aktivaci _onActivate() { this.window.present(); }

// Funkce zpětného volání pro signál "startup" sestavující uživatelské rozhraní _onStartup() { this._buildUI(); }

// Sestaví uživatelské rozhraní aplikace _buildUI() { // Vytvoří okno aplikace this.window = new Gtk.ApplicationWindow ({ application: this.application, window_position: Gtk.WindowPosition.CENTER, title: "Calculator", default_width: 350, default_height: 200, border_width: 10 }); this.entry = new Gtk.Entry(); this.entry.set_text('0'); // Text zarovnaný doprava this.entry.set_alignment(1); // Text ve vstupním poli nelze měnit psaním this.entry.set_can_focus(false);

// Mřížka this.grid = new Gtk.Grid(); this.grid.set_row_spacing(5);

// Připojí vstupní pole this.grid.attach(this.entry, 0, 0, 1, 1);

// Popisky pro tlačítka this.buttons = [ 7, 8, 9, '/', 4, 5, 6, '*', 1, 2, 3, '-', 'C', 0, '=', '+' ];

// Každý řádek je ButtonBox připojený do mřížky for (let i = 0; i < 4; i++) { this.hbox = Gtk.ButtonBox.new(Gtk.Orientation.HORIZONTAL); this.hbox.set_spacing(5); this.grid.attach(this.hbox, 0, i + 1, 1, 1); // Každý ButtonBox má 4 tlačítka napojená na funkci zpětného volání for (let j= 0; j < 4; j++) { this.button = new Gtk.Button(); this.buttonLabel = (this.buttons[i * 4 + j].toString()); this.button.set_label(this.buttonLabel); this.button.set_can_focus(false); this.button.connect("clicked", this._buttonClicked.bind(this)); this.hbox.add(this.button); } }

// Pár proměnných pro výpočty this.firstNumber = 0; this.secondNumber = 0; this.counter = 0; this.operation = "";

// Přídá mřížku do okna this.window.add(this.grid); this.window.show_all(); }

// Funkce zpětného volání pro všechna tlačítka _buttonClicked(button) { this.button = button; // Pro početní operace if (this.button.get_label() == '+') { this.counter += 1 if (this.counter > 1) this._doOperation(); this.entry.set_text('0'); this.operation = "plus"; }

else if (this.button.get_label() == '-') { this.counter += 1; if (this.counter > 1) this._doOperation(); this.entry.set_text('0'); this.operation = "minus"; }

else if (this.button.get_label() == '*') { this.counter += 1; if (this.counter > 1) this._doOperation(); this.entry.set_text('0'); this.operation = "multiplication"; }

else if (this.button.get_label() == '/') { this.counter += 1 if (this.counter > 1) this._doOperation(); this.entry.set_text('0'); this.operation = "division"; }

// Pro = else if (this.button.get_label() == '=') { this._doOperation(); this.entry.set_text(this.firstNumber.toString()); this.counter = 1; }

// Pro mazání else if (this.button.get_label() == 'C') { this.firstNumber = 0; this.secondNumber = 0; this.counter = 0; this.entry.set_text('0'); this.operation = ""; }

// Pro číslice else { this.newDigit = parseInt(this.button.get_label()); if (this.entry.get_text() == "error") this.number = 0; else this.number = parseInt(this.entry.get_text()); this.number = this.number * 10 + this.newDigit; if (this.counter == 0) this.firstNumber = this.number; else this.secondNumber = this.number; this.entry.set_text(this.number.toString()); } }

_doOperation() { if (this.operation == "plus") { this.firstNumber += this.secondNumber; } else if (this.operation == "minus") { this.firstNumber -= this.secondNumber; } else if (this.operation == "multiplication") { this.firstNumber *= this.secondNumber; } else if (this.operation == "division") { if (this.secondNumber != 0) { this.firstNumber /= this.secondNumber; } else { this.firstNumber = 0; this.secondNumber = 0; this.counter = 0; this.entry.set_text("error"); this.operation = "";

return } } else { this.firstNumber = 0; this.secondNumber = 0; this.counter = 0; this.entry.set_text("error"); } } };

// Spustí aplikaci let app = new ButtonBoxExample(); app.application.run (ARGV);

# Odkazy k API

V této ukázce se používá následující:

GtkButtonBox

GtkBox

GtkButton

GtkEntry

GtkGrid