【WPF學習】第四十四章圖畫

時間 2020-02-18

標籤 WPF學習第四十四圖畫简体版

原文原文鏈接

　　經過上一章的學習，Geometry抽象類表示形狀或路徑。Drawing抽象類扮演了互補的角色，它表示2D圖畫(Drawing)——換句話說，它包含了顯示矢量圖像或位圖須要的全部信息。ide

　　儘管有幾類畫圖類，但只有GeometryDrawing類能使用已經學習過的幾何圖形。它增長了決定如何繪製圖形的畫筆和填充細節。可將GeometryDrawing對象視爲矢量插圖中的形狀。例如，可將標準的窗口元文件格式(.wmf)轉換成準備插入用戶界面的GeometryDrawing對象的集合。工具

　　分析一個簡單的示例有幫助的。前面已經看到了如何定義表示三角形的PathGeometry對象：佈局

<PathGeometry>
     <PathFigure IsClosed="True" StartPoint="0,100">
            <LineSegment Point="100,100"/>
             <LineSegment Point="100,50"/>
     </PathFigure>
</PathGeometry>

　　可以使用PathGeometry對象建立GeometryDrawing對象，以下所示：學習

<GeometryDrawing  Brush="Yellow" >
            <GeometryDrawing.Pen>
                <Pen Brush="Blue" Thickness="3"></Pen>
            </GeometryDrawing.Pen>
            <GeometryDrawing.Geometry>
                <PathGeometry>
                    <PathFigure IsClosed="True" StartPoint="10,100">
                        <LineSegment Point="100,100" />
                        <LineSegment Point="100,50" />
                    </PathFigure>
                </PathGeometry>
            </GeometryDrawing.Geometry>
</GeometryDrawing>

　　如今，PathGeometry對象定義了形狀（三角形）。GeometryDrawing對象定義了形狀的外觀（具備藍色邊界的黃色三角形）。PathGeometry對象和GeometryDrawing對象都不是元素，因此不能直接使用這兩個對象中的任何一個爲窗口添加本身繪製的內容，而須要使用另外一個支持圖畫的類。spa

　　GeometryDrawing類不是WPF總惟一的圖畫類（儘管當使用2D矢量圖形時，該類是最相關的一個類）。實際上，Drawing類用於表示全部類型的2D圖形，而且還有一個小組類繼承自該類。下表列出了全部這些類。插件

表圖畫類設計

1、顯示圖畫3d

　　由於繼承自Drawing的類不是元素，因此不能將它們放置到用戶界面中。爲了顯示圖畫，須要使用下表列出的三個類中的一個。code

表用於顯示圖畫的類orm

　　全部這些類中都存在通用主題。很是簡單，它們提供了使用更少系統資源顯示2D內容的方法。

　　例如，假如但願使用矢量圖像爲按鈕建立圖表。最簡單的方法（也是佔用資源最多的方法）是在按鈕中放置Canvas控件，並在Canvas控件中放置一系列繼承自Shape類的元素：

<Button ...>
    <Canvas ...>
        <Polyline ...>
        <Polyline ...>
        <Rectangle ...>
        <Ellipse ...>
        <Polygon ...>
    </Canvas>
</Button>

　　如今已經知道，若是是使用這種方法，每一個元素都是徹底獨立的，具備本身的內存區域和事件處理程序等。一個更好的減小元素數量的方法是Path元素。由於每一個路徑具備單獨的筆畫和填充，因此仍須要大量Path對象，不過這仍是可以在必定程度上減小元素數量：

<Button ...>
    <Canvas ...>
        <Path ...>
        <Path ...>
        ...
    </Canvas>
 </Button>

　　一旦開始使用Path元素，就將獨立形狀變換爲不一樣的幾何圖形。可從路徑中提取幾何圖形、筆畫以及填充信息並將它們轉換成圖畫，從而再增長一個抽象層。而後可在DrawingGroup對象中將這些圖畫融合在一塊兒，並將DrawingGroup對象放置到DrawingImage對象中，DrawingImage對象又可被放入到Image元素中。下面是這一過程建立的新標記：

<Button ...>
    <Image ...>
        <Image.Source>
            <DrawingImage>
                <DrawingImage.Drawing>
                    <DrawingGroup>
                        <GeometryDrawing ...>
                        <GeometryDrawing ...>
                        <GeometryDrawing ...>
                        ...
                    </DrawingGroup>
                </DrawingImage.Drawing>
            </DrawingImage>
        </Image.Source>
    </Image>
</Button>

　　這是一次意義重大的改變。該例並無簡化標記，只是用GeometryDrawing對象代替了每一個Path對象。然而，因爲減小了元素的數量，所以下降了所需的開銷。在前面的示例中建立了包含在按鈕中的Canvas控件，併爲每一個路徑添加了單獨的元素。但該例只須要一個嵌套的元素：位於按鈕中的Image元素。付出的代價是不能再爲每一個不一樣的路徑處理事件（例如，不能探測鼠標在圖畫中獨立區域的單擊操做）。但在用於按鈕的靜態圖像中，未必須要使用這種功能。

　　儘管使用DrawingImage對象已經節省了大量資源，但仍可進一步提升效率，藉助於Drawing刪除另外一個元素。

　　基本思想是在DrawingBrush對象中的封裝DrawingImage對象，以下所示：

<Button ...>
    <Button.Background>
        <DrawingBrush>
            <DrawingBrush.Drawing>
                <DrawingGroup>
                    <GeometryDrawing ...>
                    <GeometryDrawing ...>
                    <GeometryDrawing ...>
                    <....>
                </DrawingGroup>
            </DrawingBrush.Drawing>
        </DrawingBrush>
    </Button.Background>
