C # development Wpf/silverlight animation and games series Tutorials (Game Tutorial): (36)

C # development Wpf/silverlight animation and games series Tutorials (Game Tutorial): (36) Map custom slices and export

As an important part of improving the performance of the game is the optimization of the map, as a web-based game, you can cut the map by cutting a number of pieces of the same size, according to the position of the protagonist to load on demand. To give a simple example, like a map of 20000*20000, we cut it to 400*400 pixels for a picture unit of 2500 pieces, if the game window size is 800*600, then we only need to load the protagonist as the center around 9 pieces of the picture (1200* 900 pixel) To achieve the fill, which is more than a one-time load Connaught map, and when moving on its non-stop cutting, performance is superior too much.

In this section, I'll explain how to add custom slices and export functionality to the Map editor to prepare for the next section of the game Map performance optimization.

Do you remember in the 34th section, I will map the display part is divided into three layers: barrier layer, obstacle cell edge layer and map slicing edge layer. I have mentioned in the article that using grid showgridlines to set borders for cells, although simple to use but extremely low performance. Here we can optimize it by drawing line in the edge layer of the barrier cell:

<summary>
Draw Grid Edges
</summary>
private void Setgridlines (Canvas carrier, double totalwidth, double totalheight, double singlewidth, double singleheight, Color LineColor, double dashwidth, double dashspace) {
Carrier. Children.clear ();
int sectionxnum = (int) (totalwidth/singlewidth);
int sectionynum = (int) (totalheight/singleheight);
for (int x = 1; x <= Sectionxnum + +) {
Line line = new Line () {
X1 = x * singlewidth,
X2 = x * singlewidth,
Y1 = 0,
Y2 = Totalheight,
Stroke = new SolidColorBrush (LineColor),
Strokedasharray = new Doublecollection () {dashwidth, dashspace},
};
Carrier. Children.add (line);
for (int y = 1; y <= sectionynum; y++) {
Line line = new Line () {
X1 = 0,
X2 = Totalwidth,
Y1 = y * singleheight,
Y2 = y * singleheight,
Stroke = new SolidColorBrush (LineColor),
Strokedasharray = new Doublecollection () {dashwidth, dashspace},
};
Carrier. Children.add (line);
}
}

Where line's stroke parameter is used to set the lines color (note that the Fill property has no effect on it), while the Strokedasharray parameter defines the width and spacing of the dashed part of the line. Since the map is cut into rectangular slices, we can also use this method in the function of map slice segmentation. To add a selector that can customize the slice size in the map editor, I choose to use the NumericUpDown in the WinForm Control Library, which is flexible and powerful, given the slider is not appropriate. Adding a WinForm control in WPF requires several steps:

1 Add DLL Reference: need to reference windowsformsintegrationl and System.Windows.Forms.

2 If you are using it in XAML, you need to add a definition similar to the following:

xmlns:WinFormHost　=　"clr-namespace:System.Windows.Forms.Integration;assembly=WindowsFormsIntegration"
xmlns:WinForm　=　"clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"

3 When using the form of a winformhost containing a WinForm control to add two NumericUpDown as an example, we can write this:

<WinFormHost:WindowsFormsHost　Canvas.Left="820"　Canvas.Top="170"　Height="20"　Width="101">
<WinForm:NumericUpDown　x:Name="SectionWidth"　Maximum="500"　Minimum="100"　Increment="10"　Value="300"　ValueChanged="SectionSize_ValueChanged"　/>
</WinFormHost:WindowsFormsHost>
<WinFormHost:WindowsFormsHost　Canvas.Left="820"　Canvas.Top="196"　Height="20"　Width="101">
<WinForm:NumericUpDown　x:Name="SectionHeight"　Maximum="500"　Minimum="100"　Increment="10"　Value="300"　ValueChanged="SectionSize_ValueChanged"　/>
</WinFormHost:WindowsFormsHost>

In the VS designer we can only see that they are displayed as winformhost descriptions, and only when they are at run can they see their true entity content: