شعاع گوشه

با شروع نسخه 2. 2 کتابخانه UI ویندوز (WinUI)، سبک پیش فرض بسیاری از کنترل ها برای استفاده از گوشه های گرد به روز شده است. این سبک‌های جدید برای برانگیختن گرما و اعتماد طراحی شده‌اند و پردازش بصری رابط کاربری را برای کاربران آسان‌تر می‌کنند.

در اینجا دو دکمه کنترل وجود دارد، اولی بدون گوشه های گرد و دومی از سبک گوشه گرد استفاده می کند.

WinUI سبک های به روز شده را برای کنترل های WinUI و پلتفرم در اختیار شما قرار می دهد. برای جزئیات در مورد نحوه سفارشی کردن گوشه های گرد، گزینه های سفارشی سازی را ببینید.

برخی از کنترل ها هم در پلتفرم (Windows. UI. Xaml. Controls) و هم در WinUI (Microsoft. UI. Xaml. Controls) در دسترس هستند. به عنوان مثال، TreeView یا ColorPicker. هنگامی که از WinUI در برنامه خود استفاده می کنید، باید از نسخه WinUI کنترل استفاده کنید. گرد کردن گوشه ممکن است در نسخه پلتفرم هنگام استفاده با WinUI به طور متناقض اعمال شود.

طرح های کنترل پیش فرض

سه قسمت از کنترل‌ها وجود دارد که در آن از سبک‌های گوشه گرد استفاده می‌شود: عناصر مستطیلی، عناصر فلایوت و عناصر نوار.

گوشه های عناصر رابط کاربری مستطیل

• این عناصر رابط کاربری شامل کنترل‌های اساسی مانند دکمه‌هایی هستند که کاربران همیشه روی صفحه می‌بینند.
• مقدار شعاع پیش‌فرض ما برای این عناصر رابط کاربری 4px است.

کنترل ها

