التحكم بالزر في Power Apps

عنصر تحكم يمكن للمستخدم النقر فوقه أو الضغط عليه للتفاعل مع التطبيق.

الوصف

قم بتكوين الخاصية OnSelect لعنصر تحكم الزر لتشغيل صيغة واحدة أو أكثر عندما ينقر المستخدم فوق عنصر التحكم أو يضغط عليه.

الخصائص الرئيسية

OnSelect – الإجراءات التي يجب تنفيذها عند لمس المستخدم لعنصر تحكم أو النقر فوقه.

النص – النص الذي يظهر على عنصر تحكم أو الذي يكتبه المستخدم في عنصر تحكم.

خصائص إضافية

محاذاة – موقع النص فيما يتعلق بالوسط الأفقي لعنصر التحكم الخاص به.

AutoDisableOnSelect – يعطل عنصر التحكم تلقائيا أثناء تشغيل سلوك OnSelect .

BorderColor – لون حد عنصر التحكم.

BorderStyle – سواء كان حد عنصر التحكم متصلا أو متقطعا أو منقطا أو بلا.

BorderThickness – سمك حد عنصر التحكم.

اللون – لون النص في عنصر تحكم.

ContentLanguage - لغة محتوى عنصر التحكم، إذا كانت مختلفة عن حاوية عنصر التحكم.

DisplayMode – سواء كان عنصر التحكم يسمح بإدخال المستخدم (تحرير)، أو يعرض البيانات فقط (عرض)، أو معطل (معطل).

DisabledBorderColor – لون حد عنصر التحكم إذا تم تعيين الخاصية DisplayMode لعنصر التحكم إلى معطل.

DisabledColor – لون النص في عنصر تحكم إذا تم تعيين الخاصية DisplayMode الخاصة به إلى معطل.

DisabledFill – لون خلفية عنصر التحكم إذا تم تعيين الخاصية DisplayMode الخاصة به إلى معطل.

FocusedBorderColor – لون حد عنصر التحكم عند تركيز عنصر التحكم.

FocusedBorderThickness – سمك حد عنصر التحكم عند تركيز عنصر التحكم.

تعبئة – لون خلفية عنصر تحكم.

الخط – اسم عائلة الخطوط التي يظهر النص فيها.

FontWeight – وزن النص في عنصر تحكم: غامق أو نصفي أو عادي أو أفتح.

الارتفاع – المسافة بين الحافتين العلوية والسفلية لعنصر التحكم.

HoverBorderColor – لون حد عنصر التحكم عندما يحافظ المستخدم على مؤشر الماوس على عنصر التحكم هذا.

HoverColor – لون النص في عنصر تحكم عندما يحافظ المستخدم على مؤشر الماوس عليه.

HoverFill – لون خلفية عنصر التحكم عندما يحتفظ المستخدم بم مؤشر الماوس عليه.

مائل – سواء كان النص في عنصر تحكم مائلا.

PaddingBottom – المسافة بين النص في عنصر تحكم والحافة السفلية لعنصر التحكم هذا.

PaddingLeft – المسافة بين النص في عنصر تحكم والحافة اليمنى لعنصر التحكم هذا.

PaddingRight – المسافة بين النص في عنصر تحكم والحافة اليمنى لعنصر التحكم هذا.

PaddingTop – المسافة بين النص في عنصر تحكم والحافة العلوية لعنصر التحكم هذا.

Pressed – True أثناء الضغط على عنصر تحكم، خطأ بخلاف ذلك.

PressedBorderColor – لون حد عنصر التحكم عندما يضغط المستخدم على عنصر التحكم هذا أو ينقر فوقه.

PressedColor – لون النص في عنصر تحكم عندما يضغط المستخدم على عنصر التحكم هذا أو ينقر فوقه.

PressedFill – لون خلفية عنصر التحكم عندما يضغط المستخدم على عنصر التحكم هذا أو ينقر فوقه.

