skills.rest
christian289
christian289COMMUNITY
Explore all skills by this author →
GitHub

rendering-mewui-elements

Render custom graphics in MewUI controls using IGraphicsContext during OnRender.

40|5|Updated Dec 9, 2025
Search Tags:#rendering#ui-development#mewui#graphics-context#custom-controls#onrender#measure-arrange
One-click install
npx skills add https://github.com/christian289/dotnet-with-claudecode --skill rendering-mewui-elements
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: rendering-mewui-elements
Source: https://github.com/christian289/dotnet-with-claudecode/tree/main/.claude/skills/rendering-mewui-elements
Command: npx skills add https://github.com/christian289/dotnet-with-claudecode --skill rendering-mewui-elements

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides guidance and patterns for rendering high-quality custom graphics in MewUI controls by leveraging IGraphicsContext within the OnRender pipeline, including layout-aware drawing and text rendering.

Core Features & Use Cases

  • Override OnRender to draw visuals with IGraphicsContext.
  • Use MeasureContent and ArrangeContent to participate in the three-pass layout (Measure → Arrange → Render).
  • Access drawing primitives such as FillRectangle, DrawRectangle, DrawLine, DrawText, and DrawImage to compose rich visuals.
  • Support multiple graphics backends (Direct2D, GDI, OpenGL) for different platforms.
  • Use cases include custom controls, themed dashboards, and dynamic UI decorations that respond to state.

Quick Start

Create a MewUI custom control and implement OnRender to render your visuals with the provided IGraphicsContext.

Frequently Asked Questions about rendering-mewui-elements

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I render custom graphics in MewUI controls?▼

To render custom graphics in MewUI controls, override the OnRender method and use IGraphicsContext APIs to draw shapes, text, and images directly within the render pass.

How does the layout system work when building custom UI elements in .NET?▼

Custom UI elements use a three-pass layout system: MeasureContent determines size, ArrangeContent positions children, and OnRender draws visuals using IGraphicsContext.

Does MewUI support multiple graphics backends for custom control rendering?▼

MewUI supports multiple graphics backends including Direct2D, GDI, and OpenGL, allowing custom control rendering to operate across different platforms and rendering environments.

How do I manage state and clipping when drawing custom visuals?▼

Manage drawing state and clipping by calling Save and Restore on the IGraphicsContext during OnRender, ensuring visual transformations and clipping regions do not affect subsequent render passes.

What drawing primitives are available for custom UI development in MewUI?▼

MewUI provides drawing primitives such as FillRectangle, DrawRectangle, DrawLine, DrawText, and DrawImage via IGraphicsContext to compose rich custom visuals during OnRender.

Related Skills

Explore More Software Engineering Skills→
christian289christian289
40

creating-mewui-controls

Create and integrate custom interactive controls for the MewUI framework.

Community
Advanced
seantempestaseantempesta
1

ui-live-tiles

Render persistent interactive UI tiles with hiccup components and data aggregation.

Community
Advanced
truongnattruongnat

react-native-styling

Design React Native component styles with StyleSheet, Flexbox, and platform-aware overrides.

Community
Intermediate
tann200tann200

canvas

Create and manipulate visual elements on a canvas.

Community
Intermediate