Control Shimmer

Control utilitzat per mostrar una experiència de càrrega.

Nota

Trobareu la documentació completa i el codi font al dipòsit de components de codi de GitHub.

Descripció

Aquest component de codi proporciona un embolcall al voltant del control Fluent UI Shimmer lligat a un botó per utilitzar-lo en llenços i pàgines personalitzades.

Propietats de la clau

Propietat	Descripció
Items	Els elements d'acció que s'han de representar
Rows	Els elements d'acció que s'han de representar
SpacebetweenShimmer	Espai o espai entre cada brillantor en cas de diverses files.

Propietats dels elements

Cada registre de la taula de sota conté els valors següents.

Propietat	Descripció
ItemKey	Obligatori. La clau que s'utilitzarà per indicar un ShimmerElement específic. Les claus han de ser úniques.
ItemType	Obligatori. El tipus d'element Shimmer de la llista de tres elements brillants, és a dir, cercle, buit i línia.
ItemRowKey	Obligatori. La clau que s'utilitza per indicar el RowKey i establir una relació.
ItemHeight	Alçada de ShimmerElement
ItemWidth	Amplada de ShimmerElement
ItemVerticalAlign	Per especificar com s'ha d'alinear l'element. És a dir, 'superior', 'centre' o 'inferior'.

Fórmula del Power Fx d'exemple:

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

Valor de propietat de les files (rows_Items)

Cada registre de la taula de sota conté els valors següents.

Propietat	Descripció
RowKey	Obligatori. La clau que s'utilitza per indicar un Shimmer específic, i quan s'afegeixen subelements. Les claus han de ser úniques.
RowOrder	Ordre segons el qual el Shimmer s'hauria de representar
RowCount	Nombre de Shimmer que es representarà
RowWidth	Amplada del Shimmer

Fórmula del Power Fx d'exemple:

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

Propietats d'estil

Propietat	Descripció
Theme	Accepta una cadena JSON generada mitjançant el Fluent UI Theme Designer (windows.net). Deixant aquest camp en blanc s'utilitzarà el tema per defecte definit per Power Apps. Per obtenir ajuda sobre com s'ha de configurar, vegeu temes.
AccessibilityLabel	Etiqueta aria de lector de pantalla

Tema d'exemple

La cadena JSON de tema es passa a la propietat del component, mentre que varTheme es pot utilitzar per donar estil a altres components estàndard, com ara botons amb colors individuals.

Per obtenir més informació sobre la paleta de colors que s'utilitzarà mentre es treballa amb Shimmer, consulteu la secció IShimmerColors Interface de la documentació de IShimmerElement.

Limitacions

Aquest codi del llenç només es pot utilitzar a les aplicacions del llenç i a les pàgines personalitzades.