RadiusBottomLeft – درجة تقريب الزاوية السفلية اليمنى لعنصر التحكم.

RadiusBottomRight – درجة تقريب الزاوية السفلية اليسرى لعنصر التحكم.

RadiusTopLeft – درجة تقريب الزاوية العلوية اليمنى لعنصر التحكم.

RadiusTopRight – درجة تقريب الزاوية العلوية اليسرى لعنصر التحكم.

الحجم – حجم خط النص الذي يظهر على عنصر تحكم.

يتوسطه خط – ما إذا كان يظهر سطر عبر النص الذي يظهر على عنصر تحكم.

TabIndex – ترتيب التنقل في لوحة المفاتيح فيما يتعلق بعناصر التحكم الأخرى.

تلميح الأدوات – نص توضيحي يظهر عندما يقوم المستخدم بالمرور فوق عنصر تحكم.

تسطير – ما إذا كان يظهر سطر أسفل النص الذي يظهر على عنصر تحكم.

VerticalAlign – موقع النص على عنصر تحكم فيما يتعلق بالوسط العمودي لعنصر التحكم هذا.

مرئي – سواء ظهر عنصر تحكم أو تم إخفاؤه.

العرض - المسافة بين الحافتين اليسرى واليمين لعنصر التحكم.

X – المسافة بين الحافة اليسرى لعنصر التحكم والحافة اليسرى للحاوية الأصل الخاصة به (شاشة إذا لم تكن هناك حاوية أصل).

Y – المسافة بين الحافة العليا لعنصر التحكم والحافة العليا للحاوية الأصل (شاشة إذا لم تكن هناك حاوية أصل).

الدالات ذات الصلة

Navigate( ScreenName, ScreenTransitionValue )

الأمثلة

إضافة صيغة أساسية إلى زر

1. أضف عنصر تحكم Text input وقم بتسميته مصدر.

   ألا تعرف كيفية إضافة عنصر تحكم وتسميه وتكوينه؟

2. إضافة عنصر تحكم الزر ، وتعيين الخاصية Text الخاصة به إلى "إضافة"، وتعيين الخاصية OnSelect إلى هذه الصيغة:
   UpdateContext({Total:Total + Value(Source.Text)})

   هل تريد الحصول على مزيد من المعلومات حول دالة UpdateContext أو دالات أخرى؟

3. أضف عنصر تحكم تسمية ، وقم بتعيين الخاصية Text الخاصة به في شريط الصيغة إلى Value(Total)، ثم اضغط F5.

4. امسح النص الافتراضي من المصدر، واكتب رقما فيه، ثم انقر فوق أو اضغط على إضافة.

   يعرض عنصر تحكم التسمية الرقم الذي كتبته.

5. امسح الرقم من المصدر، واكتب رقما آخر فيه، ثم انقر فوق أو اضغط على إضافة.

   يعرض عنصر تحكم التسمية مجموع الرقمين اللذين كتبتهما.

6. (اختياري) كرر الخطوة السابقة مرة واحدة أو أكثر.

7. للعودة إلى مساحة العمل الافتراضية، اضغط على مفتاح الخروج Esc (أو انقر فوق أيقونة الإغلاق أو اضغط عليها في الزاوية العلوية اليسرى).

تكوين زر باستخدام صيغ متعددة

إضافة صيغة تمسح عنصر تحكم إدخال النص بين الإدخالات.

1. قم بتعيين الخاصية HintTextللمصدر إلى "أدخل رقما".

2. تعيين الخاصية OnSelect ل Add to this formula:

   UpdateContext({Total:Total + Value(Source.Text)});
   UpdateContext({ClearInput: ""})

   إشعار

   فصل صيغ متعددة بفواصل منقوطة ";".

3. تعيين الخاصية الافتراضيةللمصدر إلى ClearInput.

4. اضغط على F5، ثم اختبر التطبيق عن طريق إضافة عدة أرقام معا.

