路徑(path)可以用來定義任意形狀的曲線和幾何圖形,當然這種任意性也帶來了複雜性。為了方便的繪製幾何圖形,微軟在visual studio 2012安裝包中為程式開發者提供了免費的blend for visual studio設計工具,利用這個介面設計工具可以方便的繪製圖形。
而對於開發者而言,有必要掌握的是如何通過編寫**的方式實現應用介面的開發,並可以輕鬆地閱讀這些已經繪製好的圖形**。本節將介紹有關路徑繪圖的相關知識,幫助讀者理解path與pathgeometry的繪圖原理。
path使用一種緊湊的字串語法來描述幾何形狀的路徑,這種語法可以稱為路徑標記語法。通過使用路徑標記語法定義data屬效能實現幾何圖形的繪製。下面列出了路徑標記語法所支援的常用命令,並對這些命令進行簡單的介紹。
下面通過繪製一段曲線來演示如何使用path,這段曲線由一條貝賽爾曲線和兩條線段組成。在乙個開啟的windows應用商店專案中新建乙個空白頁,並命名為pathpage,雙擊開啟此頁面的pathpage.xaml檔案,在grid元素中新增如下**。
執行此頁面,效果如圖8-7所示。
圖8-7 path 圖形執行效果圖
在上面的**中,首先定義path的stroke 屬性為darkgoldenrod、strokethickness屬性為3,以便path能呈現。接著定義path的data屬性,這是決定圖形的關鍵部分,使用m命令開始,指定此路徑起點為(10,10)。
接著使用c命令繪製一段三次方貝塞爾曲線,通過定義四個點來建立乙個三次方貝塞爾曲線,這四個點是起點、終點及兩個控制點。其中起點可以理解為m命令指定的點或上乙個路徑片段的終點。三次方貝塞爾曲線的兩個控制點的作用像磁鐵一樣,朝著自身的方向吸引本應為直線的部分,從而形成一條曲線。第乙個控制點影響曲線的開始部分,第二個控制點影響曲線的結束部分。本示例的三次方貝塞爾曲線由起點 (10,10)、終點(200,175)以及兩個控制點 (20,100) 、 (40,250) 繪製而成。
接著使用命令h,該命令從點(200,175)水平繪製到x軸座標為280的點。最後使用命令z連線此路徑的結束點與起始點。
通過上面的示例相信讀者對繪製命令有了乙個初步的認識,下面列出幾個常用的繪製命令。
posted on
2017-03-30 21:18
...)
編輯收藏
Win10系列 C 應用控制項高階6
路徑 path 可以用來定義任意形狀的曲線和幾何圖形,當然這種任意性也帶來了複雜性。為了方便的繪製幾何圖形,微軟在visual studio 2012安裝包中為程式開發者提供了免費的blend for visual studio設計工具,利用這個介面設計工具可以方便的繪製圖形。而對於開發者而言,有必...
Win10系列 C 應用控制項高階10
ellipsegeometry控制項可以用於繪製橢圓,通過定義ellipsegeometry控制項的center屬性確定橢圓的圓心座標,使用此控制項的radiusx 和radiusy屬性分別定義橢圓x軸 y軸的半徑長度。下面將演示如何使用ellipsegeometry控制項繪製乙個橢圓。在乙個開啟的...
Win10系列 C 應用控制項高階3
若要繪製橢圓需要用到ellipse元素,通過指定ellipse元素的width和height屬性值來確定橢圓的大小,其中width指橢圓在x軸的寬度,height指橢圓在y軸的高度,若x軸和y軸的值相等則可繪製乙個正圓。橢圓在ui布局中佔據的是大小為width和height的矩形區域,圖形外圍的區域...