Spinner ตัวควบคุม

ตัวควบคุมที่ใช้เพื่อสร้างประสบการณ์การโหลด

หมายเหตุ

รหัสแหล่งที่มาของส่วนประกอบและข้อมูลเพิ่มเติมใน ที่เก็บส่วนประกอบของโค้ด GitHub

Description

Spinner คือโครงร่างของวงกลมที่เคลื่อนไหวรอบๆ ตัวมันเอง เพื่อบอกให้ผู้ใช้ทราบว่าสิ่งต่างๆ กำลังดำเนินการอยู่ ซึ่งจะปรากฏขึ้นเมื่อกระบวนการไม่แน่ใจว่างานจะใช้เวลานานเท่าใด ทำให้เป็นเวอร์ชันที่ไม่แน่นอนของตัวควบคุม ProgressIndicator

Spinner สามารถแตกต่างกันในขนาด และสามารถอยู่ในแนวเดียวกับเนื้อหา หรือกึ่งกลาง Spinner มักปรากฏขึ้นหลังจากการได้เริ่มต้นหรือมีกระทำการใดๆ ซึ่งมีความละเอียดมากและโดยทั่วไปไม่ใช้พื้นที่มากนัก แต่เป็นการเปลี่ยนจากงานที่เสร็จสมบูรณ์

ส่วนประกอบของโค้ดนี้จัดเตรียมแรปเปอร์รอบตัวควบคุม Fluent UI Spinner เพื่อใช้ในพื้นที่ทำงานและหน้าแบบกำหนดเอง ดูคู่มือส่วนประกอบสำหรับแนวทางปฏิบัติที่ดีที่สุด

คุณสมบัติที่สำคัญ

คุณสมบัติ	Description
Label	ป้ายชื่อเสริมสำหรับ Spinner
SpinnerSize	ขนาดของ Spinner ที่จะแสดง ตัวเลือก: xSmall, Small, Medium, Large
SpinnerAlignment	การจัดตำแหน่งของสปินเนอร์ภายในขอบเขตการควบคุม ตัวเลือก: Left, Center, Right
LabelPosition	การวางป้ายชื่อสปินเนอร์ที่เป็นทางเลือกให้กับตำแหน่งเฉพาะ ตัวเลือก: Bottom, Top, Left, Right

คุณสมบัติ Style

คุณสมบัติ	Description
Theme	ยอมรับสตริง JSON ที่สร้างขึ้นโดยใช้ ตัวออกแบบธีม Fluent UI (windows.net) การเว้นว่างไว้จะใช้ธีมเริ่มต้นที่กำหนดโดย Power Apps ดูที่ ชุดรูปแบบ สำหรับความช่วยเหลือเกี่ยวกับวิธีกำหนดค่า
AccessibilityLabel	ป้ายชื่อ aria สำหรับโปรแกรมอ่านหน้าจอ

ตัวอย่างเช่น

แสดงสปินเนอร์เมื่อโหลด

ทำให้ตัวควบคุม Spinner มองเห็นได้เมื่อกระบวนการเริ่มต้น จากนั้นซ่อนเมื่อกระบวนการเสร็จสมบูรณ์

ใช้ตัวแปรเพื่อควบคุมการมองเห็นของสปินเนอร์ และอัปเดตค่าก่อนและหลังบล็อกรหัสของกระบวนการ

UpdateContext({ var_showLoader: true });

/* Some code ... */

UpdateContext({ var_showLoader: false });

จากนั้น ให้ตัวแปร var_showLoader เป็นค่าสำหรับคุณสมบัติ IsLoading ของสปินเนอร์

ข้อจำกัด

ส่วนประกอบโค้ดนี้ใช้ได้เฉพาะในแอปพื้นที่ทำงานและหน้าที่กำหนดเองเท่านั้น