الإعداد باستخدام C++
تنصيب كيريغامي
قبل البدء، سنحتاج إلى تنصيب كيريغامي على جهازنا. هناك ثلاث طرق لفعل ذلك:
- تنصيب كيريغامي من المستودعات في توزيعة لينكس الخاصة بك
- استخدام kde-builder
- تنصيب كيريغامي باستخدام كرافت
إذا كنت على توزيعة محدثة بما يكفي مثل دبيان تيستينغ، أو أحدث إصدار غير LTS من أوبونتو، أو فيدورا، أو openSUSE Tumbleweed، أو آرتش، فيمكنك تنصيب كيريغامي من توزيعتك.
إذا كنت على توزيعة غير محدثة مثل دبيان ستيبل أو أوبونتو LTS، فيجب عليك استخدام kde-builder لهذا الدليل. من المفترض أن يستخدم 2 جيجابايت كحد أقصى من التخزين.
تنصيب كيريغامي من المستودعات في توزيعة لينكس الخاصة بك
نحتاج إلى مترجم C++، وحزم تطوير كيوت، وكيريغامي. افتح تطبيق طرفية وشغّل أحد الأوامر التالية، اعتمادًا على توزيعة لينكس التي تستخدمها:
sudo apt install build-essential cmake extra-cmake-modules libkirigami-dev libkf6i18n-dev libkf6coreaddons-dev libkf6iconthemes-dev qt6-base-dev qt6-declarative-dev libkf6qqc2desktopstyle-dev | |
sudo pacman -S base-devel extra-cmake-modules cmake kirigami ki18n kcoreaddons breeze kiconthemes qt6-base qt6-declarative qqc2-desktop-style | |
sudo zypper install cmake kf6-extra-cmake-modules kf6-kirigami-devel kf6-ki18n-devel kf6-kcoreaddons-devel kf6-kiconthemes-devel qt6-base-devel qt6-declarative-devel qt6-quickcontrols2-devel kf6-qqc2-desktop-style | |
sudo dnf install @development-tools @development-libs cmake extra-cmake-modules kf6-kirigami2-devel kf6-ki18n-devel kf6-kcoreaddons-devel kf6-kiconthemes-devel qt6-qtbase-devel qt6-qtdeclarative-devel qt6-qtquickcontrols2-devel kf6-qqc2-desktop-style |
يمكن العثور على مزيد من المعلومات للتوزيعات الأخرى في تنصيب تبعيات البناء.
استخدام kde-builder
اضبط بيئة التطوير الخاصة بك باستخدام kde-builder. سيمنحك ذلك أدوات التطوير الضرورية والمكتبات الأساسية، ويبني أطر عمل كيدي من الصفر.
أنشئ مجلدًا ~/kde/src/kirigami-tutorial. في ذلك المجلد ستضع ملفات الشيفرة المصدرية من هذا الدليل.
أضف ما يلي في نهاية ملف ~/.config/kde-builder.yaml:
project kirigami-tutorial:
no-src: true⏳ مع kdesrc-build...
انقر هنا لتعرف كيف أُنجز هذا باستعمال kdesrc-build
كانت هذه الخطوة تُنجز سابقًا بالكتابة إلى ~/.config/kdesrc-buildrc بدلًا من ذلك بصيغة مختلفة:
# after include ${module-definitions-dir}/kf6-qt6.ksb
module kirigami-tutorial
no-src
end moduleتنصيب كيريغامي باستخدام كرافت
لدى كيدي أداة مخصصة لتنصيب معظم مكتباتها وبرامجها بسهولة: كرافت. يمكن استخدامها لتنصيب كيريغامي على ويندوز وأندرويد وماك أو إس.
بينما كرافت متاح أيضًا للينكس وفري بي إس دي، فإن استخدامه المقصود هو فقط لصور التطبيقات AppImages والتغليف.
ستحتاج إلى اتباع تعليمات إعداد كرافت. بنهاية الإعداد، يجب أن تكون قد شغّلت ملف إعداد البيئة (craftenv.ps1 على ويندوز، أو craftenv.sh على جميع المنصات الأخرى)، والذي سيمنحك صدفة طرفية حيث ستُجمّع تطبيق كيريغامي الخاص بك.
بعد ذلك، يمكنك تشغيل ما يلي على طرفية:
craft kirigami kcoreaddons ki18n breeze kiconthemes qqc2-desktop-styleسيستغرق هذا بعض الوقت للانتهاء عند التشغيل الأول. إذا أغلقت طرفيتك، يمكنك تشغيل ملف إعداد البيئة لتجهيز طرفيتك مرة أخرى.
هيكل المشروع
بينما توجد أدوات يمكنها إعداد ملفاتنا بسهولة، سنقوم بإنشائها يدويًا. سيسمح لنا هذا بفهم أفضل للقطع التي ستُشكّل تطبيقنا الجديد.
أولاً ننشئ مجلد مشروعنا (يمكنك استخدام الأوامر أدناه). سنسمي مجلدنا kirigami-tutorial/.
kirigami-tutorial/
├── CMakeLists.txt
├── org.kde.tutorial.desktop
└── src/
├── CMakeLists.txt
├── main.cpp
└── Main.qmlضمن هذا المجلد سننشئ مجلد src/ وملف CMakeLists.txt. من الممارسات الجيدة عمومًا وضع جميع ملفات شيفرة C++ الرئيسية في مجلد src/. نضع أيضًا ملف Main.qml فيه لأنه سيُشغَّل مع الملف التنفيذي.
تلميح
يمكنك إنشاء هيكل الملفات هذا بسرعة باستخدام:
mkdir -p kirigami-tutorial/src
touch kirigami-tutorial/{CMakeLists.txt,org.kde.tutorial.desktop}
touch kirigami-tutorial/src/{CMakeLists.txt,main.cpp,Main.qml}ملاحظة
في حال أردت بناء المشروع آليًا باستخدام kde-builder، يجب أن يكون اسم الوحدة المخصصة مطابقًا لمجلد جذر المشروع (في حالتنا سيكون "kirigami-tutorial")، وإلا فستحتاج إلى تخصيصsource-dir أو dest-dir للوحدة. سنفترض أن مسار main.cpp سيكون ~/kde/src/kirigami-tutorial/src/main.cpp.Main.qml
| |
هنا سنتعامل مع الواجهة الأمامية لتطبيقنا.
إذا كنت تعرف بعض Javascript، فسيبدو لك الكثير من QML مألوفًا (رغم أن له خصائصه الخاصة). توثيق Qt يحتوي على كمية هائلة من المواد حول هذه اللغة إذا شعرت برغبة في تجربة شيء بنفسك. خلال هذه الدروس سنركز كثيرًا على شيفرة QML الخاصة بنا، حيث يمكننا استخدام Kirigami للاستفادة القصوى منها.
الآن، لنركز على Main.qml. أولاً نستورد عددًا من الوحدات المهمة:
- QtQuick، المكتبة القياسية المستخدمة في تطبيقات QML.
- QtQuick Controls، التي توفر عددًا من عناصر التحكم القياسية التي يمكننا استخدامها لجعل تطبيقاتنا تفاعلية.
- QtQuick Layouts، التي توفر أدوات لوضع المكونات داخل نافذة التطبيق.
- Kirigami، التي توفر عددًا من المكونات المناسبة لإنشاء تطبيقات تعمل عبر أجهزة بأشكال وأحجام مختلفة.
ملاحظة
وضع استيرادات QtQuick Controls وKirigami في نطاقات أسماء منفصلة باستخدام الكلمة المفتاحيةas هو ممارسة مثلى تضمن عدم تعارض أي مكونات بنفس الاسم. قد ترى أسماء مختلفة لـ QtQuick Controls في الممارسة العملية، مثل "QQC" أو "QQC2". سنستخدم "Controls" في هذا الدليل للوضوح.ثم نصل إلى العنصر الأساسي لدينا، Kirigami.ApplicationWindow، الذي يوفر بعض الميزات الأساسية اللازمة لجميع تطبيقات Kirigami. هذه هي النافذة التي ستحتوي كل صفحة من صفحاتنا، الأقسام الرئيسية لواجهة المستخدم لدينا.
ثم نضبط خاصية id للنافذة على "root". المعرفات مفيدة لأنها تسمح لنا بالإشارة بشكل فريد إلى مكون، حتى لو كان لدينا عدة مكونات من نفس النوع.
نضبط أيضًا خاصية title للنافذة على "Hello World". ستلاحظ أننا لففنا السلسلة النصية "Hello World" في دالة تسمى i18nc()، حيث نفصل سياق السلسلة النصية بالإضافة إلى السلسلة نفسها.
ملاحظة
دوال i18n() تجعل تطبيقك أكثر قابلية للترجمة، لأنها تُرجع نسخة من السلسلة النصية المقدمة بلغة المستخدم (طالما تم توطين تطبيقك لتلك اللغة). بينما قد يرى مستخدم إنجليزي عنوان نافذتنا كـ "Hello World"، سيرى مستخدم إسباني "Hola Mundo".
دالة i18nc() تبني على دالة i18n() بالسماح للمطورين بتقديم بعض السياق للمترجمين العاملين على التطبيق. هنا نوضح أن مكون واجهة المستخدم هو عنوان نافذة التطبيق، لذا أدرجنا السلسلة النصية "@title:window" قبل "Hello World". راجع دليل مبرمج Ki18n لمزيد من التفاصيل.
ثم نضبط الصفحة الأولى من رصة الصفحات لدينا. معظم تطبيقات Kirigami منظمة كرصة من الصفحات، كل صفحة تحتوي على مكونات ذات صلة مناسبة لمهمة محددة. حاليًا، نبقي الأمر بسيطًا ونلتزم بصفحة واحدة. pageStack هي رصة صفحات فارغة في البداية مقدمة من Kirigami.ApplicationWindow، وباستخدام pageStack.initialPage: Kirigami.Page {...} نضبط الصفحة الأولى المعروضة عند تحميل التطبيق على Kirigami.Page. هذه الصفحة ستحتوي على كل محتوانا.
أخيرًا، نضمن في صفحتنا Controls.Label الذي يسمح لنا بوضع نص على صفحتنا. نستخدم anchors.centerIn: parent لتوسيط التسمية أفقيًا وعموديًا داخل العنصر الأب. في هذه الحالة، المكون الأب لتسميتنا هو Kirigami.Page. آخر شيء نحتاج إلى فعله هو ضبط نصها: text: i18n("Hello World!").
org.kde.tutorial.desktop
الغرض الأساسي من ملفات إدخال سطح المكتب هو عرض تطبيقك على مشغل التطبيقات في لينكس. سبب آخر لامتلاكها هو الحصول على أيقونات النوافذ على Wayland، حيث إنها مطلوبة لإخبار المُركِّب "هذه النافذة تذهب مع هذه الأيقونة".
يجب أن يتبع نظام تسمية DNS عكسي متبوعًا بالامتداد .desktop مثل org.kde.tutorial.desktop:
| |
ملاحظة
أيقونات النوافذ وشريط المهام ستعمل في جلسة Wayland فقط إذا وُضعت ملفات سطح المكتب للتطبيقات في~/.local/share/applications أو /usr/share/applications. لجعل الأيقونات تعمل في هذا الدليل، إما انسخ ملف سطح المكتب للتطبيق هناك أو انتقل إلى جلسة تطوير كما هو موضح في دليل kde-builder. بعض تطبيقات كيدي قد تحتوي على أيقونات عاملة إذا كانت مثبتة بالفعل على النظام.CMakeLists.txt
ملفات CMakeLists.txt مطلوبة لاستخدام نظام البناء المفضل لكيدي، CMake. ملف kirigami-tutorial/CMakeLists.txt الخاص بنا سيحدد بعض خصائص تطبيقنا. كما يتضمن بعض التبعيات التي نحتاجها لتجميع مشروعنا.
| |
ملف CMakeLists.txt يحدد كيفية بناء مشاريعك. معظم المحتوى هنا هو فقط لتهيئة مشروعك. يمكنك قراءة شرح سطر بسطر ومتعمق لما يفعله ملف CMakeLists هذا هنا.
أهم شيء يجب تذكره هو أن تبعيات بناء C++ لـ Qt وأطر كيدي تُدار باستخدام find_package() وتبعيات وقت تشغيل QML تُدار باستخدام ecm_find_qml_module(). ستحتاج إلى تعديل هذه الأسطر وتضمين أي مكونات إضافية تقرر استخدامها أثناء تطوير تطبيقك.
السطر الذي يحتوي على add_subdirectory(src) يوجه CMake إلى الدليل kirigami-tutorial/src/، حيث توجد شيفرتنا المصدرية.
يخبر السطر الذي يحتوي على install() CMake أين يُثبّت ملف سطح المكتب.
لنتعمق في ملف kirigami-tutorial/src/CMakeLists.txt الموجود هناك.
| |
يتألف هذا الملف من خمس خطوات:
- أنشئ ملفًا تنفيذيًا
- حوِّل الملف التنفيذي إلى وحدة QML تقبل ملفات QML
- أضف ملفات C++ وQML إلى الملف التنفيذي
- اربط المكتبات اللازمة لتشغيل الملف التنفيذي
- ثبِّت الملف التنفيذي في المكان الصحيح
في المرة القادمة التي تحتاج فيها إلى إضافة المزيد من ملفات QML، أضفها إلى استدعاء ecm_target_qml_sources() الموجود. يمكن إضافة ملفات C++ التي تستخدم الكلمة المفتاحية QML_ELEMENT والتي سنراها لاحقًا في الدليل باستخدام target_sources().
والآن بعد أن عُولج أمر CMake، دعنا ننظر إلى الملفات التي سنقضي معظم وقتنا في العمل بها.
main.cpp
يتولى الملف kirigami-tutorial/src/main.cpp معالجة "منطق الأعمال" لتطبيقنا. C++ مفيدة لأنها مرنة وسريعة، حتى وإن كانت أكثر تعقيدًا من لغات البرمجة الأخرى.
وتعمل أيضًا كنقطة دخول إلى تطبيقنا. يُعد الجزآن من مشروعنا، الواجهة الخلفية وواجهة المستخدم، ويُبدآن هنا.
| |
في الوقت الحالي، لا نحتاج إلى الخوض في تفاصيل كثيرة حول ما يفعله كود main.cpp الخاص بنا، لكن دوره سيزداد أهمية بشكل ملحوظ بمجرد أن نقرر إضافة وظائف أكثر تعقيدًا إلى تطبيقنا في المستقبل.
تطبيق السمة على ويندوز
انقر هنا لقراءة المزيد
يحتاج التطبيق إلى ضبط سمة الأيقونات ونمط QStyle ونمط عناصر تحكم QtQuick على Breeze ليظهر على ويندوز. لمعرفة المزيد عن ذلك، انظر فهم main.cpp.
إذا أردت التقدم، يمكنك قراءة المزيد عن كيفية عمل هذا main.cpp في فهم main.cpp.
إذا أردت رؤية بعض الطرق لتحسين كود C++، مثل استخدام KAboutData لبيانات تعريف التطبيق القابلة للترجمة، فتأكد من الاطلاع على دليل KXmlGui.
في الوقت الحالي، الجزء الذي يهمنا هو هذا السطر:
engine.loadFromModule("org.kde.tutorial", "Main");الوسيط الأول هو URI المُضبَط في kirigami-tutorial/src/CMakeLists.txt، والوسيط الثاني هو اسم وحدة QML التي نريد استخدامها (Main، آتٍ من اسم ملف Main.qml الخاص بنا، والذي يجب أن يبدأ بحرف كبير).
الطريقة القديمة
قد تصادف هذه الطريقة البديلة لتحميل ملفات QML في الكود الحقيقي!
كانت الطريقة القديمة لتحميل ملفات QML تعاني من بعض العيوب، وبعد Qt6 أصبحت مطولة بشكل مفرط:
engine.load(QUrl(QStringLiteral("qrc:/qt/qml/org/kde/tutorial/qml/Main.qml")));يتبع URI مورد Qt أعلاه النمط <resource_prefix><import_URI><optional_QML_dir><file>. في هذه الحالة:
- بادئة المورد = / الافتراضي في Qt5، /qt/qml في Qt6
- URI الاستيراد = /org/kde/tutorial، والذي يطابق URI org.kde.tutorial
- دليل QML الاختياري = /qml، ضروري إذا خُزنت ملفات QML في دليل يُسمى qml/
- الملف = ملف QML
ترجمة التطبيق وتثبيته
نحن على وشك الوصول إلى خط النهاية. آخر شيء نحتاج إلى فعله هو بناء تطبيقنا وتشغيله. سيعتمد فعل ذلك على المنصة التي تستخدمها.
لينكس أو فري بي إس دي
الترجمة باستخدام kde-builder
تأكد من اتباع التعليمات في استخدام kde-builder.
اربط تبعيات البناء الضرورية باستخدام kde-builder، ثم اربط kirigami-tutorial بتشغيل الأوامر التالية في طرفية:
kde-builder kirigami ki18n kcoreaddons breeze kiconthemes qqc2-desktop-style
kde-builder kirigami-tutorialالربط يدويًا
غيّر الأدلة إلى المجلد الجذري للمشروع، ثم شغّل الأمر التالي في طرفية:
cmake -B build/ --install-prefix ~/.local
cmake --build build/
cmake --install build/سيُثبّت البرنامج في ~/.local/bin ومدخل سطح المكتب في ~/.local/share/applications.
ويندوز
إذا كنت تربط مشروعك على ويندوز بعد إعداد Craft، فيجب على CMake أن يكشف المصرّف الصحيح آليًا:
cmake -B build/
cmake --build build/
cmake --install build/اعتمادًا على كيفية تثبيتك للمصرّف، قد تحتاج إلى تحديد مولد CMake للخطوة الأولى، اعتمادًا على ما إذا كنت تستخدم Visual Studio (msvc) أو MinGW (make) لربط مشاريعك.
إذا كان Visual Studio، اعتمادًا على المصرّف الذي اخترت تثبيته، فقد يكون:
cmake -B build/ -G "Visual Studio 16 2019"أو:
cmake -B build/ -G "Visual Studio 17 2022"إذا كان MinGW:
cmake -B build/ -G "MinGW Makefiles"
cmake --build build/
cmake --install build/في كلتا الحالتين، سيُثبّت البرنامج في C:\CraftRoot\bin.
إذا شككت يومًا في اسم المصرّف الذي يجب استخدامه في استدعاء cmake، فشغّل:
cmake -Gسيسرد جميع المولدات المتاحة.
تشغيل التطبيق
يمكنك بعد ذلك تشغيل برنامج kirigami-hello بـ:
kirigami-hello # على لينكس، يدويًا
kde-builder --run kirigami-hello # باستخدام kde-builder
kdesrc-build --run --exec kirigami-hello kirigami-tutorial # باستخدام kdesrc-build
kirigami-hello.exe # على ويندوزهكذا! الآن سترى أول تطبيق Kirigami لك يظهر أمام عينيك.

لتشغيل تطبيق QML الجديد في وضع الجوال، يمكنك استخدام QT_QUICK_CONTROLS_MOBILE=1:
QT_QUICK_CONTROLS_MOBILE=1 kirigami-helloإذا ربطت المشروع يدويًا باستخدام CMake ولسبب ما أردت إلغاء تثبيت المشروع، يمكنك تشغيل:
cmake --build build/ --target uninstallملاحظة
في المرة القادمة التي تريد فيها إنشاء الملفات والمجلدات اللازمة، يمكنك استخدام KAppTemplate أو KDevelop لإنشاء مشروع مناسب للبدء منه آليًا. وهما متاحان من مستودعات كل توزيعة رئيسية. ستُنشئ هذه التطبيقات أيضًا ملفات تحتوي على بيانات وصفية لـ AppStream وملف .desktop يحتوي على معلومات حول كيفية عرض التطبيق في مشغل تطبيقات لينكس.
بفضل سحر CMakeLists، يمكنك أيضًا استخدام بيئات تطوير متكاملة مثل KDevelop أو QtCreator لتطوير هذا التطبيق ضمن بيئة مريحة بأقل جهد.