Learn control templates, move, resize, and rotate from WPF Diagram Designer Part 1

As a result of last week's major project product architecture, training for new employees and other meetings, I've made some modeling tasks in Openexpressapp's initial plan for modeling support, The reference section has been introduced in previous blogs (metamodelengine: Meta model engine Development idea, DSM: using metaedit+ to write family tree modeling Language, reading notes: Visual Studio DSL Tools specific domain development guide). There's no other important thing to do today, so you can start learning about WPF's graphical designer, which is a source designer I introduced in the WPF-graphics designer (Diagram Designer), and I've seen it realize some of the basic features of the graphics designer, If you learn it first, you should be able to write your own simple designer. This series is divided into four parts, each part of the original based on the extension of some designer features, I will also be divided into four blog to organize the content from the learned, the WPF and designers interested can see.

WPF Diagram Designer:part 1

This article describes the three features of the graphical designer's mobile drag, resizing resize, and rotation rotate through WPF's control templates and thumb, with the sample code interface as follows:

Control templates

In the past, when we used the controls under window, changes the appearance through many of the properties provided by the control itself, and in WPF you find that the control does not provide too many custom properties, because WPF separates the look from the content, and the concept of a control template makes it easier to More imaginative to customize the interface we need. Templates allow us to use anything to completely replace the visual tree of an element, but other features of the control itself are not affected. The default appearance of each control in WPF is defined in the template, and you can view the WPF-template viewing tool by using this tool I used to say: Show Me the template and how to view third party topics

The control template is represented by the ControlTemplate class, which derives from the FrameworkTemplate abstract class, and its important part is its VisualTree content property, which contains a visual tree that defines the desired appearance. You can define a control template class in the following ways:

<Canvas>
　　 <Canvas.Resources>
　　　 <ControlTemplate　x:Key="DesignerItemTemplate"　TargetType="ContentControl">
　　　　　 <ContentPresenter　Content="{TemplateBinding　ContentControl.Content}"/>
　　　 </ControlTemplate>
　　 </Canvas.Resources>
　　 <ContentControl　Name="DesignerItem"
　　　　　　　　　　 Width="100"
　　　　　　　　　　 Height="100"
　　　　　　　　　　 Canvas.Top="100"
　　　　　　　　　　 Canvas.Left="100"
　　　　　　　　　　 Template="{StaticResource　DesignerItemTemplate}">
　　　 <Ellipse　Fill="Blue"/>
　　 </ContentControl>
</Canvas>

Limit target Type

ControlTemplate, like style, also has a TargetType property to limit the types that the template can be applied to, and if there is no targettype displayed, the target type is implicitly set to control. Because there is no default control template, it is different from style and is not allowed to remove x:key of templates when using TargetType.