Customize your rendering in WPF (2)

Customize your rendering in WPF (2)
Zhou yinhui

1. Draw a geometric chart
You may have noticed an interesting phenomenon when using WPF for development. To display a circle (elliptical) on the screen, you can use the ellipse object, as shown in the following figure. Code As shown in: < Grid >
< Ellipse Fill = "# Ffffffff" Stroke = "# Ff000000" Margin = "61,36, 100,0" Verticalalignment = "TOP" Height = "33" />
</ Grid >

Another object named ellipsegeometry can also be: < Geometrydrawing Brush = "Blue" >
< Geometrydrawing . Geometry >
< Ellipsegeometry Center = "50, 50" Radiusx = "20" Radiusy = "45"   />
</ Geometrydrawing. Geometry >
< Geometrydrawing . Pen >
< Pen Thickness = "1" Brush = "Black"   />
</ Geometrydrawing. Pen >
</ Geometrydrawing >

In this way, the ry suffix is added by the ry name, which is the ry we will discuss today.
We can find that ellipse inherits from the shape class, And ellipsegemotry inherits from the geometry class. Although we can use them to draw circles, ellipsegeometry is more lightweight than ellipse, we can use it to get better performance benefits, but ellipsegeometry does not support the WPF Layout System (layout), input, and focus. This is also the difference between shape and geometry.
We can also use the C # code to customize our painting like the traditional painting: Protected   Override   Void Onrender (drawingcontext DC)
{
Base . Onrender (DC );

Geometry Ellipse =   New Ellipsegeometry ( New Point ( 100 , 70 ), 100 , 50 );
Geometrydrawing drawing =   New Geometrydrawing (brushes. lightblue, New Pen (brushes. Green, 1 ), Ellipse );

DC. drawdrawing (drawing );
}

The effect is as follows:

Other basic geometric figures (such as rectanglegeometry and linegeometry) are similar.

2. Draw an image
The simplest way to use images is to use the image control, just as we used picturebox before, but more is to use custom methods to draw images, the imagedrawing object provides convenience for us to draw images.

  Protected   Override   Void Onrender (drawingcontext DC)
{
Base . Onrender (DC );
Bitmapimage BMP =   New Bitmapimage ( New Uri ( " Http://images.cnblogs.com/logo.gif " , Urikind. Absolute ));
Imagedrawing drawing =   New Imagedrawing (BMP, New Rect ( 10 , 10 , 326 , 43 ));
DC. drawdrawing (drawing );
}

The effect is as follows:

3. Draw text
In WPF, We can highly customize text painting. This requires understanding the glyphrundrawing class and the glyphrun object. In fact, we often use the glyphrun object when using textblock, it contains many detailed attributes of the text font. For details, see the SDK glyphrun class. < Page
Xmlns = "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"
Xmlns: x = "Http://schemas.microsoft.com/winfx/2006/xaml"
Xmlns: presentationoptions = "Http://schemas.microsoft.com/winfx/2006/xaml/presentation/options"
Xmlns: MC = "Http://schemas.openxmlformats.org/markup-compatibility/2006"
MC: ignorable = "Presentationoptions"
Margin = "20" Background = "White" >

<! -- The example shows how to use different property settings of glyphs objects. -->
< Canvas
Xmlns = "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"
Xmlns: x = "Http://schemas.microsoft.com/winfx/2006/xaml"
Background = "Powderblue"
>

< Glyphs
Fonturi = "C: \ WINDOWS \ fonts \ Arial. TTF"
Fontrenderingemsize = "36"
Stylesimulations = "Italicsimulation"
Unicodestring = "Hello world! "
Fill = "Steelblue"
Originx = "50"
Originy = "75"
/>

<! -- "Hello world! "With default kerning -->
< Glyphs
Fonturi = "C: \ WINDOWS \ fonts \ Arial. TTF"
Fontrenderingemsize = "36"
Unicodestring = "Hello world! "
Fill = "Maroon"
Originx = "50"
Originy = "150"
/>

<! -- "Hello world! "With explicit character widths for proportional font -->
< Glyphs
Fonturi = "C: \ WINDOWS \ fonts \ Arial. TTF"
Fontrenderingemsize = "36"
Unicodestring = "Hello world! "
Indices = ", 80;, 80;, 80;, 80;, 80;, 80;, 80;, 80;, 80"
Fill = "Maroon"
Originx = "50"
Originy = "225"
/>

<! -- "Hello world! "With Fixed-width font -->
< Glyphs
Fonturi = "C: \ WINDOWS \ fonts \ cour. TTF"
Fontrenderingemsize = "36"
Stylesimulations = "Boldsimulation"
Unicodestring = "Hello world! "
Fill = "Maroon"
Originx = "50"
Originy = "300"
/>

<! -- "Open File" without "fi" Ligature -->
< Glyphs
Fonturi = "C: \ WINDOWS \ fonts \ times. TTF"
Fontrenderingemsize = "36"
Stylesimulations = "Boldsimulation"
Unicodestring = "Open File"
Fill = "Slategray"
Originx = "400"
Originy = "75"
/>

<! -- "Open File" with "fi" Ligature -->
< Glyphs
Fonturi = "C: \ WINDOWS \ fonts \ times. TTF"
Fontrenderingemsize = "36"
Stylesimulations = "Boldsimulation"
Unicodestring = "Open File"
Indices = "; () 191"
Fill = "Slategray"
Originx = "400"
Originy = "150"
/>

</ Canvas >


</ Page >

In customizing your plotting in WPF (3), we will continue to discuss more in-depth topics in custom plotting: merge and draw, use the path to draw, and convert our painting into a painting brush. Thank you!