Izrada aplikacije za Ubuntu Touch [QML] - [3. dio]

Izrada aplikacije za Ubuntu Touch

Treći dio ove serije (prvi deo, drugi dio) gdje gradimo aplikaciju za Ubuntu Touch ili za isto Ubuntu radna površina. Dodati ću dio koji mi se dogodio u prethodnom postu, a to je da, iako smo povećali varijable kvarova, pogodaka i bodova, oni nisu bili prikazani na ekranu, jer nismo promijenili svojstvo teksta Oznake:

                Oznaka {id: tekst grešaka: "Failures:" + nfaults color: "red"} Oznaka {id: hits text: "hits:" + born} Label {id: points text: "Points:" + npoints fontSize: "medium "}

Nastavak logike igre

Vreme

Pa, kao što već znamo, traka napretka pokazuje vrijeme koje imamo za odgovor na pitanje. Za upravljanje vremenom koristit ćemo tajmer, tajmer je element koji se ponavlja u intervalu od x milisekundi, u ovom slučaju svaki interval ćemo mu reći da poveća napredak trake ProgressBar; Ali prije nego što pogledam je li stigao kraj vremena ili ne, u slučaju da dođe do kraja, moramo oduzeti život.

Možete vidjeti redak koda koji još nismo implementirali (PopupUtils.open (dijalog)), ovaj redak treba otvoriti dijalog o završnoj igri u slučaju da više nemamo života (3 greške su uklonjene), kasnije u ovom postu vidjet ćemo kako se vodi ovaj dijalog.

Timer kôd (možemo ga staviti ispod ProgressBar):

       ProgressBar {id: time anchors.horizontalCenter: parent.horizontalCenter minimumValue: 0 maximumValue: 300} Timer {id: simpletimer c: 100 repeat: true running: true onTriggered: {if (time.value <time.maximumValue) time.value + = 1.0 else {nfaults = nfaults + 1 if (nfaults <3) {num = num + 1 Logic.nextQuestion (num) time.value = time.minimumValue} else {simpletimer.stop () PopupUtils.open (dialog)}} }}

Kao što vidimo, u onTriggered smo stavili kod koji će povećati traku napretka dodajući 1 jedinicu na svakih 100 (interval) milli-sekundi. Imajte na umu da smo dodali dva atributa ProgressBar, minimumValue i maximumValue, što je, kao što vidite, maksimalna vrijednost i minimalna vrijednost.

Da biste pokrenuli i zaustavili tajmer:

simpletimer.start () simpletimer.stop ()

Opcije (50%, zamrzavanje i dalje)

Prvo kreirajmo tri varijable koje kontroliraju da se opcije mogu koristiti samo jednom:

    svojstvo int posto: 0 svojstvo int sa: 0 svojstvo int sljedeće: 0

50%

