程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> .NET實例教程 >> 用於.NET Compact Framework的強大二維圖形引擎

用於.NET Compact Framework的強大二維圖形引擎

編輯:.NET實例教程

簡介
  對於移動設備而言,.NET Compact Framework 即使不是最佳的 API,也是極好的 API。它的圖形引擎受到很大的限制,以便提高呈現速度和降低內存消耗。但是,它似乎遠遠無法滿足用戶日益增長的對更好的圖形體驗的要求。嘗試去獲得 .Net Compact Framework 中的一些高級矢量圖形呈現功能可能是一項乏味的任務。開發人員具有兩個選擇:

  1.求助於本機代碼。例如,Pocket PC Game API 可能是一項不錯的選擇。它的性能令人印象深刻。有關詳細信息,請參閱位於以下位置的一篇非常全面的文章:http://msdn.microsoft.com/mobility/samples/default.ASPx?pull=/library/en-us/dnnetcomp/Html/gmangame.ASP。問題在於本機代碼不支持矢量圖形呈現,並且與某些設備不兼容。此外,它可能無法與 Pocket PC 仿真程序協同工作。您可以想象調試這樣的程序有多麼困難。

  2.請等待下一代移動圖形引擎問世。據我所知,Windows CE 5 中將包含一個強大的 Direct3D Mobile引擎。這對於移動游戲開發人員來說是一個好消息,但是 Direct3D 不適合於二維圖形。它太復雜了,因而無法在一般應用程序中應用。

  我們所需要的是像 GDI+ 這樣強大而易於使用的二維圖形引擎。因此,我從零開始開發 XrossOne GDI+ 項目。它完全是用 C# 托管代碼編寫的,不包含任何本機代碼或不安全的代碼。經過幾個月的艱苦工作之後,我終於可以在本文開頭提供可下載的原始版本。

開始工作
  從該項目一開始,我就一直銘記 XrossOne GDI+ 引擎應當對不同的手持設備和平台保持中立。結果,它可以與 Pocket PC、Windows CE、Smartphones、Windows .Net 和 Mono 兼容。您可以將同一個運行庫復制到不同的目標,而它仍然可以正常工作。

下表概括了總體體系結構。

      層             命名空間 
  XrossOne GDI+ API       XrossOne.Drawing
  基於定點的二維圖形引擎    XrossOne.DrawingFP
 16.16 定點計算引擎       XrossOne.FixedPoint

  XrossOne GDI+ 中有三個層。最低層為“16.16 定點計算引擎”。其中一個主類 — MathFP — 是從 Beartronics J2ME 庫 改編而來的。一些函數已經進行了優化,其中包括 sqrt、atan 和 PointFP.Distancecalculation。在命名空間 XrossOne.FixedPoint 下面,有其他三個類:SingleFP、DoubleFP 和 MatrixFP。SingleFP 是一個用於 16.16 定點數的 Helper 類。它為在定點類型和標准類型(int、float、string)之間進行轉換提供了方便。MatrixFP 是為定點二維變換編寫的。因為定點計算的精度較低,所以級聯變換可能會損失一些精確性。例如,在大多數情況下,兩次求逆運算無法還原原始矩陣。DoubleFP 的存在是為了使該庫完備,但尚未使用。

  “基於定點的二維圖形引擎”是 XrossOne GDI+ 的內核。它實現了很多復雜的矢量圖形算法,例如,反鋸齒繪圖、線帽/聯接裝飾、二維變換、漸變填充、Alpha 通道合成等等。這裡可以找到本機 GDI+ 中的大多數高級功能。但是,您只應在少數情況下直接使用它,因為它的基於定點的接口對於程序員而言不夠友好,但是不必過分擔心這種情況。有一個封裝良好的 API 可供使用。您可以在 XrossOne.Drawing 命名空間中找到它們。XrossOne.Drawing 中的類非常類似於 System.Drawing 中的類,不同之處在於每個類的末尾有一個字母“X”。例如,XrossOne.Drawing.PenX 類等效於 System.Drawing.Pen。有一個用於將 GDI+ 程序轉換到 XrossOne GDI+ 的小竅門。在 using 節中,將 XrossOne GDI+ 類重命名為它們的等效類。例如:

