Bagikan melalui

Nav menguasai

  • Artikel

kontrol yang digunakan untuk memberikan navigasi.

Catatan

Dokumentasi lengkap dan kode sumber yang ditemukan di repositori komponen kode GitHub.

Kontrol navigasi.

Description

Panel navigasi (Nav) menyediakan tautan ke area utama aplikasi atau situs.

Komponen kode Nav memungkinkan menggunakan komponen menu Fluent UI Nav dari aplikasi kanvas dalam dan halaman kustom.

Catatan

Kode sumber komponen dan informasi lainnya ada di repository komponen kode GitHub.

Properti

Properti kunci

Properti Description
Selected key Kunci untuk dipilih. Pembaruan ini akan dilakukan melalui aktivitas OnChange saat pengguna berinteraksi dengan kontrol.
Items Harus diisi. Tabel sumber data item untuk ditampilkan.
Fields Harus diisi. Bidang yang tercakup dari himpunan data.

Items Properti

Setiap item menggunakan skema berikut untuk visualisasi data dalam komponen.

Nama Description
ItemDisplayName Nama Tampilan item command/tab/menu
ItemKey Kunci untuk digunakan guna menunjukkan item mana yang dipilih, dan kapan menambahkan sub-item. Kunci harus unik.
ItemEnabled Diatur ke false jika pilihan dinonaktifkan
ItemVisible Diatur ke false jika pilihan tidak terlihat
ItemIconName Ikon Fluent UI untuk digunakan (lihat Ikon Fluent UI)
ItemIconColor Warna untuk merender ikon (contoh: bernama, nilai rgb atau digit)
ItemIconOnly Jangan tampilkan label teks - hanya ikon
ItemParentKey Render pilihan sebagai item anak dari pilihan lain
ItemExpanded Diatur ke salah atau benar jika grup harus tetap diciutkan atau diperluas masing-masing.

Contoh:

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"
  }
)

Properti gaya

Properti Description
Theme Menerima string JSON yang dihasilkan menggunakan Desainer Tema Fluent UI (windows.net). Membiarkan ini kosong akan menggunakan tema default yang didefinisikan oleh Power Apps. Untuk panduan tentang cara mengkonfigurasi, lihat tema.
AccessibilityLabel Aria-label pembaca layar
CollapseByDefault Diatur True atau False(On atau Off) untuk semua grup Nav harus tetap diciutkan atau diperluas masing-masing. Properti perluasan tingkat Item individual diperhitungkan.

Properti aktivitas

Properti Description
InputEvent Aktivitas untuk dikirim ke kontrol. Misalnya SetFocus. Lihat di bawah.

Perilaku

Mendukung SetFocus sebagai InputEvent.

Mengkonfigurasi perilaku "On Select"

Gunakan rumus Switch() di properti OnSelect komponen untuk mengkonfigurasi tindakan tertentu untuk tiap item dengan mengacu pada kontrol ItemKey yang dipilih sebagai nilai switch.

Ganti nilai false dengan ekspresi yang sesuai dalam bahasa 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
  )

Menetapkan Fokus pada kontrol

Saat dialog baru ditampilkan dan fokus default seharusnya ada pada kontrol, fokus eksplisit yang diatur akan diperlukan.

Untuk melakukan panggilan ke aktivitas input, Anda dapat mengatur variabel konteks yang terikat ke properti Aktivitas Input ke string yang dimulai dengan SetFocus dan diikuti oleh elemen acak untuk memastikan aplikasi mendeteksinya sebagai perubahan.

Misalnya

UpdateContext({ctxResizableTextareaEvent:"SetFocus" & Text(Rand())}));

Selanjutnya, variabel konteks ctxResizableTextareaEvent akan diikat ke properti Input Event dari properti.

Pembatasan

Komponen kode ini hanya dapat digunakan pada aplikasi kanvas dan halaman kustom.