教育部普通高等教育十二五國家級規劃教材

《C#程序設計及應用教程》第3版

（包括簡化版：《C#程序設計教程》第3版）

第13章二維圖形圖像處理2Ch13二維圖形圖像處理13.1圖形圖像處理基礎13.2圖形處理13.3圖像處理13.4利用畫筆繪制圖形圖像313.1圖形圖像處理基礎WPF采用“保留模式”來負責圖形圖像的呈現，其內部用一組序列化繪圖狀態來保存這些對象，這樣就可以讓WPF自動進行重繪，而不再需要程序員編程去維護這些狀態。WPF使用矢量圖和與設備無關的技術來處理二維、三維圖形的顯示，并能根據本機的圖形硬件（顯卡、GPU）自動選擇合適的呈現技術13.1.1與二維三維圖形圖像處理相關的類System.Windows.Media.Imaging命名空間：提供了對圖像進行編碼和解碼的類。System.Windows.Controls命名空間：提供除了形狀控件外的其他各種WPF控件，這些控件都是從Visual類派生的，包括Image控件以及我們在前面的章節中學習過的其他各種控件，這些控件按功能進行了分類，并提供了專門的實現。System.Windows.Shapes命名空間：提供了基本的幾何圖形形狀控件，這些控件都是從Shape類派生的，而由于Shape又是從Visual派生而來的，所以這些控件本質上也都是從Visual派生的。413.1.1與二維三維圖形圖像處理相關的類Geometry及其派生類Geometry類在System.Windows.Media命名空間內，該類是定義二維圖形形狀的抽象基類。Shape及其派生類Shape類在System.Windows.Shapes命名空間內，該類是在FrameworkElement級別定義和繪制基本幾何圖形形狀的抽象基類。Drawing及其派生類Drawing類在System.Windows.Media命名空間內。該類是描述二維繪圖的抽象基類。13.1.1與二維三維圖形圖像處理相關的類Visual及其派生類Visual類也在System.Windows.Media命名空間內。

Visual類提供的功能包括：輸出顯示：呈現Visual對象的持久的序列化繪圖內容。轉換：對可視對象執行轉換。剪輯：為Visual對象提供剪輯區域支持。命中測試：確定指定的坐標點或幾何圖形是否包含在可視對象的邊界內。邊界框計算：確定Visual對象的邊框。TileBrush及其派生類TileBrush類也在System.Windows.Media命名空間內，該類描述使用一個或多個圖塊繪制區域的方法。613.2圖形處理圖形處理簡介圖形處理是指對二維矢量幾何圖形的處理，由于矢量圖形是根據幾何圖形的特征來計算并繪制的，因此繪制的矢量圖形不會有任何失真。在WPF中，有兩種定義二維幾何圖形形狀的技術，一種是用Geometry對象實現，另一種是用Shape對象實現。Geometry對象只定義圖形的形狀但自身沒有繪制功能，適用于將其作為XAML資源的場合；Shape對象除了定義圖形的形狀外其自身還具有繪制功能，適用于直接對某種圖形的形狀進行界面級別處理的場合。713.2.1二維幾何圖形和路徑標記語法System.Windows.Media命名空間下的Geometry類是定義二維幾何圖形的抽象基類，下表列出了其派生類。8圖形形狀類說明簡單幾何圖形LineGeometry定義一條由兩個點連接的直線RectangleGeometry定義一個矩形EllipseGeometry定義一個橢圓路徑幾何圖形PathGeometry用路徑定義一系列基本圖形StreamGeometry用流定義一系列基本圖形復合幾何圖形CombinedGeometry按照合并規則將兩個圖形合并在一起GeometryGroup將多個圖形組合在一起路徑幾何圖形9路徑幾何圖形是指把一系列圖形按照某種方式組合在一起構成的形體。PathGeometry和StreamGeometry提供了描繪由直線、弧線和曲線組成的多個復雜圖形的方法。Path控件專門用于繪制定義的路徑幾何圖形。該類從Shape類繼承的，利用Geometry對象來定義圖形，然后再通過它的下列屬性實現繪制功能。Fill屬性：描述用哪種畫筆（Brush）填充封閉的形狀。Stroke屬性：描述用鋼筆（Pen類的實例）的哪種Color或Brush繪制形狀的輪廓。StrokeThickness屬性：描述輪廓的粗細。PathGeometryPathGeometry是PathFigure對象的集合，用于創建基本形狀以及組合后的復雜形狀。

