How to create a custom rendered control for XAML?


  • Hi, I am quite new to Windows store app programming. I am trying to create a mspaint like app that I can draw a image with fingers on a touch based device. I used to work on iOS. With iOS, I could do that by creating a subclass of UIView, and response to the "drawRect:" message to render the invalidated part of the control. With XAML, I didn't find a good way to do that. I noticed there's a UserControl class, but it seems can only be constructed from existing controls. An approach that may work is to create a IVirtualSurfaceImageSource, and use it as the image source of a brush. However, it looks more low level. I have to handle the rendering and user interaction in separately (Not like on iOS, everything event are handled in the single subclass of UIView). I wonder what is the most common way people deal with this kind of requirement?

    Thursday, July 24, 2014 3:07 AM


  • For your specific use see the Input: Simplified ink sample 

    Xaml uses primarily vector graphics not raster graphics, so you will build up your control's UI with vector objects. These can be other controls or shapes. For inking one would generally use a Path object.

    For raster graphics you would render into a WriteableBitmap and host that in an Image control. Another option would be to interop to Direct2D and display in a SurfaceImageSource.


    Thursday, July 24, 2014 7:19 PM