Udostępnij za pośrednictwem

Shimmer kontrola

  • Artykuł

Kontrolka używana do wyświetlania środowiska ładowania.

Uwaga

Pełna dokumentacja i kod źródłowy znajdują się w repozytorium GitHub komponentów kodu.

Formant Shimmer.

opis

Ten składnik kodu udostępnia obszar, który można przećwicić przez formant Fluent UI Shimmer, powiązany z przyciskem, który ma być używać przycisku na kanwie i na stronach niestandardowych.

Właściwości klucza

Właściwości opis
Items Elementy akcji do renderowania
Rows Elementy akcji do renderowania
SpacebetweenShimmer Spacja lub przerwa między upiększeniem w tekście wielu wierszy.

Właściwość Elementy

Każdy rekord w poniższej tabeli może mieć następujące wartości.

Właściwości opis
ItemKey Wymagane. Klucz używany do wskazania konkretnego elementu ShimmerElement. Klucze muszą być niepowtarzalne.
ItemType Wymagane. Typ elementu Shimmer z listy trzech elementów Shimmer, tj. koło, przerwa i linia.
ItemRowKey Wymagane. Klucz używany do wskazania RowKey i ustanowienia relacji.
ItemHeight Wysokość ShimmerElement
ItemWidth Szerokość ShimmerElement
ItemVerticalAlign Aby określić sposób wyrównania elementu. tj. „góra”, „środek” lub „dół”.

Przykładowa formuła Power Fx:

Table({ItemKey:"1",ItemWidth:"3.8",ItemHeight:60,ItemRowKey:"1",ItemType:"circle"},{ItemKey:"2",ItemWidth:"2",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"},{ItemKey:"3",ItemWidth:"20",ItemHeight:10,ItemRowKey:"1",ItemType:"line"},{ItemKey:"4",ItemWidth:"2",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"},{ItemKey:"5",ItemWidth:"2.8",ItemHeight:30,ItemRowKey:"1",ItemType:"line"},{ItemKey:"6",ItemWidth:"2",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"},{ItemKey:"7",ItemWidth:"20",ItemHeight:10,ItemRowKey:"1",ItemType:"line"},{ItemKey:"8",ItemWidth:"1",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"},{ItemKey:"9",ItemWidth:"3.8",ItemHeight:40,ItemRowKey:"1",ItemType:"line"},{ItemKey:"10",ItemWidth:"2",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"},{ItemKey:"11",ItemWidth:"20",ItemHeight:10,ItemRowKey:"1",ItemType:"line"},{ItemKey:"12",ItemWidth:"2",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"},{ItemKey:"13",ItemWidth:"2.8",ItemHeight:30,ItemRowKey:"1",ItemType:"line"},{ItemKey:"14",ItemWidth:"2",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"},{ItemKey:"15",ItemWidth:"20",ItemHeight:10,ItemRowKey:"1",ItemType:"line"},{ItemKey:"16",ItemWidth:"1",ItemHeight:10,ItemRowKey:"1",ItemType:"gap"})

Wiersze (rows_Items) Wartość właściwości

Każdy rekord w poniższej tabeli może mieć następujące wartości.

Właściwości opis
RowKey Wymagane. Klucz używany do wskazywania konkretnego Shimmera i podczas dodawania elementów podrzędnych. Klucze muszą być niepowtarzalne.
RowOrder Kolejność, według której Shimmer powinien renderować
RowCount Liczba renderowanych Shimmers
RowWidth Szerokość Shimmer

Przykładowa formuła Power Fx:

Table(
    {
        RowKey: "1",
        RowOrder:1,
        RowCount:5,
        RowWidth: 100
    }
)

Właściwości stylu

Właściwości opis
Theme Akceptuje ciąg JSON generowany przy użyciu Projektanta motywów interfejsu użytkownika (windows.net). Pozostawienie tego pustego będzie używać domyślnego motywu zdefiniowanego przez ustawienie Power Apps. Zobacz motywy, aby uzyskać wskazówki dotyczące konfiguracji.
AccessibilityLabel Czytnik ekranu aria-label

Przykładowy motyw

Ciąg Theme JSON jest przekazywany do właściwości komponentu, podczas gdy varTheme może służyć do stylizowania innych standardowych komponentów, takich jak przyciski, przy użyciu poszczególnych kolorów.

Aby uzyskać więcej informacji na temat palety kolorów, która ma być używana podczas pracy z Shimmer, zapoznaj się z sekcją IShimmerColors Interface w IShimmerElement.

Ograniczenia

Tego składnika kodu można używać tylko w aplikacjach kanwy i na stronach niestandardowych.