title | author | description | keywords |
---|---|---|---|
Composition Visual Extensions |
nmetulev |
The Composition Visual Attached Properties Extension allow Composition Visual Properties to be modified directly in XAML |
windows 10, uwp, windows community toolkit, uwp community toolkit, uwp toolkit, Visual, composition, xaml, attached property |
The VisualExtensions
type allows developers to modify common properties of the Visual
object of an element directly in XAML.
Platform APIs:
VisualExtensions
Here is an example of how the VisualExtensions
type can be used to directly set values for some Visual
properties for a given UI element directly from XAML:
<Page ...
xmlns:ui="using:Microsoft.Toolkit.Uwp.UI">
<Border
Height="100"
Width="100"
Background="Purple"
ui:VisualExtensions.CenterPoint="50,50,0"
ui:VisualExtensions.Opacity="0.5"
ui:VisualExtensions.RotationAngleInDegrees="80"
ui:VisualExtensions.Scale="2, 0.5, 1"
ui:VisualExtensions.NormalizedCenterPoint="0.5, 0.5" />
Note
The NormalizedCenterPoint
will also use a Composition Expression animation behind the scenes to ensure the center point value being set is kept in sync with the size of the associated Visual
object. As with all composition animations, this animation runs on the compositor thread and doesn't add any load to the UI thread of the application.
You can find more examples in the unit tests.