الرسائل المضمنة
توفر الرسائل المضمنة طريقة فورية لإشعار مستخدميك بشيء حدث أثناء استخدام التطبيق.
رسالة مضمنة أساسية
مكونات Kirigami.InlineMessage لها خاصيتان مهمتان يجب مراعاتهما:
- visible: مبدئيًا، يُضبط هذا على false، بحيث تظهر الرسالة فقط عندما تريدها صراحة. يمكن تجاوز هذا إذا رغبت بضبطه على true. عندما تُضبط رسالة مضمنة مخفية لتكون مرئية، تحصل على حركة لطيفة.
- text: هنا تضبط نص رسالتك المضمنة.
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls as Controls
import org.kde.kirigami as Kirigami
Kirigami.Page {
ColumnLayout {
Kirigami.InlineMessage {
id: inlineMessage
Layout.fillWidth: true
text: "Hello! I am a siiiiiiimple lil' inline message!"
}
Controls.Button {
text: "Show inline message!"
onClicked: inlineMessage.visible = !inlineMessage.visible
}
}
}
أنواع مختلفة
الرسائل المضمنة القياسية تشبه تلك أعلاه: لها خلفية زرقاء وأيقونة مبدئية. يمكننا تغيير ذلك بخاصية type، التي تتيح لنا ضبط رسالتنا المضمنة إلى نوع مختلف. هناك أربعة أنواع يمكننا الاختيار منها:
- معلومات (
Kirigami.MessageType.Information): المبدئي. له خلفية زرقاء، وأيقونة 'i'، ويُستخدم للإعلان عن نتيجة أو إخبار المستخدم بشيء عام. ليس من الضروري ضبطه يدويًا. - إيجابي (
Kirigami.MessageType.Positive): له خلفية خضراء، وأيقونة علامة صح، ويشير إلى أن شيئًا ما سار بشكل جيد. - تحذير (
Kirigami.MessageType.Warning): له خلفية برتقالية، وأيقونة علامة تعجب، ويمكن استخدامه لتحذير المستخدم من شيء يجب أن ينتبه إليه. - خطأ (
Kirigami.MessageType.Error): له خلفية حمراء، وأيقونة علامة X، ويمكن استخدامه لإخبار المستخدم بأن شيئًا ما قد حدث بشكل خاطئ.
ColumnLayout {
Kirigami.InlineMessage {
Layout.fillWidth: true
text: "Hello! Let me tell you something interesting!"
visible: true
}
Kirigami.InlineMessage {
Layout.fillWidth: true
text: "Hey! Let me tell you something positive!"
type: Kirigami.MessageType.Positive
visible: true
}
Kirigami.InlineMessage {
Layout.fillWidth: true
text: "Hmm... You should keep this in mind!"
type: Kirigami.MessageType.Warning
visible: true
}
Kirigami.InlineMessage {
Layout.fillWidth: true
text: "Argh!!! Something went wrong!!"
type: Kirigami.MessageType.Error
visible: true
}
}
تخصيص النص والأيقونات
تدعم الرسائل المضمنة النص المنسق، والذي يمكن تعريفه بترميز بسيط يشبه HTML. يتيح لك ذلك إضافة بعض التنسيق إلى نص رسالتك المضمنة أو حتى تضمين رابط ويب خارجي إذا أردت.
Kirigami.InlineMessage {
Layout.fillWidth: true
// لاحظ أنه عند استخدام علامات الاقتباس في سلسلة نصية، سيتعين عليك إفلاتها!
text: "Check out <a href=\"https://kde.org\">KDE's website!<a/>"
onLinkActivated: Qt.openUrlExternally(link)
visible: true
}
يمكنك أيضًا تخصيص الأيقونة التي تظهر في أعلى يسار رسالتك بتوفير اسم أيقونة نظام للخاصية icon.source. يجب أن تتوافق أسماء الأيقونات هذه مع الأيقونات المثبتة على نظامك؛ يمكنك استخدام تطبيق مثل Cuttlefish المقدم من plasma-sdk لتصفح والبحث عن الأيقونات المتوفرة على نظامك، ومعرفة أسمائها.
Kirigami.InlineMessage {
Layout.fillWidth: true
text: "Look at me! I look SPECIAL!"
icon.source: "actor"
visible: true
}
استخدام الإجراءات في الرسائل المضمنة
إذا كانت رسائلك بحاجة إلى التفاعل، يمكنك إرفاق إجراءات كيريجامي برسائلك المضمنة. كما هو الحال مع الصفحات، يمكنك فعل ذلك بضبط الخاصية InlineMessage.actions إما على Kirigami.Action أو مصفوفة تحتوي على مكونات Kirigami.Action.
ColumnLayout {
Kirigami.InlineMessage {
id: actionsMessage
Layout.fillWidth: true
visible: true
readonly property string initialText: "Something is hiding around here..."
text: initialText
actions: [
Kirigami.Action {
enabled: actionsMessage.text == actionsMessage.initialText
text: qsTr("Add text")
icon.name: "list-add"
onTriggered: {
actionsMessage.text = actionsMessage.initialText + " Peekaboo!";
}
},
Kirigami.Action {
enabled: actionsMessage.text != actionsMessage.initialText
text: qsTr("Reset text")
icon.name: "list-remove"
onTriggered: actionsMessage.text = actionsMessage.initialText
}
]
}
}
أزرار الإغلاق
توفر الرسائل المضمنة زر إغلاق يمكن استخدامه لرفضها بسهولة.
مبدئيًا، يكون زر الإغلاق هذا مخفيًا، ولكن يمكن تجاوز ذلك بضبط الخاصية showCloseButton إلى true.
Kirigami.InlineMessage {
Layout.fillWidth: true
text: "Please don't dismiss me..."
showCloseButton: true
visible: true
}