# Εργαλειοθήκη (JavaScript)

Tiffany Antopolski
tiffany.antopolski@gmail.com 2012
Γραμμή εργαλείων
Ελληνική μεταφραστική ομάδα GNOME
team@gnome.gr 2012-2015
Δημήτρης Σπίγγος
dmtrs32@gmail.com 2012, 2013
Μαρία Θουκιδίδου
marablack3@gmail.com 2014
Θάνος Τρυφωνίδης
tomtryf@gmail.com 2014, 2015

# Εργαλειοθήκη

Η εργαλειοθήκη μπορεί να περιέχει είτε κείμενο ή εικονίδια παρακαταθήκης. Σε αυτό το παράδειγμα χρησιμοποιούμε εικονίδια παρακαταθήκης. Αυτό το παράδειγμα έχει λειτουργικότητα πλήρους οθόνης.

Αυτό το παράδειγμα χρησιμοποιεί SimpleActions (παράθυρο και εφαρμογή). Οι ενέργειες της εφαρμογής μπορούν εύκολα να προστεθούν στο μενού της εφαρμογής.

#!/usr/bin/gjs

const Gdk = imports.gi.Gdk; const Gio = imports.gi.Gio; const GLib = imports.gi.GLib; const Gtk = imports.gi.Gtk; const Lang = imports.lang;

const Application = new Lang.Class({ Name: 'Application',

//Δημιουργία της εφαρμογής _init: function() { this.application = new Gtk.Application({ application_id: 'org.example.myapp', flags: Gio.ApplicationFlags.FLAGS_NONE });

//Σύνδεση των σημάτων 'activate' και 'startup' με τις συναρτήσεις επανάκλησης this.application.connect('activate', Lang.bind(this, this._onActivate)); this.application.connect('startup', Lang.bind(this, this._onStartup)); },

//Δημιουργία της διεπαφής χρήστη (σε αυτήν την περίπτωση είναι απλά το παράθυρο της εφαρμογής) _buildUI: function() { this._window = new Gtk.ApplicationWindow({ application: this.application, window_position: Gtk.WindowPosition.CENTER, title: "Toolbar Example", default_height: 200, default_width: 400 });

this._grid = new Gtk.Grid(); this._window.add(this._grid); this._grid.show();

this._createToolbar(); this._toolbar.set_hexpand(true); this._grid.attach(this._toolbar, 0, 0, 1, 1);

//Εμφάνιση της εργαλειοθήκης και του παραθύρου this._toolbar.show(); this._window.show(); },

//Η συνάρτηση επανάκλησης για το σήμα 'activate' _onActivate: function() { this._window.present(); },

//Η συνάρτηση επανάκλησης για το σήμα 'startup' _onStartup: function() { this._initMenus(); this._buildUI(); },

//Δημιουργία της εργαλειοθήκης, των κουμπιών εργαλείων της και των ενεργειών τους _createToolbar: function() {

this._toolbar = new Gtk.Toolbar(); this._toolbar.get_style_context().add_class(Gtk.STYLE_CLASS_PRIMARY_TOOLBAR);

//Δημιουργία του κουμπιού εργαλείου "New" και της απλής του ενέργειας. //Η χρήση ενεργειών επιτρέπει την προσθήκη τους στο μενού εφαρμογών //χωρίς διπλασιασμό του κώδικα. let newAction = new Gio.SimpleAction({ name: 'new'}); newAction.connect('activate', Lang.bind(this, function() { this._newCB(); })); this.application.add_action(newAction);//σημείωση: αυτή η ενέργεια προστίθεται στην εφαρμογή

this._newButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_NEW); this._newButton.is_important = true; this._toolbar.add(this._newButton); this._newButton.show(); this._newButton.action_name = "app.new";

//Δημιουργία του κουμπιού εργαλείου "Open" και της απλής του ενέργειας let openAction = new Gio.SimpleAction({ name: 'open'}); openAction.connect('activate', Lang.bind(this, function() { this._openCB(); })); this.application.add_action(openAction);

this._openButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_OPEN); this._openButton.is_important = true; this._toolbar.add(this._openButton); this._openButton.show(); this._openButton.action_name = "app.open";

//Δημιουργία του κουμπιού εργαλείου "Undo" και της απλής του ενέργειας let undoAction = new Gio.SimpleAction({ name: 'undo'}); undoAction.connect('activate', Lang.bind (this, function() { this._undoCB(); })); this._window.add_action(undoAction);//Σημειώστε ότι αυτή η απλή ενέργεια προστίθεται στο παράθυρο

this._undoButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_UNDO); this._undoButton.is_important = true; this._toolbar.add(this._undoButton); this._undoButton.show(); this._undoButton.action_name = "win.undo";

//Δημιουργία του κουμπιού εργαλείου "Fullscreen" και της απλής του ενέργειας let fullscreenToggleAction = new Gio.SimpleAction ({ name: 'fullscreenToggle' }); fullscreenToggleAction.connect ('activate', Lang.bind (this, function () { this._fullscreenToggleCB(); })); this._window.add_action(fullscreenToggleAction);

this._fullscreenButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_FULLSCREEN); this._fullscreenButton.is_important = true; this._toolbar.add(this._fullscreenButton); this._fullscreenButton.show(); this._fullscreenButton.action_name = "win.fullscreenToggle";

//Δημιουργία του κουμπιού εργαλείου "leaveFullscreen" και ορισμός του ονόματος ενέργειας σε "win.fullscreenToggle" this._leaveFullscreenButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_LEAVE_FULLSCREEN); this._leaveFullscreenButton.is_important = true; this._toolbar.add(this._leaveFullscreenButton); this._leaveFullscreenButton.action_name = "win.fullscreenToggle"; },

_initMenus: function () { let menu = new Gio.Menu(); menu.append("New", 'app.new'); menu.append("Open", 'app.open'); menu.append("Quit", 'app.quit');

this.application.set_app_menu(menu);

let quitAction = new Gio.SimpleAction({name: 'quit' }); quitAction.connect('activate', Lang.bind(this, function() { this._window.destroy(); })); this.application.add_action(quitAction); },

_newCB: function() { print("You clicked 'New'."); },

_openCB: function() { print("You clicked 'Open'."); },

_undoCB:function () { print ("You clicked 'Undo'."); },

_fullscreenToggleCB: function() { if ((this._window.get_window().get_state() & Gdk.WindowState.FULLSCREEN) != 0 ) { this._window.unfullscreen(); this._leaveFullscreenButton.hide(); this._fullscreenButton.show(); } else { this._window.fullscreen(); this._fullscreenButton.hide(); this._leaveFullscreenButton.show(); } } });

//Εκτέλεση της εφαρμογής let app = new Application(); app.application.run(ARGV);

Σε αυτό το παράδειγμα χρησιμοποιήσαμε τα παρακάτω:

Gtk.Window

Gtk.Toolbar

Gtk.ToolButton

Gtk Stock items

Gdk.WindowState