How a derived class of FrameworkElement creates visual children OR renders

[verelpode]

Thanks for documenting FrameworkElement. Could you please explain how a derived class of FrameworkElement (or UIElement) can create visual child elements and/or render itself? How to create visual child elements without using a control template? I do realize that the documentation says "Typically, you don't derive classes directly from FrameworkElement", but occasionally it is necessary to derive directly from FrameworkElement, thus it would be greatly appreciated if you could explain how to do this, in particular the rendering or visual children part.

I understand that one option is to derive from Control instead of FrameworkElement and then use a control template, but sometimes templates are not the right solution for a particular UI element class, therefore how can we derive directly from FrameworkElement?

For comparison, in the older WPF-Desktop, a derived class could create visual child elements by overriding the following members, but these members do not exist in UWP, therefore how is it done in UWP?

• System.Windows.FrameworkElement.VisualChildrenCount
• System.Windows.FrameworkElement.GetVisualChild(int)

Also in WPF-Desktop, a class could render itself by overriding System.Windows.UIElement.OnRender(System.Windows.Media.DrawingContext) but this method does not exist in UWP, therefore how is it done in UWP?

Thank you!

---

Document Details

⚠ Do not edit this section. It is required for docs.microsoft.com ➟ GitHub issue linking.

• ID: b3d8cb6f-3b9e-ac4d-dcf1-723fc96024ea
• Version Independent ID: bbf98ac2-07d4-7897-245d-a5ba43c9abfe
• Content: FrameworkElement Class (Windows.UI.Xaml) - UWP app developer
• Content Source: https://cpubwin.visualstudio.com/DefaultCollection/windows-uwp/_git/winrt-api-build?path=%2fwinrt-api-build%2fwindows.ui.xaml.frameworkelement.yml&version=GBlive&_a=contents
• Product: windows
• Git Login: wdg-dev-content
• Microsoft Alias: wdg-dev-content

[michael-hawker]

@MikeHillberg @codendone running into this for something I'm trying to work on (CommunityToolkit/WindowsCommunityToolkit#4104). Can you point us in the right direction?

It seems in the WinUI repo there's a Children() directive which helps with this, but not sure how that's applicable in C# as I don't see it?

    [ContentProperty(Name = nameof(Child))]
    public class ConstrainedPresenter : FrameworkElement

Examples from WinUI 2 repo:

• https://github.com/microsoft/microsoft-ui-xaml/blob/main/dev/ScrollPresenter/ScrollPresenter.cpp#L5298
• https://github.com/microsoft/microsoft-ui-xaml/blob/main/dev/Repeater/ItemsRepeaterScrollHost.cpp#L41
• https://github.com/microsoft/microsoft-ui-xaml/blob/main/dev/ParallaxView/ParallaxView.cpp#L310

It also seems like for ParallaxView the Child property is also a DependencyProperty but this isn't case for Border and Viewbox so it it just to make it easier or do those other types just not respond to hot-swapping their children the same way?

(I'm also conflicted on naming it Constrainedbox to align with Viewbox or ConstainedBox for better casing/readibility...)

[codendone]

@michael-hawker These controls derive from Panel (see DeriveFromPanelHelper_base as part of their definition) in order to have Panel's Children property.

[michael-hawker]

@codendone then why in the IDL and docs does it show it inheriting from FrameworkElement directly?

https://github.com/microsoft/microsoft-ui-xaml/blob/main/dev/ParallaxView/ParallaxView.idl#L17

As the Children property isn't exposed publicly...

Border itself doesn't inherit from a Panel right?

I guess this comment explains it a bit about hiding the implementation detail? Is this possible to achieve in C#?

If we want just a single child is there a more direct way?

[codendone]

@michael-hawker The DeriveFromPanelHelper_base makes its implementation a subclass of Panel so that it has access to the Children property. As you noted, the idl file specifies FrameworkElement as the base, and it is the idl which generates the winmd and therefore the interface that app code sees. I don't know if there is a way to achieve this in C#.

[michael-hawker]

Filed issue microsoft/microsoft-ui-xaml#5530 for tracking exposing this in the Framework for WinUI 3. Sounds like for now I should stick with ContentPresenter or switch to Panel.