第十三章绘图.PPTVIP

第十三章 繪　圖 13-1 繪圖方法 13-2 繪圖屬性 13-3 綜合範例 相信很多人都有使用PhotoImpact、PhotoShop或Windows小畫家的經驗， 您要繪製直線、圓、扇形、多邊形、或輸入文字等，都是線上操作完成，這些操作的背後都由許多函式堆積而成。其次，由於軟體技術的進步，這些函式也陸陸續續物件化，而以屬性、方法或事件的方式公開，程式設計者可以經由簡單的設定而完成類似小畫家的簡單繪圖程式。請看本章介紹即可完成一個小畫家程式。 例如，以下程式片段可於Image1物件的（10, 10）與（100, 100）之間繪一條直線。 x1 = 10; y1 = 10; x2 = 100; y2 = 100; Image1.Canvas.MoveTo（x1, y1）; Image1.Canvas.LineTo（x2, y2）; 以下程式片段可於（10, 10）與（100, 100）之間繪一矩形。 Image1.Canvas.Rectangle（10, 10, 100, 100）; 以下程式片段可於（10, 10）與（100, 100）之間繪一圓，圓心在（55, 55）。 Image1.Canvas.Ellipse（10, 10, 100, 100）; 範例13-1a 請參考小畫家繪製直線的操作方式，並寫程式完成。 小畫家繪製直線的方法如下： 1 按一下“直線”圖項。 2 移滑鼠至直線起點。 3 拖曳直線的位置，電腦亦全程展示拖曳的過程。 4 放開滑鼠左鍵時，即可完成直線的繪製。 5 若要繼續本條直線的繪製，則繼續往直線的第3點拖曳即可。 程式說明: 1. 本例使用兩個旗號，分別是md與mm。md用於記錄滑鼠左鍵是否按下，mm用於記錄按下之後是否繼續移動。 2. 按一下“開始”鍵時，md、mm分別設為0。 3. 按下左鍵時，代表當時的左鍵位置為繪圖起點，可於MouseDown事件設定md = 1，及記錄繪圖起點於x1，y1。 4. 按住左鍵移動滑鼠時，開始繪製直線，此直線從（x1, y1）到（X, Y），並設定mm = 1，xOld = X，yOld = Y。 5. 在使用者尚未放開左鍵時，每一點的移動都要先刪除剛剛的一條直線（x1, y1）到（xOld, yOld），且畫上一條新線（x1, y1）到（X, Y）。 6. 放開左鍵時，代表完成一條直線的繪製，並設定md = 0，mm = 0，x1 = X，y1 = Y，繼續下一條直線的繪製。 範例13-1b 示範矩形的繪製。 範例13-1c 同上範例，分別安排三個按鈕，可分別繪製矩形、橢圓或圓角矩形。 範例13-1d 示範弧形的繪製。 弧形、弦線及扇形的繪製，均是先拖曳一個矩形，如下圖左。接著，分別點一下（x3, y3）及（x4, y4）的位置，電腦即會以圓心與（x3, y3）的直線與矩形的交點為弧起點逆時針繪弧，弧終點為圓心與（x4, y4）的直線與矩形的交點，如下圖右。 範例13-1e 示範弦線與扇形的繪製。 弦線與扇形的操作同弧形，均是先拖曳一個矩形，再點選（x3, y3）及（x4, y4），下圖左是弦線，下圖右是扇形。 範例13-1f 示範多邊形（Polyline）與實心多邊形（Polygon）的繪製。 範例13-1g 示範貝茲曲線的基本繪製。 範例13-1h 示範貝茲曲線的繪製。 下表是Canvas物件的常用屬性，設定以下屬性即可解決以上問題。 範例13-2a 線條寬度、樣式及顏色示範。 13-3 綜合範例 範例13-3a 試設計一個動畫，其軌跡為圓。 題目分析: 1. 圓的參數方程式為： x = r cosθ y = r sinθ 2. Delphi中任何可繪圖的物件，原點（0, 0）均在物件的左上角，x座標向右為正，y座標向下為正。所以，若要將原點平移至表單的中心，應加一個平移量（x0, y0）。而本例（x0, y0）分別為表單寬與高的一半。 範例13-3b 同上範例，但軌跡方程式為極座標的r=5θ。 範例13-3c 示範圖形的旋轉。 範例13-3d 示範圖形的比對。 補充說明: 本例亦適用印章、指紋的比對，但以上圖形都不是蓋得很正，所以應適當的平移與旋轉後再繼續比對。 習題 請參考小畫家，逐一完成其功能。 * * 13-1 繪圖方法 Delphi所提供的繪圖方法如下，這些方法都隸屬於Canvas物件，而Form、Image、BitMap及PaintBox等元件均可使用Canvas物件 FloodFill（x, y, color, FillStyle） 填滿 FloodFill PolyBezier（Slice(p, 4)） 貝茲曲線 PolyBezier Polygon（p, n） 封閉多邊形 Polygon