為Ubuntu Touch [QML]創建應用-[第3部分]

為Ubuntu Touch創建應用

本系列文章的第三部分（第一部分, 第二部分）我們正在構建應用程序的位置 Ubuntu Touch 或相同 Ubuntu 桌面。 在上一篇文章中，我將添加一個發生在我身上的部分，那就是儘管我們增加了失敗，命中和得分的變量，但它們並未顯示在屏幕上，這是因為我們沒有更改標籤的文本屬性：

                標籤{id：失敗文本：“失敗：” + nfaults顏色：“紅色”}標籤{id：命中文本：“命中：” +出生}標籤{id：點文本：“點：” + npoints fontSize：“中等” “}

遊戲邏輯的延續

時代報

好吧，正如我們已經知道的，progressBar顯示了我們必須回答問題的時間。 為了管理我們將使用Timer的時間，timer是一個以x毫秒為間隔重複的元素，在這種情況下，我們將告訴每個間隔以增加ProgressBar的進度； 但是在我看它是否已經到了時間的盡頭之前，萬一它到達了盡頭，我們必須減去壽命。

您會看到一行我們尚未實現的代碼（PopupUtils.open（對話框）），此行是為了在我們沒有更多生命（消除了3個錯誤）的情況下打開殘局對話，在本文的後面，我們將看到如何進行對話。

計時器代碼（我們可以將其放在ProgressBar下面）：

       ProgressBar {id：時間anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter最小值：0最大值：300}計時器{id：simpletimer c：100重複：true運行：true on已觸發：{if（time.value <time.maximumValue）time.value + = 1.0否則{nfaults = nfaults + 1 if（nfaults <3）{num = num + 1 Logic.nextQuestion（num）time.value = time.minimumValue} else {simpletimer.stop（）PopupUtils.open（dialog）}} }}

如我們所見，在onTriggered中，我們放置了將增加進度條的代碼，該代碼每1（間隔）（毫秒）。 請注意，我們在ProgressBar中添加了兩個屬性，minimumValue和maximumValue，如您所見，它們是最大值和最小值。

要啟動和停止計時器：

simpletimer.start（）simpletimer.stop（）

選項（50％，凍結和下一步）

首先，讓我們創建三個變量，以控制這些選項只能使用一次：

    屬性int百分比：0屬性int：0屬性int下一個：0

企業排放佔全球 50%

按鈕{id：b50文本：“ 50％” onClicked：{if（percent == 0）{varcorrect = aDocument.contents.questions [num] .correcta if（correct == 1）{resp2.enabled = false resp3。 enabled = false}否則，如果（正確== 2）{resp1.enabled =假resp4.enabled =假}否則，如果（正確== 3）{resp1.enabled =假resp4.enabled =假} else {resp2.enabled = false resp1.enabled = false}百分比= 1}}

啟用= false時，我們要做的是放置按鈕以使其無法被按下，這樣我們就可以通過aDocument.contents.questions [num]獲得正確的答案。正確，並從此處取決於哪個是正確的«我們消除»兩個不是的按鈕。

congelar

                按鈕{id：bCon文本：“凍結” onClicked：{if（使用== 0）simpletimer.stop（）使用= 1}}

這是簡單的方法之一，我們只需要使用simpletimer.stop（）停止計時器，是的，我們在解決問題時必須再次將其打開（並將progressBar設置為0）。

下一頁

                 按鈕{id：b下一個文本：“下一個” onClicked：{if（next == 0）{num = num + 1 Logic.nextQuestion（num）next = 1}}}

我們使用已經創建的函數來傳遞問題（nextQuestion）。

對話對話

要結束遊戲，我們將使用對話框，要么是因為我們贏了（沒有其他問題），要么是我們輸了（我們犯了3個錯誤），要使用對話框，我們必須導入模塊：

導入Ubuntu.Components.Popups 0.1

我們將創建一個對話框，告訴我們我們已經丟失了：

        組件{id：對話框對話框{id：對話框標題：“遊戲結束！” 文本：“您失去了所有生命：(”按鈕{文本：“退出” onClicked：Qt.quit（）}按鈕{文本：“重新開始”顏色：UbuntuColors.orange onClicked：{num = 0; Logica.nextQuestion（num ）npoints = 0出生= 0 PopupUtils.close（對話）}}}}

我們有兩個按鈕，一個用於關閉應用程序（Qt.quit（）），另一個用於重新開始遊戲。 我們將變量初始化為0，然後關閉對話框。

要打開對話框：

PopupUtils.open（對話框）

要關閉它：

PopupUtils.close（對話）

讓我們看看遊戲結束時的對話：

我們可以通過更改標識符和表示獲勝的文本來創建完全相同的對話框。

設計問題匯總

當我們設計它 GTK，我們創建了一個對話框，但是這次我們將在Tab中進行操作，無論如何它將具有相同的結構：

如我們所見，我們將使用Label，TextArea來寫問題，4 TextField和4 Switch； 最後，添加一個按鈕。 讓我們看一下代碼：

導入QtQuick 2.0導入Ubuntu.Components 0.1標籤{title：i18n.tr（“ + Questions”）頁面{id：pageAdd列{anchors.top：pageAdd.top anchors.topMargin：50間距：15寬度：parent.width高度： parent.height-50標籤{id：問題文本：“向數據庫添加問題：” anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter fontSize：“大”} TextArea {width：parent.width-20 height：units.gu（12 ）contentWidth：units.gu（30）contentHeight：units.gu（60）anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter}行{spacing：15 anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter TextField {placeholderText：“響應1”，寬度：300}切換{checked：false}}行{spacing：15 anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter TextField {placeholderText：“ Response 2” width：300}切換{checked：false}}行{spacing：15 anchors.horizo​​ntalCenter：parent。 horizo​​ntalCenter TextField {placeholderText：“響應3”，寬度：300}切換{checked：false}}行{spacing：15 anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter TextField {placeholderText：“ Response 4”，寬度：300}開關{已選中：false}}按鈕{文本：“添加+” anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter寬度：parent.width-20}}}}

讓我們看看它的外觀：

如果現在測試交換機，我們將看到我們可以將它們全部標記為正確的問題，而且自然也只能將其標記為一個問題，因此我們將執行以下操作：我們將能夠為每個交換機（以及到交換機）提供標識符。文本字段，因為我們將不得不根據您的答案獲取內容以將其保存到數據庫中），當我們單擊它時，我們會將所有其他內容置於check = false模式：

             行{spacing：15 anchors.horizo​​ntalCenter：parent.horizo​​ntalCenter TextField {id：res1 placeholderText：“響應1”寬度：300}開關{id：sw1已選中：false onClicked：{if（sw1.checked == true）{sw2。檢查=假sw3.checked =假sw4.checked =假}}}}

如果現在嘗試，我們將看到我們只能標記一個。