How can I create a Custom Control to be used in WinUI 3?

It must respond to mouse events (click, hoovering, dragging, double click)

Drawing with GDI commands (not User Control)

How can I create a Custom Control to be used in WinUI 3?

It must respond to mouse events (click, hoovering, dragging, double click)

Drawing with GDI commands (not User Control)

• c#
• winui-3
• winui

• Can you be more specific about what you mean by "Drawing with GDI commands (not User Control)"? – Andrew KeepCoding Commented Nov 19, 2024 at 2:57
• Using the Graphic commands like: DrawString, DrawPath, DrawLine instead of gluing other controls – user3765739 Commented Nov 19, 2024 at 18:18
• About create a custom control in winui3, I suggest you could refer to the Doc: Build XAML controls with C# – Jeaninez - MSFT Commented Nov 20, 2024 at 2:08
• @Jeaninez-MSFT, 20 years ago I followed a walkthrough from MSFT to authoring customs controls for Windows Forms. It was well documented including graphics, event overloading, packing and testing. That walkthrough was enough to create my first custom control and still is running. Now I need to update it to WinUI3, but I can't find that kind of documentation. – user3765739 Commented Nov 21, 2024 at 0:32
• If you want to use the winui3 custom control in Windows App SDK app? If so , you could create a a C# component with WinUI 3 custom control, and then consume it from a C++ Windows App SDK app. Refer to the Doc:learn.microsoft/en-us/windows/apps/develop/platform/… – Jeaninez - MSFT Commented Nov 21, 2024 at 6:34

1 Answer 1

You can create a user control, which can handle mouse events, and instead of using GDI commands you can use Win2d in it.

For example:

<UserControl
  xmlns:win2d="using:Microsoft.Graphics.Canvas.UI.Xaml" ...>
  <win2d:CanvasControl Draw="CanvasControl_Draw" />
</UserControl>

private void CanvasControl_Draw(CanvasControl sender, CanvasDrawEventArgs args)
{
    args.DrawingSession.DrawText("Hi!", 300, 300, Colors.SkyBlue);
}