إضافة زر آخر لإعادة تعيين الإجمالي

أضف زرا ثانيا لمسح الإجمالي بين العمليات الحسابية.

1. إضافة عنصر تحكم زر آخر، وتعيين الخاصية Text الخاصة به إلى "مسح"، وتعيين الخاصية OnSelect إلى هذه الصيغة:

   UpdateContext({Total:0})

2. اضغط على F5، وأضف عدة أرقام معا، ثم انقر أو اضغط على مسح لإعادة تعيين الإجمالي.

تغيير مظهر الزر

تغيير شكل الزر

بشكل افتراضي، ينشئ Power Apps عنصر تحكم زر مستطيل مع زوايا مستديرة. يمكنك إجراء تعديلات أساسية على شكل عنصر تحكم الزر عن طريق تعيين خصائص الارتفاعوالعرض ونصف القطر الخاصة به.

إشعار

توفر الأيقونات والأشكال مجموعة واسعة من التصميمات ويمكنها تنفيذ بعض الوظائف الأساسية نفسها التي تقوم بها عناصر تحكم الزر. ومع ذلك، لا تحتوي الأيقونات والأشكال على خاصية نص .

1. أضف عنصر تحكم الزر ، واضبط خصائص الارتفاعوالعرض على 300 لإنشاء زر مربع كبير.

2. تعديل خصائص RadiusTopLeft و RadiusTopRight و RadiusBottomLeft و RadiusBottomRight لضبط مقدار الانحناء في كل زاوية. فيما يلي بعض الأمثلة على الأشكال المختلفة، كل منها يبدأ من زر 300 × 300 مربع:

   • قم بتعيين كافة قيم Radius الأربعة إلى 150 لإنشاء دائرة.
   • قم بتعيين قيم RadiusTopLeft و RadiusBottomRight إلى 300 لإنشاء زر على شكل ورقة.
   • قم بتعيين قيم RadiusTopLeft و RadiusTopRight إلى 300 وقيم RadiusBottomLeft و RadiusBottomRight إلى 100 لإنشاء زر على شكل علامة تبويب.

تغيير لون الزر عند تمرير الماوس فوقه

بشكل افتراضي، سوف يعتم لون التعبئة لعنصر تحكم الزر بمقدار 20% عند تمرير الماوس فوقه بالماوس. يمكنك ضبط هذا السلوك عن طريق تغيير الخاصية HoverFill ، التي تستخدم الدالة ColorFade . إذا قمت بتعيين صيغة ColorFade إلى نسبة مئوية موجبة، يصبح اللون أخف عند تمرير الماوس فوق الزر، بينما تؤدي النسبة المئوية السالبة إلى جعل اللون أدكن.

• قم بتغيير النسبة المئوية ل ColorFade في خاصية HoverFill لأحد الأزرار التي قمت بإنشائها، ولاحظ التأثيرات.

يمكنك أيضا تحديد لون عنصر تحكم الزر عن طريق تعيين الخاصية HoverFill الخاصة به إلى صيغة تحتوي على الدالة ColorValue بدلا من الدالة ColorFade ، كما هو الحال في ColorValue("Red").

إشعار

يمكن أن تكون قيمة اللون أي تعريف لون CSS، إما اسما أو قيمة سداسية.

• استبدل الدالة ColorFade بوظيفة ColorValue في أحد الأزرار التي قمت بإنشائها، ولاحظ التأثيرات.

إرشادات إمكانية الوصول

تباين الألوان

• تنطبق متطلبات تباين الألوان القياسية.

دعم قارئ الشاشة

• يجب أن يكون النص موجودا.

دعم لوحة المفاتيح

• يجب أن يكون TabIndex صفرا أو أكبر حتى يتمكن مستخدمو لوحة المفاتيح من الانتقال إليه.
• يجب أن تكون مؤشرات التركيز مرئية بوضوح. استخدم FocusedBorderColorوFofoedBorderThickness لتحقيق ذلك.