# Applying Composition effects to XAML elements Source: https://ahmed-walid.com/applying-composition-effects-to-xaml-elements And also alpha masking XAML elements **Update** I found a [better way](#update) to achieve this than the method described in this article, I recommend using that way instead. ## **Backstory** I was exploring XAML's [Handoff Visual](https://learn.microsoft.com/uwp/api/windows.ui.xaml.hosting.elementcompositionpreview.getelementvisual) implementation and how it's created, clipped, wrapped, etc... and found out that the function responsible for creating that visual is `CUIElement::EnsureHandOffVisual` and when I looked at this function I noticed that it has a `bool createLayerVisual` parameter: Img1 So I looked at the xrefs of this function to see if and when this parameter gets used, and noticed there's a function called `CUIElement::GetHandOffLayerVisual` in the xrefs: Img2 Xl So I was curious and checked the xrefs of it, and found a very interesting function, `DirectUI::UIElementFactory::GetElementLayerVisual` Img3 Xl
Img4 Xl Stuff under the `DirectUI` namespace are usually exposed via interfaces, and that was the case here too! Xrefs showed that it's exposed through the `Windows::UI::Xaml::IUIElementStaticsPrivate` interface: Img5 Xl I was curious when this was introduced since I have never seen it before, and after checking multiple **Windows.UI.Xaml.dll** versions, it turns out that it was introduced in **Windows 11 Build 22000**. `LayerVisual` is a visual type that allows you to apply effects and attach shadows to its child visuals. ## **Experimentation** Now that we have the interface and the function signature, the only thing missing is the interface **IID**, checking the `UIElementFactory` constructor reveals that the interface is stored at offset **0x50** of the factory class object: Img6 Xl And if we look at the `QueryInterface` implementation, we can see that it wraps/calls another `QueryInterface` function but with a pointer to the object at offset **0x10** passed as a `this` parameter: Img7 Xl This means that we are looking for the **IID** of object returned at offset **0x40** ( **0x50 - 0x10** ) in that wrapped  `QueryInterface` function. If we look at that function we see that IDA mistyped the `this` parameter and also wasn't able to detect that it's the `this` parameter and showed it as a regular register variable: Img8 Xl To fix this mess, we will simply change the type of this variable to `void*`, this way we can see the offsets more clearly, and here we go, we found our **IID**! Img9 Xl We are using **UWP .NET 9** for this experiment so we have to use **Source Generated COM** to declare this interface definition (technically we can use a projection project or handroll the interface projection codegen too but this is simpler, well, *kinda*) ```csharp theme={null} [GeneratedComInterface] [InterfaceType(ComInterfaceType.InterfaceIsIUnknown)] [Guid("7cc8cb07-5a0d-46bb-8c54-9beafe63b476")] internal unsafe partial interface IUIElementStaticsPrivate { // IInspectable methods void GetIids(); void GetRuntimeClassName(); void GetTrustLevel(); // IUIElementStaticsPrivate methods void add_PopupOpening(); void remove_PopupOpening(); void add_PopupPlacement(); void remove_PopupPlacement(); void InternalGetIsEnabled(); void InternalPutIsEnabled(); void GetRasterizationScale(); void PutRasterizationScale(); void PutPopupRootLightDismissBounds(); void EnablePopupZIndexSorting(); void* GetElementLayerVisual(void* pElement); } ``` Now we only need to write some test code and see if it works ```jsx theme={null}