Bagikan melalui

Facepile kontrol (pratinjau)

  • Artikel

[Artikel ini adalah dokumentasi prarilis dan dapat berubah.]

Kontrol yang digunakan untuk menampilkan dan berinteraksi dengan gambar.

Catatan

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

Kontrol tumpukan wajah.

Penting

  • Ini adalah fitur pratinjau.
  • Fitur pratinjau tidak dibuat untuk penggunaan produksi dan mungkin memiliki fungsionalitas yang dibatasi. Fitur ini tersedia sebelum rilis resmi agar pelanggan bisa memperoleh akses awal dan memberikan tanggapan.

Description

Face pile (Facepile) menampilkan daftar persona. Setiap lingkaran mewakili seseorang dan berisi gambar atau inisialnya. Sering kali kontrol ini digunakan saat berbagi yang memiliki akses ke tampilan atau file tertentu, atau ketika menetapkan seseorang tugas dalam alur kerja.

Komponen kode ini menyediakan wrapper di sekitar kontrol face pile ContextualMenu yang terikat ke tombol untuk digunakan pada halaman kustom dan aplikasi kanvas.

Properti

Properti kunci

Properti Description
Items Item tindakan untuk ditampilkan. Item pertama dianggap sebagai item root.
PersonaSize Ukuran persona untuk ditampilkan di layar
OverflowButtonType Untuk memilih jenis tombol Luapan yang akan muncul dan apakah akan muncul atau tidak
MaxDisplayablePersonas Jumlah maksimum Persona untuk muncul di Facepile
Lima adalah angka default dan yang disarankan
ImageShouldFadeIn Apakah gambar harus memiliki efek Pudar saat muncul
ShowAddButton Apakah Tombol Tambah harus muncul di komponen Facepile
OverflowButtonLabel Label Aria untuk tombol Luapan
AddbuttonAriaLabel Label Aria untuk tombol Tambahkan

Items Properti

Nama Description
ItemPersonaName Nama tampilan Persona
ItemPersonaKey Kunci mengidentifikasi Item spesifik
Kunci harus unik
ItemPersonaImage Kolom Gambar tabel Dataverse berisi Gambar Persona (Gambar Profil)
ItemPersonaImageInfo Url atau Konten Base64 Gambar Persona (Gambar Profil)
ItemPersonaPresence Opsional - Untuk menentukan Kehadiran persona
IsImage Apakah gambar persona (ItemPersonaImage) adalah Kolom Gambar tabel Dataverse.
Properti ini memungkinkan komponen menampilkan gambar berdasarkan jenis (Url atau Gambar). True jika Image perlu dirujuk dari Dataverse tabel & false, jika itu adalah Url atau Base64 yang akan dirujuk dari properti ItemPersonaImageInfo
ItemPersonaClickable Apakah persona harus dapat diklik atau tidak

Rumus contoh Power Fx untuk Items (menggunakan konektor Pengguna Office 365)

Menghasilkan kumpulan Items dengan foto menggunakan konektor Pengguna Office 365

Daftar pengguna dapat berasal dari daftar sumber data, namun gambar harus diberikan ke komponen. Jika sumber data Anda tidak memiliki gambar untuk pengguna, Anda dapat menggunakan fungsi AddColumns() Power Fx untuk menambahkan atribut yang benar ke daftar dan mengambil gambar pengguna, dari daftar ID pengguna atau nama perwakilan pengguna yang dipetakan ke pengguna aktif di Anda Microsoft Entra.

Buat kumpulan yang disebut UserPersonas menggunakan konektor Pengguna Office 365, dengan mengacu pada kode sampel di bawah ini, kemudian berikan kumpulan ke properti Items kontrol.

ClearCollect(
    UserPersonas,
    AddColumns(
       // Get first 10 users who have email ID - optional
        Filter(
            Office365Users.SearchUser({top: 10}),
            Mail <> Blank()
        ),
        "ItemPersonaKey",
        Mail,
        "ItemPersonaName",
        DisplayName,
        "IsImage",
        false,
        "ItemPersonaImageInfo",
        //Get base64 image data
        Substitute(
            JSON(
                Office365Users.UserPhotoV2(Id),
                JSONFormat.IncludeBinaryData
            ),
            """",
            ""
        ),
        "ItemPersonaPresence",
        "Away",
        "ItemPersonaClickable",
        true
    )
);

Catatan

Bidang IsImage diatur ke salah karena ItemPersonaImageInfo berasal dari Url gambar. Untuk menampilkan bidang gambar Dataverse, atur bidang IsImage ke true dan gunakan ItemPersonaImage untuk meneruskan nilai gambar.

Penggunaan

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. Membiarkan ini kosong akan menggunakan tema default yang didefinisikan oleh Power Apps. Untuk panduan tentang cara mengkonfigurasi, lihat tema.
AccessibilityLabel Aria-label pembaca layar

Properti kejadian

Properti Description
InputEvent Aktivitas untuk dikirim ke kontrol. Misalnya, SetFocus:

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 ItemPersonaKey yang dipilih sebagai nilai switch.

Rumus Power Fx contoh di properti OnSelect Facepile:

  Switch( Self.EventName,
    /* Define action when persona clicked */
    "PersonaEvent", 
    Notify("Persona clicked: " & Self.Selected.ItemPersonaKey);
    ,
    
    /* Define logic when the add button clicked */
    "AddButtonEvent", 
    Notify("Add button was clicked");
    ,
  
    /* Define logic when overflow button clicked*/
    "OverFlowButtonEvent",
    Notify("Overflow button clicked");
  )

Pembatasan

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