New-UDCard

Kurzbeschreibung

Erstellt eine neue Karte.

Syntax

New-UDCard [-Id <String>] [-ClassName <String>] [-Style <Hashtable>] [-Elevation <Int32>] [-Title <String>] [-TitleAlignment <String>] [-Image <String>] [-Text <String>] [-Raised] [-Sx <Object>] [-Variant <String>] [-OnClick <Endpoint>] [-RemoveMargin] [<CommonParameters>]

New-UDCard [-Id <String>] [-ClassName <String>] [-Header <Object>] [-Body <Object>] [-Expand <Object>] [-Footer <Object>] [-Media <Object>] [-Style <Hashtable>] [-Elevation <Int32>] [-Raised] [-Sx <Object>] [-Variant <String>] [-OnClick <Endpoint>] [-RemoveMargin] [<CommonParameters>]

New-UDCard [-Id <String>] [-ClassName <String>] [-Style <Hashtable>] [-Elevation <Int32>] [-Title <String>] [-TitleAlignment <String>] [-Content <ScriptBlock>] [-Image <String>] [-Raised] [-Avatar <Object>] [-Sx <Object>] [-Variant <String>] [-OnClick <Endpoint>] [-RemoveMargin] [<CommonParameters>]

Beschreibung

Erstellt eine neue Karte. Karten werden verwendet, um zusammengehörige Inhalte anzuzeigen.

Parameter

-Id

Die ID der Komponente. Standardmäßig eine zufällige GUID.

Required?                    false
Position?                    named
Default value                ([Guid]::NewGuid()).ToString()
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-ClassName

Eine CSS-Klasse, die dieser Karte zugewiesen wird.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Header

Die Kopfzeile für diese Karte. Die Kopfzeile enthält typischerweise einen Titel für die Karte. Verwenden Sie New-UDCardHeader, um eine Kopfzeile zu erstellen.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Body

Der Textkörper für diese Karte. Dies ist der Hauptinhalt der Karte. Verwenden Sie New-UDCardHeader, um einen Textkörper zu erstellen.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Expand

Der Erweiterungsinhalt für diese Karte. Der Erweiterungsinhalt wird angezeigt, wenn der Benutzer auf die Erweiterungsschaltfläche klickt. Verwenden Sie New-UDCardExpand, um eine Erweiterung zu erstellen.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Footer

Die Fußzeile für diese Karte. Fußzeileninhalte enthalten typischerweise Aktionen, die für die Karte relevant sind. Verwenden Sie New-UDCardFooter, um eine Fußzeile zu erstellen.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Media

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Style

Stile, die auf die Karte angewendet werden.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Elevation

Der Grad der Erhebung für die Karte. Je höher die Erhebung, desto mehr erscheint es, als würde die Karte über der Seite schweben.

Required?                    false
Position?                    named
Default value                0
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Title

Ein Titel für die Karte.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-TitleAlignment

Die Ausrichtung des Titels.

Required?                    false
Position?                    named
Default value                left
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Content

Der Inhalt der Karte.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Image

Ein Bild, das in der Karte angezeigt wird.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Text

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Raised

Required?                    false
Position?                    named
Default value                False
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Avatar

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Sx

Themenbasierter Stil, der auf die Karte angewendet wird.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Variant

Required?                    false
Position?                    named
Default value                elevation
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-OnClick

Die Aktion, die ausgeführt wird, wenn auf die Karte geklickt wird.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-RemoveMargin

Required?                    false
Position?                    named
Default value                False
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

Allgemeine Parameter

Dieses Cmdlet unterstützt die allgemeinen Parameter: Verbose, Debug, ErrorAction, ErrorVariable, WarningAction, WarningVariable, OutBuffer, PipelineVariable und OutVariable. Weitere Informationen finden Sie unter about_CommonParameters.

Ausgaben

Beispiele

Beispiel 1: Einfache Karte

New-UDCard -Title 'My Card' -Text 'This is my card' -Id 'card1'

Eine einfache Karte mit einem Titel und Text.

Beispiel 2: Karte mit Bild

New-UDCard -Title 'My Card' -Text 'This is my card' -Id 'card2' -Image 'https://picsum.photos/200/300' -Style @{ width = '200px' }

Eine Karte mit einem Bild.

Beispiel 3: Karte mit Erhebung

New-UDCard -Title 'My Card' -Text 'This is my card' -Id 'card3' -Elevation 10

Eine Karte mit einer höheren Erhebung.

Beispiel 4: Titelausrichtung

New-UDCard -Title 'My Card' -Text 'This is my card' -Id 'card4' -TitleAlignment center

Eine Karte mit einem zentrierten Titel.

Beispiel 5: OnClick

New-UDCard -Text 'This is my card' -OnClick {
    Show-UDToast -Message 'You clicked the card'
} -Id 'card5'

Eine Karte mit einem OnClick-Ereignishandler.

Beispiel 6: Komplexe Karte

$Header = New-UDCardHeader -Avatar (New-UDAvatar -Content { "R" } -Sx @{ backgroundColor = "#f44336" }) -Action (New-UDIconButton -Icon (New-UDIcon -Icon 'EllipsisVertical')) -Title 'Shrimp and Chorizo Paella' -SubHeader 'September 14, 2016';
$Media = New-UDCardMedia -Image 'https://mui.com/static/images/cards/paella.jpg'
$Body = New-UDCardBody -Content {
    New-UDTypography -Text ' This impressive paella is a perfect party dish and a fun meal to cook together with your guests. Add 1 cup of frozen peas along with the mussels, if you like.' -Sx @{
        color = 'text.secondary'
    } -Variant body2
}
$Footer = New-UDCardFooter -Content {
    New-UDIconButton -Icon (New-UDIcon -Icon 'Heart')
    New-UDIconButton -Icon (New-UDIcon -Icon 'ShareAlt')
}
$Expand = New-UDCardExpand -Content {
    $Description = "Heat oil in a (14- to 16-inch) paella pan or a large, deep skillet over medium-high heat. Add chicken, shrimp and chorizo, and cook, stirring occasionally until lightly browned, 6 to 8 minutes. Transfer shrimp to a large plate and set aside, leaving chicken and chorizo in the pan. Add pimentón, bay leaves, garlic, tomatoes, onion, salt and pepper, and cook, stirring often until thickened and fragrant, about 10 minutes. Add saffron broth and remaining 4 1/2 cups chicken broth; bring to a boil."
    New-UDTypography -Text $Description
}
New-UDCard -Header $Header -Media $Media -Body $Body -Footer $Footer -Expand $Expand -Sx @{
    maxWidth = 345
    border   = '2px solid #f0f2f5'
} -Id 'card5'

Eine Karte mit allen Funktionen.

Beispiel 7: Dynamische Erweiterung

$Expand = New-UDCardExpand -Content { "$(Get-Random)" } -Dynamic
New-UDCard -Expand $Expand -Id 'card6'

Eine Karte mit dynamisch erweiterbarem Inhalt. Der Inhalt wird jedes Mal aktualisiert, wenn die Karte erweitert wird.