using Pen = XrossOne.Drawing.PenX;
using LinearGradientBrush = XrossOne.Drawing. LinearGradIEntBrushX;
using Matrix = XrossOne.Drawing.MatrixX;
主要功能
反鋸齒矢量圖形繪圖

  通過 XrossOne Mobile GDI+ 可以呈現所有種類的二維幾何圖形,例如,線段、矩形、多邊形、橢圓、扇形、貝塞爾樣條曲線、基數樣條曲線等等。但是,扇形、貝塞爾樣條曲線和基數樣條曲線在 .NET Compact Framework 中不可用。此外,所有圖形在呈現時都自動進行反鋸齒處理。這有助於獲得超級平滑質量。在 .Net Compact Framework 中,畫筆的寬度被固定為 1 個像素。這一限制在 XrossOne GDI+ 中不存在。畫筆的不同大小可以應用於所有圖形的輪廓,如圖 1 所示。


圖 1. 反鋸齒矢量圖形繪圖



  代碼示例 1

//Clear the background and reset the transform state
gx.Clear(Color.White);
gx.ResetTransform();
//Draw skew grid as the background
PenX pen = new PenX(Utils.FromArgb(0x40, Color.LightGray), 5);
for (int i = -Height; i < Width + Height; i+=20)
{
gx.DrawLine(pen, i, 0, i + Height, Height);
gx.DrawLine(pen, i, 0, i - Height, Height);
}

//Draw a DarkMagenta rectangle with a 10.5-pixel pen
Color c = Utils.FromArgb(0x80, Color.DarkMagenta);
pen = new PenX(c, 10.5f);
gx.DrawRectangle(pen, 50, 20, 150, 200);

//Fill a GreenYellow rectangle
c = Utils.FromArgb(0xA0, Color.GreenYellow);
BrushX brush = new SolidBrushX(c);
gx.FillRectangle(brush, 120, 50, 90, 150);

//Draw a BlueViolet ellipse with a 10.5-pixel pen
c = Utils.FromArgb(0x80, Color.BlueViolet);
pen = new PenX(c, 10.5f);
gx.DrawEllipse(pen, 50, 20, 150, 80);

//Fill a Red ellipse
c = Utils.FromArgb(0xA0, Color.Red);
brush = new SolidBrushX(c);
gx.FillEllipse(brush, 20, 50, 80, 150);

//Draw a HotPink pIE from 156.5 degree to -280.9 degree
pen.Color = Utils.FromArgb(0xA0, Color.HotPink);
gx.DrawPIE(pen, 3.6f, 120.3f, 200.8f, 130.1f, 156.5f, -280.9f);

//Draw Orange BezIEr curves
c = Utils.FromArgb(0xA0, Color.Orange);
pen = new PenX(c, 16);
Point start = new Point(70, 100);
Point control1 = new Point(100, 10);
Point control2 = new Point(150, 50);
Point end1 = new Point(200, 200);
Point control3 = new Point(100, 150);
Point control4 = new Point(50, 200);
Point end2 = new Point(10, 150);
Point[] bezIErPoints ={start, control1, control2, end1, control3, control4, end2};
pen.EndCap = LineCapX.Round;
gx.DrawBeziers(pen, bezIErPoints);

//Refresh
Invalidate();



  XrossOne GDI+ 和本機 GDI+ 的矢量圖形輸出是相同的,但基數樣條曲線除外。我的算法取自 Jean-Yves Queinec 撰寫的文章 Smoothing Algorithm Using BezIEr Curves。因此,您可能發現在它們的輸出之間存在一些差異,如下面的圖 2 所示。 


圖 2. DrawCurve/DrawClosedCurve 的輸出



  盡管大多數矢量圖形呈現函數都已經得到實現,但仍然有一些工作需要完成。某些函數(DrawString、DrawImage、DrawPath 等等)直到下一個版本才可用。

漸變填充

  在本機 GDI+ 中有五種畫刷 — SolidBrush、LinearGradientBrush、PathGradientBrush、TextureBrush 和 HatchBrush。但是,在該版本中,只有 SolidBrush 和 LinearGradientBrush 可用。XrossOne GDI+ 支持 RadialGradientBrush 而不是 PathGradIEntBrush。下面的圖 5 演示了漸變填充。


圖 5. 漸變填充



  代碼示例 4

//Clear the background and reset the transform state
gx.Clear(Color.White);
gx.ResetTransform();

//Fill a rectangle with a black-white LinearGradIEntBrushX
Rectangle r = new Rectangle(20, 50, 300, 100);
Color c1 = Color.Black;
Color c2 = Color.White;
BrushX brush1 = new LinearGradIEntBrushX(r, c1, c2, 30F);
gx.FillRectangle(brush1, r);

