معرفی
در مقاله امروز با موارد استفاده عالی Horizontal Progress Bar در PowerApps آشنا خواهیم شد. اساساً یک نوار پیشرفت برای نشان دادن پیشرفت هر کاری که در حال انجام است استفاده می شود. ما از کنترلهای PowerApps و Components برای ایجاد نوار پیشرفت افقی استفاده میکنیم.
PowerApps ایجاد کنید
ابتدا باید با استفاده از حساب مستأجر خود به PowerApps وارد شوید و با استفاده از طرح بندی رایانه لوحی، یک برنامه بوم خالی ایجاد کنید و نام برنامه خود را ارائه دهید.
کامپوننت ها را ایجاد کنید
روی منوی Insert از نوار بالای PowerApps کلیک کنید و یک جزء جدید از منوی Custom ایجاد کنید و نام آن را به "HorizontalProgressBar" تغییر دهید.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.1.png)
اکنون، کنترل گالری را در کامپوننت قرار دهید و طرح فقط عنوان را انتخاب کنید. کامپوننت را انتخاب کنید و یک ویژگی سفارشی جدید ایجاد کنید. نام ویژگی را به عنوان Items وارد کنید و نوع داده را به عنوان Table از منوی بازشو انتخاب کنید و آن را ذخیره کنید. همچنین، ویژگی WrapCount را روی CountRows (HorizontalProgressBar.Items) قرار دهید تا آیتم ها را به صورت پویا بر اساس تعداد آیتم ها نمایش دهد.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.2.png)
ویژگی Items را که در مرحله بالا ایجاد کردیم برای کامپوننت تنظیم کنید. همانطور که نوع داده را به عنوان جدول انتخاب کردیم، باید جزئیات را در جداول مانند ID، Label و اطلاعات قابل مشاهده ارائه کنیم. برای این جلسه، جداول زیر را در ویژگی Items کامپوننت ایجاد کرده ام.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.3.png)
اکنون کنترل گالری را انتخاب کرده و ویژگی Items را بر روی HorizontalProgressBar.Items قرار دهید. اطلاعات جدول کامپوننت را که در مرحله بالا تنظیم کردیم را نمایش می دهد.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.4.png)
در مرحله بعد یک آیکون دایره ای را در گالری کنترل اضافه کنید و آن را قبل از عنوان قرار دهید. همچنین آیکون چک را داخل آیکون دایره اضافه کنید. کنترل مستطیل را داخل گالری قرار دهید و رنگ پس زمینه را خاکستری کنید و تمام کنترل های گالری را جلو بیاورید و کنترل مستطیل را به عقب برگردانید.
دوباره کامپوننت را انتخاب کنید و 2 خاصیت سفارشی دیگر برای نوع داده Colors به عنوان Record و Active Step نوع داده به عنوان عدد ایجاد کنید.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.5.png)
اکنون باید ویژگی کامپوننت را برای Colors و Active Step که ایجاد کردیم تنظیم کنیم. کامپوننت را انتخاب کرده و ویژگی Colors را به صورت زیر تنظیم کنید. برای ActiveStpe، میتوانید هر شناسهای را برای مدتی مانند 1 یا 2 ارائه کنید.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.6.png)
آیکون دایره را انتخاب کرده و با استفاده از تابع ColorValue مانند شکل زیر، ویژگی Fill را تنظیم کنید.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.7.png)
باید آیکون بررسی درست و نادرست را در داخل دایره بر اساس شرط مرحله فعال نمایان کنیم. ویژگی Visible آیکون چک را به صورت زیر تنظیم کنید.
![](http://pezhvak24.ir/dl/codenevis/firstcode/article/powerapps-horizontal-progress-bar/Images/11.8.png)