Nav ควบคุม
ตัวควบคุมที่ใช้ในการนำทาง
หมายเหตุ
รหัสแหล่งที่มาของส่วนประกอบและข้อมูลเพิ่มเติมใน ที่เก็บส่วนประกอบของโค้ด GitHub
Description
บานหน้าต่างการนำทาง (Nav
) ให้ลิงก์ไปยังส่วนหลักของแอปหรือเว็บไซต์
ส่วนประกอบของโค้ด Nav
อนุญาตให้ใช้ ส่วนประกอบเมนู Fluent UI Nav
จากภายในแอปพื้นที่ทำงานและหน้าแบบกำหนดเอง
หมายเหตุ
รหัสแหล่งที่มาของส่วนประกอบและข้อมูลเพิ่มเติมใน ที่เก็บส่วนประกอบของโค้ด GitHub
คุณสมบัติ
คุณสมบัติที่สำคัญ
คุณสมบัติ | Description |
---|---|
Selected key |
คีย์ที่จะเลือก สิ่งนี้จะได้รับการอัปเดตผ่านทางเหตุการณ์ OnChange เมื่อผู้ใช้โต้ตอบกับตัวควบคุม |
Items |
จำเป็น ตารางของรายการแหล่งข้อมูลที่จะแสดงผล |
Fields |
จำเป็น ฟิลด์ที่รวมจากชุดข้อมูล |
Items
คุณสมบัติ
แต่ละรายการใช้สคีมาต่อไปนี้ เพื่อแสดงภาพข้อมูลในองค์ประกอบ
Name | Description |
---|---|
ItemDisplayName |
ชื่อที่แสดงของรายการ คำสั่ง/แท็บ/เมนู |
ItemKey |
คีย์ที่ใช้ระบุรายการที่เลือก และเมื่อเพิ่มรายการย่อย คีย์ต้องไม่ซ้ำกัน |
ItemEnabled |
ตั้งค่าเป็นเท็จ หากปิดใช้งานตัวเลือก |
ItemVisible |
ตั้งค่าเป็นเท็จ หากตัวเลือกไม่ปรากฎ |
ItemIconName |
ไอคอน Fluent UI ที่จะใช้ (ดู ไอคอน Fluent UI) |
ItemIconColor |
สีสำหรับแสดงไอคอนเป็น (เช่น ชื่อ RGB หรือค่าฐานสิบหก) |
ItemIconOnly |
อย่าแสดงป้ายข้อความ - แสดงเฉพาะไอคอนเท่านั้น |
ItemParentKey |
แสดงตัวเลือกเป็นรายการย่อยของตัวเลือกอื่น |
ItemExpanded |
ตั้งค่าเป็นเท็จหรือจริงหากกลุ่มยังคงยุบหรือขยายตามลำดับ |
ตัวอย่าง:
Table(
{
ItemKey: "1",
ItemDisplayName: "Home with Icon & Custom color",
ItemIconName: "Home",
ItemIconColor: "Green"
},
{
ItemKey: "2",
ItemDisplayName: "Documents",
ItemExpanded: true
},
{
ItemKey: "3",
ItemDisplayName: "Contents"
},
{
ItemKey: "4",
ItemDisplayName: "Item Invisible",
ItemVisible: false
},
{
ItemKey: "5",
ItemDisplayName: "Quick Reference Guide",
ItemParentKey: "3",
ItemIconName: "Document"
}
)
คุณสมบัติ Style
คุณสมบัติ | Description |
---|---|
Theme |
ยอมรับสตริง JSON ที่สร้างขึ้นโดยใช้ ตัวออกแบบธีม Fluent UI (windows.net) การเว้นว่างไว้จะใช้ธีมเริ่มต้นที่กำหนดโดย Power Apps ดูที่ ชุดรูปแบบ สำหรับความช่วยเหลือเกี่ยวกับวิธีกำหนดค่า |
AccessibilityLabel |
ป้ายชื่อ aria สำหรับโปรแกรมอ่านหน้าจอ |
CollapseByDefault |
ตั้งค่าเป็นจริง หรือ เท็จ (เปิดหรือปิด) สำหรับกลุ่มทั้งหมดของ Nav ยังคงยุบหรือขยายตามลำดับ เคารพคุณสมบัติการขยายระดับรายการแต่ละรายการ |
คุณสมบัติ Event
คุณสมบัติ | Description |
---|---|
InputEvent |
เหตุการณ์ที่ส่งตัวควบคุม เช่น SetFocus ดูด้านล่างนี้ |
พฤติกรรม
รองรับ SetFocus เป็น InputEvent
กำหนดค่าลักษณะ "เมื่อเลือก"
ใช้สูตร Switch() ในคุณสมบัติ OnSelect
ของส่วนประกอบ เพื่อกำหนดค่าการดำเนินการเฉพาะสำหรับแต่ละรายการโดยอ้างถึง ItemKey
ที่เลือกของตัวควบคุมเป็นค่าสวิตช์
แทนที่ค่า false
ที่มีนิพจน์ที่เหมาะสมในภาษา Power Fx
Switch( Self.Selected.ItemKey,
/* Action for ItemKey 1 */
"1", false,
/* Action for ItemKey 2 */
"2", false,
/* Action for ItemKey 3 */
"3", false,
/* Action for ItemKey 4 */
"4", false,
/* Action for ItemKey 5 */
"5", false,
/* Default action */
false
)
การตั้งค่าโฟกัสที่ตัวควบคุม
เมื่อมีการแสดงกล่องโต้ตอบใหม่ และโฟกัสเริ่มต้นควรอยู่บนตัวควบคุม จำเป็นต้องมีโฟกัสที่ตั้งไว้อย่างชัดเจน
ในการเรียกเหตุการณ์อินพุต คุณสามารถตั้งค่าตัวแปรบริบทที่ผูกกับคุณสมบัติเหตุการณ์อินพุตเป็นสตริงที่ขึ้นต้นด้วย SetFocus
และตามด้วยองค์ประกอบสุ่มเพื่อให้แน่ใจว่าแอปตรวจพบว่าเป็นการเปลี่ยนแปลง
เช่น
UpdateContext({ctxResizableTextareaEvent:"SetFocus" & Text(Rand())}));
ตัวแปรบริบท ctxResizableTextareaEvent
สามารถผูกมัดกับคุณสมบัติ Input Event
ได้
ข้อจำกัด
ส่วนประกอบโค้ดนี้ใช้ได้เฉพาะในแอปพื้นที่ทำงานและหน้าที่กำหนดเองเท่านั้น