# CheckButton (JavaScript)

Taryn Fox
jewelfox@fursona.net 2012
Ένα κουμπί που μπορεί να σημειωθεί ή να αποσημειωθεί
Ελληνική μεταφραστική ομάδα GNOME
team@gnome.gr 2012-2015
Δημήτρης Σπίγγος
dmtrs32@gmail.com 2012, 2013
Μαρία Θουκιδίδου
marablack3@gmail.com 2014
Θάνος Τρυφωνίδης
tomtryf@gmail.com 2014, 2015

# CheckButton

Αυτή η εφαρμογή έχει ένα CheckButton. Εάν το πλαίσιο είναι σημειωμένο υπαγορεύει εάν η γραμμή τίτλου του παραθύρου εμφανίζει οτιδήποτε.

Ένα CheckButton στέλνει το σήμα "εναλλαγής" όταν σημειώνεται ή αποσημειώνεται. Ενώ είναι σημειωμένο, η ιδιότητα "ενεργή" είναι αληθής. Ενώ εάν δεν είναι, το "ενεργή" ελέγχεται ως ψευδής.

# Βιβλιοθήκες για εισαγωγή

#!/usr/bin/gjs

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

const Gio = imports.gi.Gio; const Gtk = imports.gi.Gtk;

Αυτές είναι οι βιβλιοθήκες που χρειαζόμαστε να εισάγουμε αυτήν την εφαρμογή για να εκτελεστεί. Να θυμόσαστε ότι η γραμμή που λέει στο GNOME ότι χρησιμοποιούμε Gjs χρειάζεται πάντοτε να πάει στην αρχή.

# Δημιουργία του παραθύρου εφαρμογής

class CheckButtonExample { // Create the application itself constructor() { this.application = new Gtk.Application({ application_id: 'org.example.jscheckbutton', flags: Gio.ApplicationFlags.FLAGS_NONE });

// Connect 'activate' and 'startup' signals to the callback functions this.application.connect('activate', this._onActivate.bind(this)); this.application.connect('startup', this._onStartup.bind(this)); }

// Callback function for 'activate' signal presents window when active _onActivate() { this._window.present(); }

// Callback function for 'startup' signal builds the UI _onStartup() { this._buildUI (); }

Όλος ο κώδικας για αυτό το παράδειγμα πηγαίνει στην κλάση CheckButtonExample. Ο παραπάνω κώδικας δημιουργεί μια Gtk.Application για να μπουν μέσα τα γραφικά στοιχεία μας και τα παράθυρα.

// Build the application's UI _buildUI() {

// Create the application window this._window = new Gtk.ApplicationWindow({ application: this.application, window_position: Gtk.WindowPosition.CENTER, default_height: 100, default_width: 300, border_width: 10, title: "CheckButton Example"});

Η συνάρτηση _buildUI είναι εκεί που βάζουμε όλον τον κώδικα για να δημιουργήσουμε τη διεπαφή χρήστη της εφαρμογής. Το πρώτο βήμα δημιουργεί ένα νέο Gtk.ApplicationWindow για να βάλουμε μέσα τα γραφικά στοιχεία μας.

# Δημιουργία του πλήκτρου ελέγχου

// Create the check button this._button = new Gtk.CheckButton ({label: "Show Title"}); this._window.add (this._button);

// Have the check button be checked by default this._button.set_active (true);

// Connect the button to a function that does something when it's toggled this._button.connect ("toggled", this._toggledCB.bind(this));

Αυτός ο κώδικας δημιουργεί το ίδιο το πλήκτρο ελέγχου. Η ετικέτα δίπλα στο πλήκτρο ελέγχου δημιουργείται δίνοντας στο πλήκτρο ελέγχου την ιδιότητα "label" και αποδίδοντας την τιμή μιας συμβολοσειράς σε αυτή. Επειδή αυτό το πλήκτρο ελέγχου εναλλάσσεται εάν ο τίτλος παραθύρου είναι ενεργός ή όχι και ο τίτλος παραθύρου θα είναι ενεργός στην εκκίνηση, θέλουμε το πλαίσιο να σημειωθεί από προεπιλογή. Όταν ο χρήστης σημειώνει ή ξεσημειώνει το πλαίσιο, καλούμε τη συνάρτηση _toggledCB.

// Show the window and all child widgets this._window.show_all(); }

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

# Η συνάρτηση που χειρίζεται την εναλλαγή του πλαισίου ελέγχου

_toggledCB() {

// Make the window title appear or disappear when the checkbox is toggled if (this._button.get_active() == true) this._window.set_title ("CheckButton Example"); else this._window.set_title ("");

}

};

Εάν το πλήκτρο ελέγχου εναλλάσσεται από ενεργό σε ανενεργό, θέλουμε ο τίτλος του παραθύρου να εξαφανιστεί. Εάν εναλλάσσεται από ανενεργό σε ενεργό, το θέλουμε να επανεμφανίζεται. Μπορούμε να πούμε με ποιο τρόπο εναλλάχτηκε δοκιμάζοντας να δούμε εάν είναι ενεργό (σημειωμένο) ή όχι κατόπιν. Μια απλή πρόταση if / else που καλεί τη μέθοδο get_active() του πλήκτρου ελέγχου θα δουλέψει για αυτό.

// Run the application let app = new CheckButtonExample (); app.application.run (ARGV);

Τελικά, δημιουργούμε ένα νέο παράδειγμα της τελειωμένης κλάσης CheckButtonExample και εκτελούμε την εφαρμογή.

# Δείγμα πλήρους κώδικα

#!/usr/bin/gjs

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

const Gio = imports.gi.Gio; const Gtk = imports.gi.Gtk;

class CheckButtonExample {

// Create the application itself constructor() { this.application = new Gtk.Application({ application_id: 'org.example.jscheckbutton', flags: Gio.ApplicationFlags.FLAGS_NONE });

// Connect 'activate' and 'startup' signals to the callback functions this.application.connect('activate', this._onActivate.bind(this)); this.application.connect('startup', this._onStartup.bind(this)); }

// Callback function for 'activate' signal presents window when active _onActivate() { this._window.present(); }

// Callback function for 'startup' signal builds the UI _onStartup() { this._buildUI(); }

// Build the application's UI _buildUI() {

// Create the application window this._window = new Gtk.ApplicationWindow({ application: this.application, window_position: Gtk.WindowPosition.CENTER, default_height: 100, default_width: 300, border_width: 10, title: "CheckButton Example"});

// Create the check button this._button = new Gtk.CheckButton ({label: "Show Title"}); this._window.add (this._button);

// Have the check button be checked by default this._button.set_active (true);

// Connect the button to a function that does something when it's toggled this._button.connect ("toggled", this._toggledCB.bind(this));

// Show the window and all child widgets this._window.show_all(); }

_toggledCB() {

// Make the window title appear or disappear when the checkbox is toggled if (this._button.get_active() == true) this._window.set_title ("CheckButton Example"); else this._window.set_title ("");

}

};

// Run the application let app = new CheckButtonExample (); app.application.run (ARGV);

# Τεκμηρίωση σε βάθος

Gtk.Application

Gtk.ApplicationWindow

Gtk.CheckButton