App erstellen (Vala + GTK 3) [3. Teil]

In diesem Teil erfahren Sie, wie Sie ein weiteres Fenster erstellen und mit GTK gestalten. Wir werden auch einige Funktionen sehen, wie das Hinzufügen von Fragen und die Verwendung der drei Schaltflächen (50%, Einfrieren und Bestehen).

ToolBar und ToolButton

Erstellen Sie eine Symbolleiste:

Wenn Sie einen ToolButton erstellen, wird in diesem Fall ein Symbol eingefügt (standardmäßig finden Sie viele Symbole hier) mit «from_stock (Gtk.Stock.IconName):

Wir können sehen, dass wir in unserer Anwendung eine Leiste mit zwei Schaltflächen oben haben, in der wir die erste zum Erstellen neuer Fragen und die zweite zum Importieren von Fragen (über eine Datei) verwenden:

Fragen erstellen:
Mit der Schaltfläche, die wir zuvor (in der Symbolleiste) erstellt haben, wenn wir darauf klicken, wird ein neues GTK-Fenster geöffnet, in dem wir Fragen zu unserer Datenbank hinzufügen können:

Um ein neues Fenster zu erstellen, erstellen wir eine neue Klasse, die wir Fragen nennen, und wie unsere App-Klasse ein neues Fenster erstellt (this.window = new Gtk.Window ();)

Wir werden einige Komponenten verwenden, um die grafische Oberfläche der Reihe nach zu erstellen.

-Label (Fragen)

- Eintrag (wo wir die Frage schreiben werden)

-Label (Antworten)

- 4 horizontale Felder, die einen Eintrag (die Antwort) und einen Schalter enthalten (um auszuwählen, ob er korrekt ist)

-Knopf (zum Ausfüllen)

Wir können sehen, wie es aussieht:

Um die Frage zu speichern, müssen wir den Text der Einträge erhalten. Sie werden mit get_text () abgerufen, das eine Zeichenfolge zurückgibt.

Um zu wissen, ob ein Switch aktiv ist, können wir seine Methode verwenden aktiv werden (), das true zurückgibt, wenn es eingeschaltet ist, und flase, wenn es ausgeschaltet ist.

 50%, Freeze- und Pass-Buttons:

 -fünfzig% :

Für 50% müssen wir nur schauen, welche Schaltfläche die richtige ist, und 2 entfernen, die nicht die richtige sind. In diesem Fall brechen wir sie mit set_sensitive (false) ab.

Ergebnis:

-Einfrieren:

Wir setzen die Messlatte wieder auf 0.

this.timebar.set_fraction (0);

-Bestehen:

button3.clicked.connect (() => {
this.bd_select_preguntas ();
this.next_pregunta();
});

 Nächster Teil (4):

In der nächsten Folge werden wir sehen, wie wir Aspekte unserer Anwendung verbessern können, z. B. dass die Fragen nicht immer an derselben Position erscheinen. Fügen Sie der App ein Symbol hinzu ...