</Button>

　　DrawingBrush方法和前面介紹的DrawingImage方法不徹底相同。由於Image元素改變其內容的默認方式是不一樣的。Image.Stretch屬性的默認值是Uniform，該設置會爲了適應可用空間而放大或縮小圖像。DrawingBrush.Stretch屬性的默認值是Fill，該設置可能會扭曲圖像。

　　當改變DrawingBrush的Stretch屬性時，爲明確扭曲填充區域中圖畫的位置和尺寸，也可能但願調整Viewport設置。例如，下面的標記縮放由圖畫畫刷使用的圖畫，以佔用填充區域的90%：

<DrawinBrush Stretch="Fill" Viewport="0,0 0.9,0.9">

　　對於按鈕示例這是很是有用的。由於可爲按鈕周圍的邊框留出必定的空間。由於DrawingBrush並不是元素，因此不能使用WPF佈局過程。這意味着和Image元素不一樣，DrawingBrush中的內容放置不會考慮Button.Paddin屬性值。

　　使用DrawingBrush方式的一個古怪問題是，將鼠標移到按鈕上時內容會消失，而且會使用一個新畫刷繪製按鈕表面。但當使用Image方式時，圖片就不受影響。爲了解決這個問題，須要爲按鈕建立自定義按鈕控件模板，該模板使用不一樣的方式繪製按鈕的背景。

　　不管是在DrawingImage自己中使用圖形，仍是使用DrawingBrush封裝圖形，都應當考慮使用資源分解標記。基本思想是做爲不一樣資源定義每一個DrawingImage或DrawingBrush對象，從而當須要時就能夠引用定義的對象。若是但願在多個元素或窗口中顯示相同的內容，這是特別好的思想，由於只須要重用資源，而沒必要複製整塊標記。以下面的示例所示：

<Window x:Class="Drawing.Drawings"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Drawings" Height="300" Width="300">
    <Window.Resources>
        <GeometryDrawing x:Key="Drawing" Brush="Yellow" >
            <GeometryDrawing.Pen>
                <Pen Brush="Blue" Thickness="3"></Pen>
            </GeometryDrawing.Pen>
            <GeometryDrawing.Geometry>
                <PathGeometry>
                    <PathFigure IsClosed="True" StartPoint="10,100">
                        <LineSegment Point="100,100" />
                        <LineSegment Point="100,50" />
                    </PathFigure>
                </PathGeometry>
            </GeometryDrawing.Geometry>
        </GeometryDrawing>
    </Window.Resources>

    <StackPanel Orientation="Horizontal" Margin="5">
        <Button Width="30" Height="30">
            <Image>
                <Image.Source>
                    <DrawingImage Drawing="{StaticResource Drawing}">
                    </DrawingImage>
                </Image.Source>
            </Image>
        </Button>
        <Button Width="30" Height="30">
            <Button.Background>
                <DrawingBrush Stretch="Uniform" Viewport="0,0 0.9,1" Drawing="{StaticResource Drawing}">
                </DrawingBrush>
            </Button.Background>
        </Button>
    </StackPanel>
</Window>

Drawings

2、導出插圖

　　儘管全部這些示例都內聯地聲明他們的圖畫，但更經常使用的方法是將該內容的某些部分放到資源字典中，從而可在整個應用程序中重用（並不是一個地方進行修改）。由用戶來肯定如何將這些標記分割到資源中，但兩種經常使用的方法是，存儲一個充滿DrawingImage對象的字典，或存儲一個保存DrawingBrush對象的字典。此外，也能夠分離出Geometry對象，並將它們存儲爲獨立的資源。如上面的示例所示。

　　固然，不多有開發人員會手動編寫大量圖形。反而，他們將使用專門的設計工具導出所需的XAML內容。大多數設計工具目前還不支持XAML導出功能，不過有許多插件和轉換工具能夠彌補這一缺陷。下面是幾個例子：

　　http://www.mikeswanson.com/XAMLExport/上有一個用於Adobe Illustrator工具的免費XAML插件
　　http://www.mikeswanson.com/swf2xaml/上有一個用於Adobe Flash文件的免費XAML轉換工具。
　　Expression Design是Microsoft公司的插入和圖形設計程序，內置了XAML導出功能。該程序可以讀取各類矢量圖形文件格式，包括.wmf(Windows元文件格式)文件，還能夠導入已經存在的插圖並將其導出爲XAML格式。

　　然而，即便使用其中某個工具，前面學習的有關圖形和圖畫的知識依然十分重要，主要緣由以下幾點：

　　首先，許多程序容許選擇是但願做爲Canvas控件中的獨立元素的組合導出圖畫，仍是但願做爲DrawingBrush或DrawingImage資源的集合導出圖畫。一般，第一種選擇是默認選擇，由於它保留了許多特性。然而，若是使用大量圖畫，而且圖畫很複雜，或者只是但願爲了儘量減小內存需求而使用靜態圖形，如按鈕圖形，使用DrawingBrush或DrawingImage資源更好的多。並且，這些格式和用戶界面的其餘部分是相互獨立的，因此在之後很容易更新它們。

　　之因此說理解2D圖形基礎知識是很重要的，另外一個緣由是這樣能夠更容易地控制它們。例如，可經過如下方式替換標準的2D圖形：修改用於繪製各類形狀的畫刷、爲單個幾何圖形應用變化、改變不透明度或者變換整個形狀層（經過DrawingGroup對象）。更富有戲劇性的是，可添加、刪除和替換單個幾何圖形。