//Fill a rectangle with a 7-color LinearGradIEntBrushX 
r = new Rectangle(90, 100, 150, 100);
LinearGradientBrushX br = new LinearGradIEntBrushX(r,Color.Black,Color.Black, 60F); 
ColorBlendX cb = new ColorBlendX(); 
cb.Positions=new float[7]; 
int i=0; 
for(float f=0;f<=1;f+=1.0f/6) 
cb.Positions[i++]=f; 
cb.Colors=new Color[]
{Color.Red,Color.Orange,Color.Yellow,Color.Green,Color.Blue,Color.Indigo,Color.Violet}; 
br.InterpolationColors=cb; 
gx.TranslateTransform(160, 10);
gx.RotateTransform(60F);
gx.FillRectangle(br, r);

//Fill a rectangle with a 7-color RadialGradIEntBrushX 
r.Y += 50;
RadialGradientBrushX brush2 = new RadialGradIEntBrushX(r, Color.Black,Color.Black, 220F); 
brush2.InterpolationColors = cb;
gx.RotateTransform(-45F);
gx.TranslateTransform(-200, -170);
gx.FillRectangle(brush2, r);

//Refresh
Invalidate();



Alpha 通道合成

  System.Drawing 命名空間中的 Color 結構在 .NET Framework 和 .NET Compact Framework 中都可用。區別在於 .Net Compact Framework 中禁用了 alpha 成分並且色調-飽和度-亮度 (HSB) 值不可用。幸運的是,alpha 通道合成可以完美地與 XrossOne GDI+ 協同工作(您可能已經從前面的圖形示例中推斷出這一點)。

性能
  手持 PC 的 CPU 的功能確實通常要比標准 PC 的 CPU 差很多。繁重的計算可能使手持設備的響應速度降低,從而可能使用戶變得不勝其煩。換句話說,性能對於手持設備軟件而言至關重要。因此,在重大場合下使用 XrossOne Mobile GDI+ 之前,您可能希望分析它的總體性能。因為 GDI+ 中大多數對應於 .NET Compact Framework 的等效函數都不可用,所以基准測試是針對 .Net Framework 在 XrossOne Mobile GDI+ 和 GDI+ 之間進行的。測試是在下列類別中執行的:矢量圖形呈現、二維變換和漸變填充。測試方案在相同的條件下執行。您可以在下載軟件包中找到基准測試程序,並且可以在 http://www.xrossone.com/projects.PHP?menu=4 快速查看它們的圖形輸出。 

  XrossOne Mobile GDI+ 完全是用 C# 托管代碼編寫的,它的總體性能可以接受(參見下表),盡管二維變換和漸變填充需要在以後的版本中進一步優化。

方案 XrossOne Mobile GDI+ GDI+ for .Net Framework 系統開銷

DrawLine

2.604 ms

0.901 ms

189.0%

DrawRect

3.705 ms

1.602 ms

131.3%

DrawPolygon

3.205 ms

1.502 ms

113.4%

DrawEllipse

6.409 ms

2.403 ms

166.7%

DrawBezIEr

3.505 ms

1.602 ms

118.8%

DrawCurve

4.006 ms

1.402 ms

185.7%

DrawPIE

6.810 ms

2.003 ms

240.0%

TranslateTransform

10.615 ms

3.405 ms

211.7%

ScaleTransform

4.106 ms

0.801 ms

412.6%

RotateTransform

7.811 ms

1.803 ms

333.2%

LinearGradIEnt (1)

9.013 ms

2.103 ms

328.6%

LinearGradIEnt (2)

8.012 ms

1.803 ms

344.4%


缺少的功能
  在上述部分中,我們已經演示了 XrossOne Mobile GDI+ 的一些令人興奮的功能。但是,該版本中仍然缺少一些功能: 

  • 文本輸出 

  • 光柵輸出 

  • 虛線樣式支持 

  • HatchBrush、PathGradiantBrush、TextureBrush 

  • Pen.CustomStartCap、Pen.CustomEndCap 

小結
  我們相信 XrossOne Mobile GDI+ 可以幫助 .Net Compact Framework 開發人員創建更加引人注目的圖形接口。考慮到它的小內存足跡 (72kb),它的功能已經相當豐富了。而且,它的性能對於一般應用程序而言已經足夠了。此外,多虧它的純粹托管代碼設計,XrossOne GDI+ 是一個跨平台、跨設備的二維圖形引擎。


  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved