Center New-UDSwitch

I am working on creating my first app and am struggling to center a New-UDSwitch position inside of a card. Currently I have only been able to center the text box and the save button. The switch itself is always left justified. Hope someone can point me in the right direction.

New-UDCard -Content {
New-UDStack -Content {
New-UDSwitch -Id ‘Automatic IP Rotation’ -Checked $connection.result.ipChangeEnabled -CheckedLabel ‘On’ -UncheckedLabel ‘Off’ -OnChange {
if ($EventData -eq $false) {
# Switch is off
Set-UDElement -Id ‘Automatic IP Rotation Textbox’ -Attributes @{disabled = $true}
Set-UDElement -Id ‘Automatic IP Rotation Textbox’ -Attributes @{value = ‘’}
Set-UDElement -Id ‘SaveButton’ -Attributes @{disabled = $true}
} elseif ($EventData -eq $true) {
# Switch is on
Set-UDElement -Id ‘Automatic IP Rotation Textbox’ -Attributes @{disabled = $false}
Set-UDElement -Id ‘SaveButton’ -Attributes @{disabled = $false}
}
}
New-UDTextbox -Id ‘Automatic IP Rotation Textbox’ -Label ‘Rotation Frequency’ -Value $textboxValue -Disabled:$textboxDisabled
New-UDCardFooter -Content {New-UDButton -Variant ‘outlined’ -Text ‘Save’ -Id ‘SaveButton’ -Disabled:$saveButtonDisabled}
} -Id ‘verticalstack’ -AlignItems ‘center’ -Direction ‘column’
} -Title ‘Automatic IP Rotation’ -Style @{
maxWidth = “300px”;
margin = “0 0”;
}

Product: PowerShell Universal
Version: 5.12

I messed with this a bit, but it looks like that the switch implementation is going to be pretty hard to center based on how the labels are implemented. If you turn of the labels, it might be easier. That said, I’ve opened an issue here: Center UDSwitch · Issue #4234 · ironmansoftware/powershell-universal · GitHub

Thank you for opening an issue tracker for me. I have worked around this issue in the interim by changing the wording of the switch positions and resizing the card.

1 Like