Dugme {id: b50 tekst: "50%" onClicked: {if (posto == 0) {var ispravno = aDocument.contents.questions [num] .correcta if (ispravno == 1) {resp2.enabled = false resp3. enabled = false} else if (ispravno == 2) {resp1.enabled = false resp4.enabled = false} else if (ispravno == 3) {resp1.enabled = false resp4.enabled = false} else {resp2.enabled = false resp1.enabled = false} posto = 1}}

Kada je omogućeno = false, ono što radimo stavljamo dugme tako da se ne može pritisnuti, na takav način da dobivamo točan odgovor sa aDocument.contents.questions [num]. Tačno i odavde, u zavisnosti od toga koje je tačno «uklanjamo »Dva dugmeta koja nisu.

Freeze

                Dugme {id: bCon tekst: "Zamrzni" onClicked: {if (with == 0) simpletimer.stop () with = 1}}

Ovo je jedno od jednostavnih, samo moramo zaustaviti tajmer pomoću simpletimer.stop (), da, moramo ga ponovo uključiti (i postaviti traku napretka na 0) kada prolazimo kroz pitanje.

sljedeći

                 Dugme {id: bSljedeći tekst: "Dalje" onClicked: {if (next == 0) {num = num + 1 Logic.nextQuestion (num) next = 1}}}

Za prosljeđivanje pitanja koristimo funkciju koju smo već kreirali (nextQuestion).

Dijalozi

Za završetak igre koristit ćemo dijalog, bilo zato što smo pobijedili (više nema pitanja) ili zato što smo izgubili (napravili smo 3 pogreške), da bismo koristili dijaloge, moramo uvesti modul:

uvoz Ubuntu.Components.Popups 0.1

Stvorit ćemo dijalog koji nam govori da smo izgubili:

        Komponenta {id: dijalog Dijalog {id: naslov dijaloga: "Igra je gotova!" text: "Izgubili ste sve živote :(" Button {text: "Quit" onClicked: Qt.quit ()} Button {text: "Start over" color: UbuntuColors.orange onClicked: {num = 0; Logica.nextQuestion ( num) npoints = 0 rođenih = 0 PopupUtils.close (dialog)}}}}

Imamo dva gumba, jedan za zatvaranje aplikacije (Qt.quit ()) i drugi za početak igre. Inicijaliziramo varijable na 0 i zatvaramo dijalog.

Da biste otvorili dijalog:

PopupUtils.open (dijalog)

Da biste ga zatvorili:

PopupUtils.close (dijalog)

Pogledajmo dijalog na kraju igre:

Potpuno isti dijalog možemo stvoriti promjenom identifikatora i teksta u kojem piše da smo pobijedili.

Dizajniranje agregata pitanja

Kada ga dizajniramo GTK, kreiramo dijalog, ali ovaj put ćemo to učiniti na kartici, ionako će imati istu strukturu:

Kao što vidimo, koristit ćemo oznaku, TextArea za pisanje pitanja, 4 TextField i 4 Switch; konačno, dugme za dodavanje pitanja. Pogledajmo samo kod:

import QtQuick 2.0 import Ubuntu.Components 0.1 Tab {title: i18n.tr ("+ Pitanja") Stranica {id: pageAdd Column {anchors.top: pageAdd.top anchors.topMargin: 50 razmak: 15 width: parent.width height: parent.height - 50 Oznaka {id: tekst pitanja: "Dodajte pitanje u bazu podataka:" anchors.horizontalCenter: parent.horizontalCenter fontSize: "large"} TextArea {width: parent.width - 20 height: units.gu (12) contentWidth: units.gu (30) contentHeight: units.gu (60) sidra.horizontalCenter: parent.horizontalCenter} Red {razmak: 15 sidra.horizontalCenter: parent.horizontalCenter TextField {placeholderText: "Response 1" width: 300 U} Prebaci {potvrđeno: netačno}} Red {razmak: 15 anchors.horizontalCenter: nadređeni.horizontalCenter TextField {placeholderText: "Response 2" širina: 300} Prebaci {potvrđeno: netačno}} Red {razmak: 15 anchors.horizontalCenter: roditelj. horizontalCenter TextField {placeholderText: "Response 3" širina: 300} Prekidač {označeno: false}} Red {razmak: 15 sidra.horizontalCenter: parent.horizontalCenter TextField {placeholderText: "Response 4" width: 300} Switch {potvrđeno: netačno}} Dugme {tekst: "Dodaj +" sidra.horizontalCenter: nadređeni.horizontalCenter širina: nadređena širina - 20}}}}

Pogledajmo kako to izgleda:

Ako sada testiramo prekidače, vidjet ćemo da ih sve možemo označiti kao ispravno pitanje, a prirodno može biti samo jedno, stoga ćemo učiniti sljedeće: moći ćemo pružiti identifikator svakom prekidaču (također i tekstualnim poljima jer ćemo morati dobiti sadržaj da bismo ga sačuvali u baza podataka) prema vašem odgovoru, a kada je kliknemo, sve ostale stavit ćemo u označeni = netačni način:

             Red {razmak: 15 anchors.horizontalCenter: parent.horizontalCenter TextField {id: res1 placeholderText: "Response 1" width: 300} Switch {id: sw1 check: false onClicked: {if (sw1. Check == true) {sw2. provjereno = lažno sw3. provjereno = lažno sw4. provjereno = netačno}}}}

Ako sada pokušamo, vidjet ćemo kako možemo označiti samo jedan.