Criando um aplicativo para Ubuntu Touch [QML] - [Parte 2]

introdução:

Bem, aqui temos o post que segue a primeira parteNeste vamos nos concentrar no tratamento dos dados (questões), e começaremos com a parte lógica do jogo, no próximo vamos finalizar a lógica e implementar o tempo e as 3 opções.

Base de dados:

Para o banco de dados, usaremos u1db, que é um banco de dados que salva os dados no formato JSON.

Primeiramente vamos ver quais dados devemos salvar, temos 1 questão (além do texto da questão seria bom ter um identificador), com 4 respostas possíveis, das quais apenas 1 pode ser, portanto o documento em JSON única pergunta deve ser:

{
"id": 1,
"pregunta": " habra dev.desdelinux.net ",
"respuestas" : { r1: "si" , r2: "no" , r3: "no se sabe" ,  r4: "esto es una respuesta falsa" },
"correcta": 3
}

Como vemos, estruturamos em formato JSON onde temos um identificador, uma string com a pergunta er1, r2 que representam a resposta 1 e a resposta 2, finalmente temos qual das respostas é a correta.

Vamos ver um pouco como funciona o U1db, a primeira coisa que temos que fazer para usar o U1db é importar o módulo:

import U1db 1.0 as U1db

Declaramos o banco de dados:

U1db.Database {
id: aDatabase
path: "aU1DbDatabase"
}

Os bancos de dados serão salvos como aU1DbDatabase.u1db, agora vamos criar um documento:

U1db.Document {
id: aDocument
database: aDatabase
docId: 'helloworld'
create: true
defaults: { "hello": "Hello World!" }
}


Onde podemos ver o formato {«hello»: «something»}, para executar consultas, seja para adicionar dados, obter dados, apagá-los etc. Temos o elemento U1db.Query.

Vamos para nosso aplicativo e criar nosso banco de dados, como vimos, definimos o banco de dados:

U1db.Database {id: db questions; caminho: "questiondb.u1db"}

Ok, agora vamos colocar alguns elementos padrão no documento de banco de dados questiondb:

    U1db.Document {
        id: aDocument
        database: preguntasdb
        docId: 'preguntas'
        create: true
        defaults: { "preguntas":
                    [
                        {"pregunta":"Habra dev.desdelinux.net ?", 
                        "r1":"si", "r2":"no", "r3":"nose", 
                        "r4":"respuesta falsa", "correcta": "3" },
                        {"pregunta":"Quien es hagrid (harry potter) ?", 
                        "r1":"El vicedirector de la escuela", 
                        "r2":"El guardabosques", 
                        "r3":"El profesor de transformaciones", 
                        "r4":"Un prefecto", 
                        "correcta": "2"},
                        {"pregunta":"¿Cúal es la capital de Islandia?", 
                       "r1":"Amsterdam",
                       "r2":"Reykjavik", 
                       "r3":"Tiflis", 
                       "r4":"Almaty",
                       "correcta": "2"}
                    ] }
    }

Estou ciente de que o código não é exibido como deveria, mas se olharmos com atenção, veremos que temos um elemento perguntas, que com »[]» especificamos que pode haver vários (eles não são estáticos) elementos; neste caso teremos 4 por padrão, 4 questões com suas respectivas respostas.

Para obter os elementos do documento JSON, podemos especificar o identificador do documento que criamos (que é um documento) Vamos imaginar que queremos obter o texto da primeira questão:

aDocument.contents.questions [0] .question

Esta línea de código nos retorna el contenido de pregunta del documento aDocument, del elemento 0 (el primero del índice), que es: «Habra dev.desdelinux.net?». Si ponemos en el índice el número 1, entonces seáa la segunda pregunta.

Programando a lógica do jogo

Bem, agora que sabemos como lidar com o banco de dados onde salvamos as perguntas, vamos programar a lógica do jogo. Em primeiro lugar, vamos criar um arquivo JavaScript (.js): Adicionar novo -> Qt -> Arquivo Js. Vou ligar para ele Logic.js.

No arquivo vamos criar várias funções, para importar o arquivo js para o nosso documento qml:

importe "logica.js" como Logica

Associamos o nome Logica, portanto quando quisermos chamar uma função faremos como Logica.funcion (), como se fosse um objeto que possui seus métodos.

Por enquanto, para que a postagem não fique muito longa, deixaremos o tempo da pergunta e as opções para depois, nos concentraremos nas perguntas e nos pontos, vamos ver uma função que usaremos para seguir em frente com a pergunta:

function nextQuestion (num) {// time = 0 question.text = aDocument.contents.questions [num] .question; resp1.text = aDocument.contents.questions [num] .r1; resp2.text = aDocument.contents.questions [num] .r2; resp3.text = aDocument.contents.questions [num] .r3; resp4.text = aDocument.contents.questions [num] .r4; }

Como podemos ver, passamos o número da pergunta onde estamos como um argumento e a partir daqui ele coloca as respostas nos botões e no rótulo da pergunta. Vamos ver agora para validar se a resposta selecionada está correta:

função hit (num, opção) {var hit = false; var num_correcto = aDocument.contents.questions [num] .correct; if (opção == correct_num) hit = true; hit de retorno; }

O código fala por si, caso a opção escolhida seja igual à fornecida pelo banco de dados, então será verdadeiro, caso contrário não será. Agora que temos essas funções definidas, vamos aplicá-las em nosso código qml.

Em primeiro lugar, adicionaremos uma variável que controlará em qual questão estamos, vamos chamá-la de num; Teremos também mais três variáveis: acertos, erros e pontos.

    propriedade int num: 0 propriedade int nfaults: 0 propriedade int npontos: 0 propriedade int npoints: 0

Inicialmente, eles estão todos em 0.

Agora adicionamos um onClick a todos os botões de resposta. onClick, como o próprio nome diz, é um evento que acontecerá quando esse botão for clicado:

            Botão {id: resp1 text: "Response 1" anchors.horizontalCenter: parent.horizontalCenter width: parent.width - 20 onClicked: {if (Logic.certain (num, 1)) {num = num + 1; Logic.nextQuestion (num) npoints = npoints + 50 nascimentos = nascimentos + 1} else {nfaults = nfaults + 1}}}

Vemos que ao clicar no botão, ele verifica se está correto ou não, caso esteja correto, some os pontos e passe a questão, caso contrário resta uma vida.

Por fim, faremos a primeira pergunta carregar quando o componente Página for carregado:

    Página {id: pageGame Component.onCompleted: {Logic.nextPregunta (0)}

Vamos ver como ficou: