إنشاء تطبيق لـ Ubuntu Touch [QML] - [الجزء 3]

إنشاء تطبيق لـ Ubuntu Touch

الجزء الثالث من هذه السلسلة المنشورة (جزء, ثان) حيث نقوم ببناء تطبيق أوبونتو التي تعمل باللمس أو لنفسه أوبونتو سطح المكتب. سأضيف جزءًا فاتني في المنشور السابق ، وهو أنه على الرغم من أننا قمنا بزيادة متغيرات حالات الفشل والنجاحات والنقاط ، إلا أنها لم يتم عرضها على الشاشة ، وذلك لأننا لم نقم بتغيير خاصية النص الخاصة بالملصقات:

                التصنيف {id: misses text: "Misses:" + nmisses color: "red"} التصنيف {id: hit text: "Hits:" + nhits} Label {id: dots text: "Dots:" + ndots fontSize: "medium"}

استمرار منطق اللعبة

مرة

حسنًا ، كما نعلم بالفعل ، يُظهر شريط التقدم انقضاء الوقت الذي يجب أن نجيب فيه على سؤال. لإدارة الوقت الذي سنستخدمه مؤقتًا ، يكون المؤقت عنصرًا يتكرر في فترة زمنية مقدارها x ميلي ثانية ، وفي هذه الحالة سنخبرها بزيادة تقدم شريط التقدم ؛ لكن قبل أن ترى ما إذا كانت قد وصلت إلى نهاية الوقت أم لا ، في حالة وصولها إلى النهاية ، يجب أن نطرح حياة.

يمكنك رؤية سطر من التعليمات البرمجية التي لم ننفذها بعد (PopupUtils.open (مربع حوار)) ، هذا السطر لفتح مربع حوار نهاية اللعبة في حالة عدم وجود المزيد من الأرواح (تم التخلص من 3 أخطاء) ، سنرى لاحقًا في هذا المنشور كيفية إجراء الحوار المذكور.

كود المؤقت (يمكننا وضعه تحت شريط التقدم):

       ProgressBar {id: time anchors.horizontalCenter: parent.horizontalCenter lessValue: 0 maxValue: 300} Timer {id: simpleetimer c: 100 Repeat: true run: true onTriggered: {if (time.value <time.maximumValue) time.value + = 1.0 else {nfal + los = n. estion (num) time.value = time.minimumValue} else {simpleetimer.stop () PopupUtils.open (الحوار)}}}}

كما نرى ، في onTriggered نضع الكود الذي سيزيد شريط التقدم بإضافة وحدة واحدة كل 1 (الفاصلة) ملي ثانية. لاحظ أننا أضفنا سمتين إلى ProgressBar ، وهي الحد الأدنى للقيمة والحد الأقصى للقيمة ، والتي ، كما ترى ، هي الحد الأقصى للقيمة والحد الأدنى للقيمة.

لبدء وإيقاف المؤقت:

simpleetimer.start () simpleetimer.stop ()

الخيارات (50٪ ، التجميد والتالي)

أولاً ، نقوم بإنشاء ثلاثة متغيرات تتحكم في إمكانية استخدام الخيارات مرة واحدة فقط:

    النسبة المئوية لقيمة الخاصية: 0 الخاصية int مع: 0 الخاصية int next: 0

50%

الزر {id: b50 text: "50٪" onClicked: {if (percent == 0) {var correct = aDocument.contents.questions [num] .correct if (right == 1) {resp2.enabled = false resp3.enabled = false} else if (correct == 2) {resp1.enabled = false4. respenabled = false 3} (else = respenabled = false 1}) 4. ممكّن = خطأ} النسبة المئوية = 2}}

مع تمكين = خطأ ، ما نقوم به هو وضع الزر بطريقة لا يمكن الضغط عليها ، بحيث نحصل على الإجابة الصحيحة باستخدام aDocument.contents.questions [العدد] الصحيح ، ومن هنا ، اعتمادًا على أيهما صحيح ، "نحذف" زرين غير صحيحين.

تجمد

                الزر {id: bCon text: "Freeze" onClicked: {if (con == 0) simpleetimer.stop () con = 1}}

هذه واحدة من الطرق السهلة ، علينا فقط إيقاف المؤقت باستخدام simpleetimer.stop () ، نعم ، يجب أن نعيد تشغيله (ونضبط شريط التقدم على 0) عندما ننتقل من سؤال إلى سؤال.

