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

来源:https://www.cnblogs.com/Peter-Luo/archive/2020/02/17/12324359.html
-Advertisement-
Play Games

通過上一章的學習,Geometry抽象類表示形狀或路徑。Drawing抽象類扮演了互補的角色,它表示2D圖畫(Drawing)——換句話說,它包含了顯示矢量圖像或點陣圖需要的所有信息。 儘管有幾類畫圖類,但只有GeometryDrawing類能使用已經學習過的幾何圖形。它增加了決定如何繪製圖形的畫筆和 ...


  通過上一章的學習,Geometry抽象類表示形狀或路徑。Drawing抽象類扮演了互補的角色,它表示2D圖畫(Drawing)——換句話說,它包含了顯示矢量圖像或點陣圖需要的所有信息。

  儘管有幾類畫圖類,但只有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對象都不是元素,所以不能直接使用這兩個對象中的任何一個為視窗添加自己繪製的內容,而需要使用另一個支持圖畫的類。

  GeometryDrawing類不是WPF總唯一的圖畫類(儘管當使用2D矢量圖形時,該類是最相關的一個類)。實際上,Drawing類用於表示所有類型的2D圖形,並且還有一個小組類繼承自該類。下表列出了所有這些類。

表 圖畫類

 

 一、顯示圖畫

  因為繼承自Drawing的類不是元素,所以不能將它們放置到用戶界面中。為了顯示圖畫,需要使用下表列出的三個類中的一個。

表 用於顯示圖畫的類

 

   所有這些類中都存在通用主題。非常簡單,它們提供了使用更少系統資源顯示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

 

 二、導出插圖

  儘管所有這些示例都內聯地聲明他們的圖畫,但更常用的方法是將該內容的某些部分放到資源字典中,從而可在整個應用程式中重用(並非一個地方進行修改)。由用戶來確定如何將這些標記分割到資源中,但兩種常用的方法是,存儲一個充滿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對象)。更富有戲劇性的是,可添加、刪除和替換單個幾何圖形。

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • python求極值點主要用到scipy庫。 1. 首先可先選擇一個函數或者擬合一個函數,這裡選擇擬合數據:np.polyfit import pandas as pd import matplotlib.pyplot as plt import numpy as np from scipy impo ...
  • 題目:將 0001 題生成的 200 個激活碼(或者優惠券)保存到 Redis 非關係型資料庫中。 代碼: ...
  • python數據擬合主要可採用numpy庫,庫的安裝可直接用pip install numpy等。 1. 原始數據:假如要擬合的數據yyy來自sin函數,np.sin import numpy as np import matplotlib.pyplot as plt xxx = np.arange ...
  • 前言 也許,有的人看到上邊這個標題,首先會覺得這肯定是一篇廣告文吧。確實,我們可能見過有很多號主用類似於“你的同齡人已經XXX了,而你還在XXX”這種風格,來寫軟文。 但是,我可以明確的告訴你,這篇文章不是廣告,只是記錄我的一些感想而已。再說了,也沒有廣告主來找我合作呀(手動捂臉)。 正文 今天,無 ...
  • 值傳遞與對象拷貝 值傳遞和引用傳遞 調用一個有參函數的時候,會把實際參數傳遞給形式參數。但是,在程式語言中,這個傳遞過程中傳遞的兩種情況,即值傳遞和引用傳遞 兩者區別 1. 值傳遞(pass by value)是指在調用函數時將實際參數複製一份傳遞到函數中,這樣在函數中如果對參數進行修改,將不會影響 ...
  • 目標網站:古詩文網 登錄界面顯示: 打開控制台工具,輸入賬號密碼,在ALL欄目中進行抓包 數據如下: 登錄請求的url和請求方式 登錄所需參數 參數分析: __VIEWSTATE和__VIEWSTATEGENERATOR可以在登錄界面獲取,code為驗證碼,email為賬號,pwd為密碼,from為 ...
  • 一. insert 首先看一下 insert.java 的代碼: /** * <p> * 根據 ID 刪除 * </p> * * @author hubin * @since 2018-04-06 */ public class Insert extends AbstractMethod { @Ov ...
  • 以控台的形式,運行.net core mvc 代碼, Host.CreateDefaultBuilder(args) .ConfigureWebHostDefaults(webBuilder => { webBuilder.UseStartup<Startup>();//指定網路主機要使用的啟動類型 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...