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

Izrada aplikacije za Ubuntu Touch

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

                Oznaka {id: tekst neuspjeha: "Neuspjesi:" + nfaults color: "red"} Oznaka {id: hits text: "hits:" + born} Oznaka {id: točke teksta: "Points:" + npoints fontSize: "medium "}

Nastavak logike igre

Tiempo

Pa, kao što već znamo, progressBar pokazuje vrijeme koje imamo za odgovor na pitanje. Za upravljanje vremenom koristit ćemo timer, timer 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 će redak otvoriti dijalog o završnoj igri u slučaju da više nemamo života (eliminirane su 3 programske pogreške), kasnije u ovom postu vidjet ćemo kako se taj dijalog odvija.

Kôd odbrojavanja (možemo ga staviti ispod trake 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 kôd koji će povećati traku napretka dodajući 1 jedinicu na svakih 100 (interval) mili-sekundi. Imajte na umu da smo ProgressBar-u dodali dva atributa, 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 sljedeće)

Prvo stvorimo 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%

Gumb {id: b50 text: "50%" onClicked: {if (percent == 0) {var correct = 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}}

S enabled = false ono što radimo stavljamo gumb tako da se ne može pritisnuti, na takav način da dobivamo točan odgovor s aDocument.contents.questions [num]. Točno i odavde ovisno o tome koji je ispravan «uklanjamo »Dva gumba koja to nisu.

Zamrznuti

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

Ovo je jedno od jednostavnih, samo moramo zaustaviti odbrojavanje pomoću simpletimer.stop (), da, moramo ga ponovo uključiti (i postaviti traku napretka na 0) kad prođemo kroz pitanje.

Sljedeći

                 Gumb {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 dijaloški okvir, bilo zato što smo pobijedili (više nema pitanja) ili zato što smo izgubili (napravili smo 3 pogreške), da bismo koristili dijaloške okvire moramo uvesti modul:

uvoz Ubuntu.Components.Popups 0.1

Stvorit ćemo dijaloški okvir koji će nam reći 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 ponovno pokretanje igre. Varijable inicijaliziramo na 0 i zatvaramo dijaloški okvir.

Da biste otvorili dijaloški okvir:

PopupUtils.open (dijalog)

Da biste ga zatvorili:

PopupUtils.close (dijalog)

Pogledajmo dijalog na kraju igre:

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

Dizajniranje agregata pitanja

Kad 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, gumb 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 {provjereno: netačno}} Red {razmak: 15 sidra.horizontalCenter: nadređeni.horizontalCenter TextField {placeholderText: "Response 2" širina: 300} Prebaci {potvrđeno: netačno}} Red {razmak: 15 sidra.horizontalni Centar: nadređeni. horizontalCenter TextField {placeholderText: "Response 3" širina: 300} Prekidač {potvrđeno: false}} Red {razmak: 15 sidra.horizontalCenter: parent.horizontalCenter TextField {placeholderText: "Response 4" width: 300} Switch {potvrđeno: netačno}} Gumb {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: svakom preklopniku moći ćemo dati identifikator (također i tekstnim poljima, jer ćemo morati dobiti sadržaj da bismo ga spremili u baza podataka) u skladu s vašim odgovorom, a kada je kliknemo, sve ostale stavit ćemo u označeni = lažni način:

             Red {razmak: 15 sidra.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 jednog.