التالى

                 الزر {id: bNext text: "Next" onClicked: {if (next == 0) {num = num + 1 Logic.nextQuestion (num) next = 1}}}

نستخدم الوظيفة التي أنشأناها بالفعل لتمرير السؤال (nextQuestion).

الحوارات

لإنهاء اللعبة ، سنستخدم مربع حوار ، إما لأننا فزنا (لا توجد أسئلة أخرى) أو لأننا خسرنا (ارتكبنا 3 أخطاء) ، لاستخدام الحوارات ، يجب علينا استيراد الوحدة:

استيراد Ubuntu.Components.Popups 0.1

لنقم بإنشاء مربع الحوار الذي يخبرنا أننا فقدنا:

        المكون {المعرف: مربع حوار الحوار {المعرف: عنوان الحوار: "انتهت اللعبة!" text: "لقد فقدت كل الأرواح :(" الزر {النص: "إنهاء" onClicked: Qt.quit ()} الزر {النص: "البدء من جديد" color: UbuntuColors.orange onClicked: {num = 0؛ Logic.nextQuestion (num) npoints = 0 births = 0 PopupUtils.close (حوار)}}}

لدينا زرين ، أحدهما لإغلاق التطبيق (Qt.quit ()) والآخر لإعادة تشغيل اللعبة. نقوم بتهيئة المتغيرات إلى 0 ونغلق مربع الحوار.

لفتح مربع الحوار:

PopupUtils.open (مربع حوار)

لإغلاقه:

PopupUtils.close (حوار)

لنرى الحوار في نهاية اللعبة:

يمكننا إنشاء مربع حوار بنفس الطريقة تمامًا عن طريق تغيير المعرف والنص الذي يشير إلى أننا فزنا.

تصميم مجمع الأسئلة

عندما صممناه في جتك، نقوم بإنشاء مربع حوار ، ولكن هذه المرة سنفعله في علامة تبويب ، على أي حال سيكون له نفس الهيكل:

كما نرى ، سوف نستخدم Label و TextArea لكتابة السؤال و 4 TextField و 4 Switch ؛ أخيرًا ، زر لإضافة السؤال. بدون مزيد من اللغط ، دعنا نرى الكود:

استيراد QtQuick 2.0 استيراد Ubuntu.Components 0.1 علامة تبويب {العنوان: i18n.tr ("+ أسئلة") الصفحة {id: pageAdd Column {anchors.top: pageAdd.top anchors.topMargin: 50 spacing: 15 width: parent.width height: parent.height - 50 Label {id: question text: "Add a ashorks. "large"} TextArea {width: parent.width - 20 height: units.gu (12) contentWidth: Units.gu (30) contentHeight: Units.gu (60) anchors.horizontalCenter: parent.horizontalCenter} الصف {التباعد: 15 anchors.horizontalCenter: parent.horizontal SwitchCenter TextField} {placeonse: parent.horizontal SwitchCenter TextField}} chors. holderText: "Response 1" width: 300} التبديل {محدد: خطأ}} الزر {النص: "Add +" anchors.horizontalCenter: parent.horizontalCenter width: parent.width - 15}}}}

دعونا نرى كيف يبدو:

إذا اختبرنا الآن المفاتيح ، فسنرى أنه يمكننا تحديدها جميعًا على أنها أسئلة صحيحة ، وبطبيعة الحال يمكن أن يكون هناك سؤال واحد فقط ، لذلك سنفعل ما يلي: سنتمكن من تحديد معرف لكل مفتاح (أيضًا لحقول النص حيث سيتعين علينا الحصول على المحتوى لحفظه في قاعدة البيانات) وفقًا لإجابته ، وعندما نضغط عليه سنضع كل الآخرين في وضع الاختيار = خطأ:

             الصف {spacing: 15 anchors.horizontalCenter: parent.horizontalCenter TextField {id: res1 placeholderText: "Response 1" width: 300} Switch {id: sw1 Check: false onClicked: {if (sw1.checked == true) {sw2.checked = false sw3.checked = false sw4.checked} = false}

إذا حاولنا ذلك الآن ، فسنرى كيف يمكننا تحديد واحد فقط.