• جعبه پیشنهاد خودکار
• دکمه ها
  • دکمه های ContentDialog
  • چک باکس های انتخاب چندگانه TreeView، GridView و ListView
  • AutoSuggestBox، ComboBox، DatePicker، MenuBar، NavigationView، TimePicker، لیست TreeView

  گوشه‌های Flyout و روکش عناصر UI

  • اینها می‌توانند عناصر رابط کاربری گذرا باشند که به طور موقت روی صفحه ظاهر می‌شوند، مانند MenuFlyout، یا عناصری که روی دیگر رابط‌های کاربری قرار می‌گیرند، مانند برگه‌های TabView.
  • مقدار شعاع پیش‌فرض ما برای این عناصر رابط کاربری 8 پیکسل است.

  

  کنترل ها

  • CommandBarFlyout
  • ContentDialog
  • پرواز
  • MenuFlyout
  • برگه های TabView
  • نکته آموزشی
  • نکته ابزار (به دلیل اندازه کوچک از شعاع 4 پیکسل استفاده می کند)
  • قسمت Flyout (در حالت باز)
    • جعبه پیشنهاد خودکار
    • CalendarDatePicker
    • جعبه ترکیبی
    • DatePicker
    • دکمه کشویی
    • کنترل جوهر
    • نوار منو
    • NumberBox
    • SplitButton
    • TimePicker
    • ToggleSplitButton

    عناصر نوار

    • این عناصر رابط کاربری مانند میله ها یا خطوط هستند. به عنوان مثال، ProgressBar.
    • مقادیر شعاع پیش‌فرض ما در اینجا 4 پیکسل هستند.

    

    کنترل ها

    • نشانگر انتخاب NavigationView
    • نوار پیشرفت
    • نوارچرخ
    • لغزنده
      • لغزنده رنگ ColorPicker
      • MediaTransportControls نوار لغزنده را جستجو می کند

      گزینه های سفارشی سازی

      مقادیر پیش فرض Corner Radii که ما ارائه می دهیم به صورت سنگ تنظیم نشده است و چند روش وجود دارد که می توانید به راحتی میزان گرد در گوشه ها را اصلاح کنید. این کار می تواند بسته به سطح دانه بندی سفارشی سازی مورد نظر شما از طریق دو منبع جهانی یا از طریق خاصیت Cornerradius به طور مستقیم بر روی کنترل انجام شود.

      چه موقع گرد نیست

      مواردی وجود دارد که گوشه کنترل نباید گرد شود و ما به طور پیش فرض اینها را دور نمی کنیم.

      • هنگامی که چندین عنصر UI که در داخل یک ظرف قرار دارند ، یکدیگر را لمس می کنند ، مانند دو قسمت از یک اسپلیتون. هنگام تماس با آنها هیچ فضایی وجود ندارد.
      • هنگامی که یک عنصر UI Flyout به UI متصل می شود که از یک طرف پرواز را فراخوانی می کند.

      

      تغییر صفحه یا برنامه در سطح برنامه

      2 منبع برنامه وجود دارد که شعاع گوشه ای از همه کنترل ها را کنترل می کند:

      • ControlCornerRadius - پیش فرض 4px است.
      • OverlayCornerRadius - پیش فرض 8px است.

      اگر ارزش این منابع را در هر محدوده نادیده بگیرید ، بر این اساس تمام کنترل های موجود در آن دامنه را تحت تأثیر قرار می دهد.

      این بدان معناست که اگر می خواهید گرد بودن همه کنترل ها را که در آن می تواند گردآوری شود تغییر دهید ، می توانید هر دو منبع را در سطح برنامه با مقادیر جدید کرنرادیوس مانند این تعریف کنید:

      از طرف دیگر ، اگر می خواهید دور همه کنترل ها را در یک محدوده خاص تغییر دهید ، مانند یک صفحه یا سطح کانتینر ، می توانید یک الگوی مشابه را دنبال کنید:

      منبع OverlayCornerRadius باید در سطح برنامه تعریف شود تا عملی شود.

      این امر به این دلیل است که پنجره ها و پرواز به درخت بصری صفحه وارد نمی شوند ، آنها به ریشه پنجره اضافه می شوند. سیستم وضوح منابع به درستی درخت بصری ریشه پنجره را به درخت بصری صفحه منتقل نمی کند.

      هر کنترل کرنرادیوس تغییر می کند

      در صورتی که می خواهید گردباری فقط تعداد انتخابی از کنترل ها را تغییر دهید ، می توانید ویژگی Cornerradius را به طور مستقیم در کنترل ها اصلاح کنید.

      پیش فرض	خاصیت اصلاح شده

      همه گوشه های کنترل به اصلاح شده در مورد خاصیت Cornerradius خود پاسخ نمی دهند. برای اطمینان از اینكه كنترلی كه گوشه های خود را می خواهید دور كنید ، واقعاً به ویژگی Cornerradius خود به روشی كه انتظار دارید پاسخ دهند ، ابتدا بررسی كنید كه ControlCornerRadius یا منابع جهانی OverlayCornerRadius بر كنترل مورد نظر تأثیر می گذارد. اگر این کار را نکردند ، بررسی کنید که کنترل مورد نظر شما به هیچ وجه گوشه هایی دارد. بسیاری از کنترل های ما لبه های واقعی را ارائه نمی دهند و بنابراین نمی توانند از خاصیت Cornerradius استفاده کنند.

      پایه گذاری سبک های سفارشی بر روی وینوی

      شما می توانید با مشخص کردن ویژگی صحیح مبتنی بر سبک خود ، سبک های سفارشی خود را بر روی سبک های گوشه ای گرد Winui پایه گذاری کنید. به عنوان مثال برای ایجاد یک سبک دکمه سفارشی بر اساس سبک دکمه Winui ، موارد زیر را انجام دهید:

      به طور کلی ، سبک های کنترل Winui از یک کنوانسیون نامگذاری مداوم پیروی می کنند: "DefaultXyzStyle" که در آن "Xyz" نام کنترل است. برای مرجع کامل ، می توانید پرونده های XAML را در مخزن Winui مرور کنید.