Een app maken (Vala + GTK 3) [3e deel]

In dit deel zullen we zien hoe we een ander venster kunnen maken en dit met GTK kunnen ontwerpen. We zullen ook enkele functionaliteiten zien zoals het toevoegen van vragen en het gebruik van de drie knoppen (50%, stilzetten en passeren).

ToolBar en ToolButton

Maak een werkbalk:

Een ToolButton maken, in dit geval zullen we een pictogram plaatsen (u kunt standaard veel pictogrammen vinden hier) met «from_stock (Gtk.Stock.IconName):

We kunnen zien dat we in onze applicatie een balk hebben met twee knoppen bovenaan, waar we de eerste zullen gebruiken om nieuwe vragen te maken en de tweede om vragen te importeren (via een bestand):

Vragen aanmaken:
Met de knop die we eerder hebben gemaakt (in de werkbalk) als we erop klikken, openen we een nieuw gtk-venster waarmee we vragen aan onze database kunnen toevoegen:

Om een ​​nieuw venster te maken, zullen we een nieuwe klasse aanmaken, die we Vragen zullen noemen, en hoe onze App-klasse een nieuw venster zal aanmaken (this.window = new Gtk.Window ();)

We zullen een paar componenten gebruiken om de grafische interface op volgorde te maken;

-Label (vragen)

- Invoer (waar we de vraag zullen schrijven)

-Label (reacties)

- 4 horizontale vakken die een invoer (het antwoord) en een schakelaar bevatten (om te selecteren of dit de juiste is)

-Button (om te voltooien)

We kunnen zien hoe het eruit ziet:

Om de vraag op te slaan, moeten we de tekst van de items ophalen, ze worden verkregen met get_text () die een string retourneert.

Om te weten of een switch actief is, kunnen we de bijbehorende methode gebruiken word actief () die true retourneert als het is ingeschakeld en flase als het is uitgeschakeld.

 50%, Freeze en Pass-knoppen:

 -vijftig%:

Voor 50% hoeven we alleen maar te kijken welke de juiste knop is en 2 die niet juist zijn te verwijderen, in dit geval annuleren we ze met set_sensitive (false).

resultaat:

-Bevriezen:

We zetten de lat weer op 0.

this.timebar.set_fraction (0);

-Voorbij gaan aan:

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

 Volgend deel (4):

In de volgende aflevering zullen we zien hoe we aspecten van onze applicatie kunnen verbeteren, zoals dat de vragen niet altijd op dezelfde positie verschijnen, een pictogram op de app plaatsen ...