عنصر تحكم الزر في Power Apps

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

‏‏الوصف

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

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

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

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

خصائص إضافية

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

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

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

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

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

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

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

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

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

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

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

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

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

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

FontWeight – سماكة النص في عنصر التحكم: غامق أو شبه غامق أو عادي أو فاتح.

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

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

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

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

Italic - ما إذا كان النص الموجود في عنصر التحكم مائلاً.

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

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

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

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

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

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

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

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

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

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

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

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

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

Strikethrough - ما إذا كان أي خط يظهر عبر النص الذي يظهر على عنصر تحكم.

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

Tooltip - نص تفسيري يظهر عند تمرير المستخدم للماوس فوق عنصر تحكم.

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

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

Visible – ما إذا كان عنصر التحكم ظاهرًا أم مخفيًا.‬

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

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

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

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

Navigate( ScreenName, ScreenTransitionValue )

الأمثلة

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

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

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

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

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

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

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

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

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

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

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

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

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

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

1. عيّن خاصية HintText في المصدر إلى "إدخال رقم".

2. عيّن خاصية OnSelect في إضافة إلى هذه الصيغة:

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

   ملاحظة

   استخدم الفاصلة المنقوطة للفصل بين صيغ متعددة “;”.

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

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

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

أضف زرًا آخر لمسح الإجمالي بين الحسابات.

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

   UpdateContext({Total:0})

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

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

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

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

ملاحظة

توفر الأيقونات والأشكال مجموعة واسعة من التصميمات ويمكنها تنفيذ بعض الدالات الأساسية التي تقوم بها عناصر تحكم الزر. ومع ذلك، فإن**الأيقونات والأشكال** لا تتضمن خاصية Text.

1. أضف عنصر تحكم الزر، وقم بتعيين خاصية Height وخاصية Width إلى 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 في زر أنشأته، ثم راقب التأثيرات.

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

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

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

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

• يلزم وجود Text.

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

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