PathFigureCollection中的每個PathFigure由一個或多個線段組成，下表列出了這些線段的類型及其含義。10線段類型說明ArcSegment在兩個點之間創建一條橢圓弧線BezierSegment在兩個點之間創建一條三次方貝塞爾曲線LineSegment在兩個點之間創建一條直線PolyBezierSegment創建一系列三次方貝塞爾曲線PolyLineSegment創建一系列直線PolyQuadraticBezierSegment創建一系列二次貝塞爾曲線QuadraticBezierSegment創建一條二次貝塞爾曲線PathGeometry例13-1：使用PathGeometry創建一個三角形。11StreamGeometryStreamGeometry是定義一個可包含曲線、弧線和直線的復雜幾何形狀。PathGeometry和StreamGeometry的選擇原則：當需要高效率描繪復雜的幾何圖形而且不使用數據綁定、動畫或修改時，可考慮使用StreamGeometry，否則使用PathGeometry。凡是能用StreamGeometry實現的功能也都可以用PathGeometry來實現。12路徑標記語法路徑標記語法是StreamGeometry和PathGeometry的一種簡化的XAML命令描述形式。13命令類型說明移動（M或m）參數：startPoint示例：M10,20功能：指定新圖形的起點。大寫的M表示startPoint是絕對值；小寫的m表示startPoint是相對于上一個點的偏移量，如果是(0,0)，則表示不存在偏移。當在移動命令之后列出多個點時，即使指定的是線條命令，也將繪制出連接這些點的線直線（L或l）參數：endPoint示例：L20,30功能：在當前點與指定的終點之間創建一條直線水平線（H或h）參數：x示例：M10,50H90功能：在當前點與指定的x坐標之間創建一條水平線。x表示線的終點的x坐標（double類型）路徑標記語法命令類型說明垂直線（V或v）參數：y示例：M10,50V200功能：在當前點與指定的y坐標之間創建一條垂直線。y表示線的終點的y坐標（double類型）二次貝塞爾曲線（Q或q）參數：p1endPoint示例：M10,100Q200,200300,100功能：通過使用指定的控制點(p1)在當前點與指定的終點之間創建一條二次貝塞爾曲線平滑的二次貝塞爾曲線（T或t）參數：p2endPoint示例：T100,200,300,200功能：在當前點與指定的終點之間創建一條二次貝塞爾曲線。控制點假定為前一個命令的控制點相對于當前點的反射。如果前一個命令不存在，或者前一個命令不是二次貝塞爾曲線命令或平滑的二次貝塞爾曲線命令，則此控制點就是當前點。p2指曲線的控制點，用于確定曲線的起始正切值。endPoint指曲線將繪制到的點14命令類型說明三次方貝塞爾曲線（C或c）參數：p1p2endPoint示例：M10,100C100,0200,200300,100功能：通過使用兩個指定的控制點（p1和p2）在當前點與指定的終點之間創建一條三次方貝塞爾曲線。平滑的三次方貝塞爾曲線（S或s）參數：p2endPoint示例：M10,100C35,0135,0160,100S285,200310,100功能：在當前點與指定的終點之間創建一條三次方貝塞爾曲線。第一個控制點假定為前一個命令的第二個控制點相對于當前點的反射。如果前一個命令不存在，或者前一個命令不是三次方貝塞爾曲線命令或平滑的三次方貝塞爾曲線命令，則假定第一個控制點就是當前點。第二個控制點，即曲線終端的控制點由p2指定橢圓弧線（A或a）參數：size,rotationAngle,isLargeArcFlag,sweepDirectionFlag,endPoint示例：M10,100A100,504510200,100功能：在當前點與指定的終點之間創建一條橢圓弧線。size：弧的X軸半徑和Y軸半徑；rotationAngle：橢圓的旋轉度數；isLargeArcFlag：如果弧線的角度應大于或等于180度，則設置為1，否則設置為0；sweepDirectionFlag：如果弧線按照正角方向繪制，則設置為1，否則設置為0；endPoint：弧線將繪制到的點關閉（Z或z）示例：M10,100L100,100100,50ZM10,10100,10100,40Z功能：終止當前的圖形并創建一條連接當前點和圖形起點的線。此命令用于在圖形的最后一個線段與第一個線段之間創建一條連線（轉角）15路徑標記語法13.2.2基本圖形直線LineGeometry類用StartPoint和EndPoint定義直線的起點和終點，也可以用路徑標記語法來描述它。例13-2：繪制一條數學上使用的坐標軸，即讓坐標系的原點位于窗口中心，橫向從左到右為x正方向，縱向從下到上為y軸正方向，然后在此坐標系統下繪制一條從（0，0）點到（20，20）的直線。1613.2.2基本圖形折線折線是將一系列的點依次用直線相連，當這些點之間的距離很近時，其效果與曲線就很相似了。有兩種繪制折線的方法，一種是用LineGeometry實現，另一種是用PolyLine實現。例13-3：根據正弦函數計算出多個點，然后將這些點用直線依次相連。1713.2.2基本圖形矩形RectangleGeometry類使用System.Windows命名空間下的Rect結構來定義矩形的輪廓，該結構指定矩形的左上角位置以及矩形的高度和寬度，另外還可以通過設置RadiusX和RadiusY屬性創建圓角矩形。例13-4：演示矩形的基本繪制方法。運行效果如圖所示。1813.2.2基本圖形橢圓EllipseGeometry類通過中心點（Center屬性）、x半徑（RadiusX屬性）和y半徑（RadiusY）來定義橢圓的形狀。當x半徑和y半徑相同時，其效果就是一個圓。例13-5：演示橢圓的基本繪制方法。運行效果如圖所示。1913.2.2基本圖形多邊形多邊形是由3條或3條以上的邊組成的閉合圖形，包括規則多邊形和不規則多邊形。有兩種技術來實現，一種是用PathGeometry或者StreamGeometry，另一種是用繼承自Shape的Polygen或者PolyLine。例13-6：演示用C#實現任意數量的規則多邊形的基本繪制方法。運行效果如圖所示。2013.2.2基本圖形曲線曲線包括橢圓弧、二次貝塞爾曲線、三次貝塞爾曲線等。例13-7：演示橢圓弧、二次貝塞爾曲線、三次貝塞爾曲線的基本繪制方法。運行效果如圖所示。2113.2.3復合圖形組合圖形（GeometryGroup）GeometryGroup類創建它所包含的Geometry對象的組合體，但不合并其包含的區域。可以向GeometryGroup中添加任意數量的Geometry對象，然后再用Path將組合后的結果呈現出來。GeometryGroup的FillRule屬性獲取或設置如何組合GeometryGroup中所包含對象的相交區域。例13-8：演示GeometryGroup的基本用法以及FillRule的含義。運行效果如圖所示。2213.2.3復合圖形合并圖形（CombinedGeometry）CombinedGeometry對象和該對象的Combine方法用布爾操作合并圖形，使用它可以合并兩個幾何圖形所定義的區域，合并后沒有封閉區域的Geometry對象將被丟棄。例13-9：演示CombinedGeometry的基本用法。2313.2.4將格式化文本轉換為圖形在有些應用中，我們可能需要將文本字符串轉換為離散的路徑幾何圖形，然后再對其做進一步的處理，例如繪制空心字、沿文字的筆畫進行移動的動畫等。將文本轉換為Geometry對象的關鍵是使用FormattedText對象，該對象用于創建格式化的文本。2413.2.4將格式化文本轉換為圖形例13-10：演示如何將格式化文本轉換為Geometry對象，并演示如何利用它繪制空心字。運行效果如圖所示。2513.3圖像處理圖像處理簡介圖像是指按照某種格式編碼存儲的圖，一般用與設備無關的像素保存圖像中的每個點的信息（紅色通道、藍色通道、綠色通道以及透明度），圖像編碼格式不同，每個像素點占用的字節數也不一定相同。圖像處理是指對各種圖像格式的文件以及繪圖結果進行處理，包括圖像的編碼、解碼、元數據存儲和讀取、創建、加載、保存、壓縮、解壓縮、顯示、繪制、剪裁、合并、平鋪、拉伸、旋轉、縮放、蒙板以及將矢量圖形轉換為圖像等。2613.3.1圖像處理常用類BitmapSource類用于對圖像進行解碼和編碼，它是WPF圖像處理管線的基本構造塊。該類表示具有特定大小和分辨率的單個不變的像素集，可以用它表示多幀圖像中的單個幀，也可以表示在BitmapSource上執行轉換的結果。BitmapFrame類BitmapFrame是BitmapSource派生類中比較常用的類之一，該類用于存儲圖像格式的實際位圖數據。利用BitmapFrame能將各種格式的圖像轉換為位圖，然后對其進行處理，比如灰度處理、旋轉、縮放、裁切等。2713.3.1圖像處理常用類BitmapImage類BitmapImage也是從BitmapSource類派生類的，它是一個為了加載XAML而優化的專用BitmapSource。BitmapImage的特點是只加載自動將縮放后的結果，而不是先在內存中緩存原始大小的圖像然后再對其進行縮放，所以該方式與直接指定Image的寬度或高度相比能大大節省內存的容量。2813.3.1圖像處理常用類從BitmapSource繼承的其他類ColorConvertedBitmap類：更改BitmapSource的顏色空間。FormatConvertedBitmap類：為BitmapSource提供像素格式轉換功能。CroppedBitmap類：裁剪一個BitmapSource。CachedBitmap類：為BitmapSource提供緩存功能。RenderTargetBitmap類：將Visual對象轉換為位圖。WriteableBitmap類：提供一個可寫入并可更新的BitmapSource。2913.3.2圖像的編碼和解碼WPF提供了多種格式的圖像編碼器和解碼器30圖像格式文件擴展名編碼器解碼器位圖圖像（BMP）.bmpBmpBitmapEncoderBmpBitmapDecoder聯合圖像專家組圖像（JPEG）.jpgJpegBitmapEncoderJpegBitmapDecoder可移植網絡圖形圖像（PNG）.pngPngBitmapEncoderPngBitmapDecoder標記圖像文件格式圖像（TIFF）.tifTiffBitmapEncoderTiffBitmapDecoder圖形交換格式圖像（GIF）.gifGifBitmapEncoderGifBitmapDecoderWindowsMedia照片圖像.wdpWmpBitmapEncoderWmpBitmapDecoder13.3.2圖像的編碼和解碼圖像格式編碼圖像編碼是指將圖像數據轉換為特定圖像格式的過程。例13-11：演示TIFF圖像編碼以及保存圖像的基本用法。運行效果如圖所示。3113.3.2圖像的編碼和解碼圖像格式解碼圖像格式解碼是指將某種圖像格式轉換為可以由系統使用的圖像數據。解碼后，即可以對其進行顯示、處理或編碼為其他格式。例13-12：演示圖像解碼以及獲取原始圖像信息的基本用法。運行效果如圖所示。3213.3.3像素格式轉換（FormatConvertedBitmap）FormatConvertedBitmap類為BitmapSource提供像素格式轉換的功能。例13-13：演示如何將彩色圖像轉換為灰度圖和黑白圖。運行效果如圖所示。3313.3.4旋轉裁切和縮放圖像TransformedBitmap旋轉圖像，Image或者CroppedBitmap裁切圖像，ScaleTransform縮放圖像。旋轉圖像：位圖圖像僅支持90度增量的旋轉，即只能選擇以下旋轉角度之一：0、90、180、270。如果希望讓圖像旋轉任意角度，應該用畫筆變換來實現。裁切圖像：如果只想調整圖像的一部分，可以用Image或者CroppedBitmap的Clip屬性實現；如果需要編碼和保存裁切過的圖像，應該用CroppedBitmap來實現。縮放圖像：利用TransformedBitmap可縮放圖像。也可以用畫筆縮放實現。3413.3.4旋轉裁切和縮放圖像例13-14：演示旋轉、裁切和縮放圖像并將處理結果保存到新的圖像文件中的基本用法。運行效果如圖所示。3513.3.5自動播放和逐幀繪制GIF動畫GIF和TIFF都可以包含多幀圖像，將GIF包含的多幀圖像逐幀顯示出來。其意義在于：既然可以將每一幀都單獨讀出來，當然也能對每一幀的圖分別進行處理。例13-15：利用GifBitmapDecoder解碼器，將所有圖像逐幀顯示出來。運行效果如圖所示。3613.3.6其他基本的圖像處理技術將圖像作為縮略圖加載將圖像作為縮略圖加載時，可利用BitmapImage的DecodePixelWidth屬性設置縮略圖的大小，這樣可以減少加載圖像所需的內存。將一種圖像格式轉換為另一種圖像格式如果希望將一種圖像格式轉換為另一種圖像格式，只需要先從解碼器中獲取圖像信息，然后用編碼器設置相應的幀并保存圖像信息即可。3713.3.6其他基本的圖像處理技術圖像處理的一般原則應始終將圖像解碼為所需的大小而不是圖像的原始大小。如有可能，應盡可能將多個圖像組合成多幀圖像再加載，而不是分別加載和顯示單個文件。3813.4利用畫筆繪制圖形圖像——TileBrush類基本組件TileBrush類包括三個主要的組件：內容、圖塊和輸出區域。內容如果畫筆為ImageBrush，則表示“內容”為圖像。此時用ImageSource屬性指定ImageBrush的內容。如果畫筆為DrawingBrush，則表示“內容”為繪圖。此時用Drawing屬性指定DrawingBrush的內容。如果畫筆為VisualBrush，則表示“內容”為可視元素。此時用Visual屬性指定VisualBrush的內容。39TileBrush類圖塊圖塊是用“內容”構造出來的基本塊。TileBrush提供了一個Stretch屬性，該屬性用Stretch枚舉指定如何用“內容”來構造圖塊。輸出區域輸出區域指如何用“圖塊”填充目標區域。TileBrush提供了一個TileMode屬性，該屬性用TileMode指定如何填充目標區域，包括平鋪、水平反轉、垂直翻轉等。40TileBrush類拉伸圖塊（Stretch）從TileBrush繼承的畫筆類型都可以用Stretch屬性控制如何拉伸“圖塊”。該屬性用Stretch枚舉來表示，可用的枚舉值有：None：圖塊保持其原始大小。Fill：調整圖塊的大小以填充目標尺寸，不保留縱橫比。Uniform：在保留圖塊原有縱橫比的同時調整圖塊的大小，以適合目標尺寸。UniformToFill：在保留圖塊原有縱橫比的同時調整圖塊的大小，以填充目標尺寸。如果目標矩形的縱橫比與圖塊的縱橫比不相同，則對圖塊進行剪裁（將目標矩形尺寸以外的部分裁剪掉）以適合目標矩形的大小。41TileBrush類例13-16：演示用圖像畫筆拉伸圖像的基本用法。運行效果如圖所示。42TileBrush類平鋪方式（TileMode）從TileBrush繼承的畫筆類型都可以用TileMode屬性控制如何用“圖塊”填充“輸出區域”。TileMode屬性用TileMode枚舉來定義，可用的枚舉值有：None：不平鋪。僅繪制基本圖塊。Tile：平鋪。繪制基本圖塊，并通過重復基本圖塊來填充剩余的區域，使一個圖塊的右邊緣靠近下一個圖塊的左邊緣，底邊緣和頂邊緣也是如此。FlipX：與Tile相同，只不過圖塊的交替列水平翻轉。FlipY：與Tile相同，只不過圖塊的交替行垂直翻轉。FlipXY：FlipX和FlipY的組合。43TileBrush類例13-17：演示用圖像畫筆填充圖像的基本用法。運行效果如圖所示。44TileBrush類Viewport和ViewportUnitsTileBrush默認生成單個圖塊并拉伸此圖塊以完全填充輸出區域，Viewport屬性決定了基本圖塊的大小和位置，ViewportUnits屬性決定了Viewport是使用絕對坐標還是相對坐標。Transform和RelativeTransformTileBrush類提供了兩個變換屬性：Transform和RelativeTransform。使用這些屬性可以旋轉、縮放、扭曲和平移畫筆的內容。45TileBrush類例13-18：演示對畫筆進行變換的基本用法。運行效果如圖所示。4613.4.2圖像畫筆（ImageBrush）圖像畫筆（ImageBrush）是一種“內容”為圖像的畫筆，一般用它將圖像繪制到控件的背景或者輪廓內，或者用圖像作為基本圖塊，然后平鋪到某個區域內。例13-19：演示圖像畫筆的基本用法。運行效果如圖所示。4713.4.3繪制畫筆（DrawingBrush）DrawingBrush使用Drawing派生類來繪圖。這種畫筆可將繪圖對象（圖形、圖像、文本、視頻）作為“內容”繪制到某個區域。在DrawingBrush的Drawing屬性中，可使用以下類定義要繪制的內容：GeometryDrawing：用圖形填充一個區域。ImageDrawing：用圖像填充一個區域。DrawingGroup：將各種繪圖結果組合在一起。DrawingImage：將用Drawing繪制的結果作為圖像來處理。4813.4.3繪制畫筆（DrawingBrush）繪制圖形（GeometryDrawing）GeometryDrawing類使用指定的畫筆（Brush屬性）和鋼筆（Pen屬性）來繪制Geometry，

Bru