بالإضافة إلى مكونات AppStudio QML التي تكون متوفرة لك لتصميم واجهة مستخدم التطبيق، يكون لديك أيضًا الوصول إلى جميع مكونات QML الخاصة بـ The Qt Company. يصف هذا الموضوع معظم المكونات المفيدة. للحصول على قائمة كاملة من أنواع Qt QML، راجع وثائق Qt.
فيما يلي بعض أنواع QML الأكثر استخدامًا:
- محدد المواقع
- مثبتات
- التخطيطات
- معيد التقوية
- الولايات
- الاتصالات
تنبيه:
لوحظت اختلافات في عرض عناصر واجهة المستخدم (UI) في تطبيقات ونماذج AppStudio أثناء الترحيل من Qt 5.13.1 إلى Qt 5.15.2. تتضمن بعض الاختلافات الموضع والحجم والتخطيط واللون والقص والالتفاف والخط. راجع عرض جميع عناصر واجهة المستخدم لتطبيقاتك. في بعض الحالات، قد تحتاج إلى تغيير تداخل مكوناتك؛ في حالات أخرى، قد تحتاج إلى تحديد خصائص إضافية أو أقل. نظرًا لوجود قدر كبير من المرونة في كيفية تحديد عناصر واجهة المستخدم في QML، فلا توجد قواعد محددة.
في الإصدار 5.15.2، أنواع خصائص Qt مثل bool و string و int تكون مقيدة ولم تعد تدعم القيم الخالية أو غير المحددة. إذا كان تطبيقك يستخدم هذه الأنواع، فيجب أن تفكر في كيفية دعم القيم الخالية أو غير المحددة. بدلاً من ذلك، يمكنك استخدام نوع الخاصية var، الذي يسمح بالقيم الخالية وغير المحددة، ولكن أيضًا كل القيم المحتملة الأخرى.
محدد المواقع
محدد المواقع هي عناصر الحاوية التي تدير مواضع العناصر داخل واجهة المستخدم. تشمل أنواع محدد المواقع صفوف وأعمدة وشبكة وتدفق. تنظيم العناصر استنادً إلى أي من تلك التي تتح لك ترتيبها في تخطيط منتظم الذي يكون مناسب جيدًا لإعادة تحجيم واجهات المستخدم. على سبيل المثال، تنظيم العناصر في شبكة، وعند عرض التطبيق في اتجاه عمودي قد ترى مصفوفة 2 × 5 من العناصر، لكن تتبدل إلى اتجاه أفقي وسيتم ترتيب شبكة العناصر من جديد تلقائيًا لتلائم بشكل أفضل الشاشة، مما توفر لك مصفوفة عناصر 3 × 4.
للحصول على مزيد من المعلومات عن محدد المواقع، راجع وثائق Qt.
مثبتات
يمكن الاعتقاد بأن كل عنصر لديه سبع نقاط ارتساء، ويمكن تحديد موقع العناصر الأخرى فيما يتعلق بتلك العناصر. تكون هذه النقاط بالأعلى والأسفل والأيسر والأيمن والمركز الأفقي والمركز الرأسي وخط الأساس (الخط الموجود عليه النص في العنصر). هذا يعد مثاليًا لتحديد مواقع العناصر ذات الصلة ببعضها البعض لإنشاء واجهات مستخدم ديناميكية. تظل المثبتات حتى عندما تتغير الأبعاد أو مواقع العناصر. يمكن أيضًا تحديد هوامش المثبتات، مما يحدد مقادر المساحة التي يجب تركها خارج ارتساء عنصر.
للحصول على مزيد من المعلومات عن المثبتات، راجع وثائق Qt.
التخطيطات
لاستخدام مخططات Qt Quick، يجب عليك الرجوع إلى الوحدة النمطية الإضافية في ملف QML، على سبيل المثال:
import QtQuick.Layouts 1.15
المخططات الثلاثة هي RowLayout، وColumnLayout، وGridLayout. مقارنة بالصفوف والأعمدة والشبكات، وباستخدام المخططات التي تسمح لمزيد من التحكم التفصيلي عبر موضع العنصر. يشمل هذا القدرة على تحديد محاذاة كل عنصر في التخطيط. تتيح مخططات الشبكة GridLayouts لك أيضًا تعيين عمود منفصل ومساحة صف، وتمديد العناصر عبر الصفوف والأعمدة، إلى جانب تحديد خلية لشبكة فردية لأحد العناصر. يمكن أيضًا استخدام المخططات لتعيين الحد الأقصى والأدنى المفضل للعرض والارتفاع، إلى جانب القدرة على ملء العرض والارتفاع لكل عنصر. هذا يعد مفيدًا على وجه الخصوث عند التصميم للعرض الديناميكي والمتعدد. يمكن أن تكون المخططات أيضًا معكوسة، وتغيير المخطط من اليسار إلى اليمين إلى مخطط من اليمين إلى اليسار.
معيد التقوية
يقوم كائن معيد التقوية بإنشاء عناصر من قالب للاستخدام مع محدد المواقع، باستخدام بيانات من نموذج. تجميع معيد التقوية ومحدد المواقع هي طريقة فعالة لوضع الكثير من العناصر. يمكن لأحد النماذج القيام بواحدة مما يلي:
- العدد الذي يشير إلى عدد المفوضين ليتم إنشائهم بواسطة معيد التقوية
- مصدر بيانات لقائمة خالية من النماذج—ListModel
- قائمة سلسلة
- قائمة الكائن
يوفر المفوض قالب يقوم بتحدد كل عنصر تم إنشاؤه بواسطة معيد التقوية. يمكن لمفوض معيد التقوية الوصول إلى الفهرس داخل معيد التقوية بالإضافة إلى بيانات النموذج ذات الصلة بالمفوض.
للحصول على مزيد من المعلومات عن معيد التقوية، راجع وثائق Qt.
الولايات
يمكن استخدام الحالات لإظهار عرض مختلف او شاشة مختلفة في أحد التطبيقات. ويمكنك استخدامها لإظهار العناصر أو إخفائها بناءً على قيمة الخاصية لتغيير الإرساء أو لتغيير كائنات الأصل. استنادً إلى الحالة، يمكنك البدء أو التوقف أو توقف الحركات مؤقتًا أو تنفيذ برامج نصية. يحتوي كل مكون يستند إلى عنصر على خاصية حالة وحالة افتراضية. الحالة الافتراضية تكون عبارة عن سلسلة فارغة ("") وتحتوي على قيم خاصية مبدئية. سوف يعمل تعيين خاصية الحالة إلى سلسلة فارغة على تحميل حالة افتراضية.
للحصول على مزيد من المعلومات عن الحالات، راجع وثائق Qt.
الاتصالات
في Qt الإصدار 5.15، هناك بناء جملة جديد للاتصالات. تم إهمال الطريقة السابقة لإنشاء معالج on <Signal>، والآن يجب اتباع صيغة الدالة. فيما يلي رسالة تحذير ستتلقاها عند تشغيل أحد التطبيقات باستخدام صيغة الاتصال السابقة:
qrc:/qml/main.qml:277:5: QML Connections: Implicitly defined onFoo properties in Connections are deprecated. Use this syntax instead: function onFoo (<arguments>) { ... }يوضح المثال التالي كيف تم تعريف الاتصال بشكل نموذجي في Qt الإصدار 5.13 والإصدارات السابقة:
Connections {
target: mouseArea
onPositionChanged: {
console.log( "onPositionChanged: ", mouse.x, mouse.y );
}
onPressedChanged: {
console.log( "onPressedChanged: ", mouseArea.pressed );
}
}
يوضح المثال التالي كيف يجب تعريف الاتصال في Qt الإصدار 5.15 والإصدارات الأحدث:
Connections {
target: mouseArea
function onPositionChanged(mouse) {
console.log( "onPositionChanged: ", mouse.x, mouse.y );
}
function onPressedChanged() {
console.log( "onPressedChanged: ", mouseArea.pressed );
}
}
الآن بعد أن تم استخدام صيغة الدالة، يجب عليك التأكد من إدراج أي معلمات إشارة بشكل صريح. إذا حذفت أيًا منها، فلن تكون معلمات الإشارة متاحة بأسمائها، وقد يؤدي ذلك إلى مراجع غير محددة في التعليمات البرمجية الخاصة بك. على سبيل المثال، يجب أن تستخدم function onPositionChanged(mouse) بدلاً من onPositionChanged.
عند إدراج معلمات الإشارة، يوصى بإدراج جميع المعلمات بالترتيب الصحيح باستخدام أسماء معلمات الإشارة الرسمية كأسماء معلمات الدالة. على سبيل المثال، استخدم function onPositionChanged(mouse) وليس function onPositionChanged(m).
إذا كانت الإشارة لتغيير الخاصية، يجب عليك تسمية الكائن بوضوح للوصول إلى الخاصية. على سبيل المثال، يجب أن تستخدم mouseArea.pressed وليس pressed.
للحصول على مزيد من المعلومات عن الاتصالات، راجع وثائق Qt.