相关资料:
https://stackoverflow.com/questions/10291330/firemonkey-penmode-equivalent-drawline
https://blog.csdn.net/shuaihj/article/details/8444676
http://www.delphitop.com/html/FMX/2646.html
http://docwiki.embarcadero.com/CodeExamples/Rio/en/FMXTCanvasDrawFunctions_(Delphi)
CSDN代码下载:
https://download.csdn.net/download/zhujianqiangqq/12394005
代码实例:
1 { 2 相关资料: 3 http://www.delphitop.com/html/FMX/2646.html 4 http://docwiki.embarcadero.com/CodeExamples/Rio/en/FMXTCanvasDrawFunctions_(Delphi) 5 6 FMX 的 Canvas 在不同的系统上会分别使用: 7 WinVista、Win7: D2D (FMX.Canvas.D2D.pas) 8 WinXP: GDI+ (FMX.Canvas.GDIP.pas) 9 Mac 系列: Core Graphics (FMX.Canvas.Mac.pas) 10 11 和 HTML5 中的 Canvas 非常类似, 现在的 Canvas 模糊了 Pen 的概念: 12 之前的 Canvas.Pen 对应: Canvas.Stroke; 13 之前的 Canvas.Brush 对应: Canvas.Fill. 14 15 在 FMX 中, Canvas 无处不在, 其 Canvas.Stroke、Canvas.Fill 的状态也各不相同, 一般要先初始化它们. 16 } 17 unit Unit1; 18 19 interface 20 21 uses 22 System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants, 23 FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs, FMX.Objects, 24 FMX.Controls.Presentation, FMX.StdCtrls, FMX.ListBox, FMX.Edit, FMX.ComboEdit, 25 FMX.Colors; 26 27 type 28 TMYStyle = record 29 StrokeColor: TAlphaColor; 30 StrokeThickness: Integer; 31 StrokeCap: TStrokeCap; 32 StrokeDash: TStrokeDash; 33 StrokeJoin: TStrokeJoin; 34 FillColor: TAlphaColor; 35 FontSize: Integer; 36 end; 37 TForm1 = class(TForm) 38 Image1: TImage; 39 DrawLine: TButton; 40 DrawEllipse: TButton; 41 DrawArc: TButton; 42 DrawBitmap: TButton; 43 GroupBox1: TGroupBox; 44 Label1: TLabel; 45 StrokeColor: TColorComboBox; 46 Label2: TLabel; 47 Label3: TLabel; 48 Label4: TLabel; 49 Label5: TLabel; 50 Label6: TLabel; 51 Label7: TLabel; 52 StrokeThickness: TEdit; 53 StrokeCap: TComboBox; 54 StrokeDash: TComboBox; 55 StrokeJoin: TComboBox; 56 FillColor: TColorComboBox; 57 FontSize: TEdit; 58 scFlat: TListBoxItem; 59 scRound: TListBoxItem; 60 sjMiter: TListBoxItem; 61 sjRound: TListBoxItem; 62 sjBevel: TListBoxItem; 63 GroupBox2: TGroupBox; 64 DrawRectSides: TButton; 65 DrawRect: TButton; 66 Edit3: TEdit; 67 FillText: TButton; 68 Claer: TButton; 69 DrawPath: TButton; 70 DrawPolygon: TButton; 71 CreateThumbnail: TButton; 72 OpenDialog1: TOpenDialog; 73 procedure DrawLineClick(Sender: TObject); 74 procedure ClaerClick(Sender: TObject); 75 procedure DrawRectSidesClick(Sender: TObject); 76 procedure Image1Paint(Sender: TObject; Canvas: TCanvas; 77 const ARect: TRectF); 78 procedure FormCreate(Sender: TObject); 79 procedure DrawArcClick(Sender: TObject); 80 procedure DrawBitmapClick(Sender: TObject); 81 procedure DrawEllipseClick(Sender: TObject); 82 procedure DrawPathClick(Sender: TObject); 83 procedure DrawPolygonClick(Sender: TObject); 84 procedure DrawRectClick(Sender: TObject); 85 procedure CreateThumbnailClick(Sender: TObject); 86 procedure FillTextClick(Sender: TObject); 87 procedure StrokeColorChange(Sender: TObject); 88 private 89 { Private declarations } 90 procedure SetMYStyle; 91 public 92 { Public declarations } 93 end; 94 95 var 96 Form1: TForm1; 97 oStyle: TMYStyle; 98 99 implementation 100 uses 101 System.UIConsts, 102 System.Math.Vectors; 103 104 {$R *.fmx} 105 {$R *.LgXhdpiPh.fmx ANDROID} 106 107 procedure TForm1.DrawLineClick(Sender: TObject); 108 var 109 p1, p2: TPointF; 110 begin 111 // sets the ends of the line to be drawn 112 p1 := TPointF.Create(20, 2); 113 p2 := TPointF.Create(350, 400); 114 Image1.Bitmap.Canvas.BeginScene; 115 SetMYStyle; 116 // draws the line on the canvas 117 Image1.Bitmap.Canvas.DrawLine(p1, p2, 100); 118 Image1.Bitmap.Canvas.EndScene; 119 end; 120 121 procedure TForm1.DrawPathClick(Sender: TObject); 122 var 123 path: TPathData; 124 MyRect1, MyRect2: TRectF; 125 begin 126 // set the circumscribed rectangle of the ellipse to be add in the path 127 MyRect1 := TRectF.Create(90, 100, 230, 300); 128 /// sets the rectangle to be add in the path 129 MyRect2 := TRectF.Create(70, 90, 220, 290); 130 // initializes and creates the path to be drawn 131 path := TPathData.Create; 132 path.AddEllipse(MyRect1); 133 path.AddRectangle(MyRect2, 0, 0, AllCorners); 134 Image1.Bitmap.Canvas.BeginScene; 135 SetMYStyle; 136 // draws the path on the canvas 137 Image1.Bitmap.Canvas.DrawPath(path, 200); 138 Image1.Bitmap.Canvas.EndScene; 139 end; 140 141 procedure TForm1.DrawPolygonClick(Sender: TObject); 142 var 143 p1, p2, p3, p4, p5, p6: TPointF; 144 MyPolygon: TPolygon; //System.Math.Vectors unit needed. 145 begin 146 // sets the points that define the polygon 147 p1 := TPointF.Create(80, 200); 148 p2 := TPointF.Create(225, 30); 149 p3 := TPointF.Create(370, 200); 150 p4 := TPointF.Create(300, 340); 151 p5 := TPointF.Create(150, 340); 152 p6 := TPointF.Create(80, 200); 153 // creates the polygon 154 SetLength(MyPolygon, 6); 155 MyPolygon[0] := p1; 156 MyPolygon[1] := p2; 157 MyPolygon[2] := p3; 158 MyPolygon[3] := p4; 159 MyPolygon[4] := p5; 160 MyPolygon[5] := p6; 161 Image1.Bitmap.Canvas.BeginScene; 162 SetMYStyle; 163 // draws the polygon on the canvas 164 Image1.Bitmap.Canvas.DrawPolygon(MyPolygon, 50); 165 Image1.Bitmap.Canvas.EndScene; 166 end; 167 168 procedure TForm1.DrawRectClick(Sender: TObject); 169 var 170 MyRect: TRectF; 171 begin 172 // sets the rectangle to be drawn 173 MyRect := TRectF.Create(50, 40, 200, 270); 174 Image1.Bitmap.Canvas.BeginScene; 175 SetMYStyle; 176 // draws the rectangle on the canvas 177 Image1.Bitmap.Canvas.DrawRect(MyRect, 30, 60, AllCorners, 100); 178 Image1.Bitmap.Canvas.EndScene; 179 end; 180 181 procedure TForm1.CreateThumbnailClick(Sender: TObject); 182 var 183 MyBitmap: TBitmap; 184 begin 185 // loads the bitmap using the TOpenDialog. 186 if OpenDialog1.Execute then 187 MyBitmap := TBitmap.CreateFromFile(OpenDialog1.Files[0]); 188 // draws a thumbnail with given sizes 189 Image1.Bitmap := MyBitmap.CreateThumbnail(300,300); 190 end; 191 192 procedure TForm1.DrawArcClick(Sender: TObject); 193 var 194 p1, p2: TPointF; 195 begin 196 // Sets the center of the arc 197 p1 := TPointF.Create(200, 200); 198 // sets the radius of the arc 199 p2 := TPointF.Create(150, 150); 200 Image1.Bitmap.Canvas.BeginScene; 201 SetMYStyle; 202 // draws the arc on the canvas 203 Image1.Bitmap.Canvas.DrawArc(p1, p2, 90, 230, 20); 204 // updates the bitmap to show the arc 205 Image1.Bitmap.Canvas.EndScene; 206 end; 207 208 procedure TForm1.DrawBitmapClick(Sender: TObject); 209 var 210 // MyBitmap is the bitmap to be drawn on the canvas 211 MyBitmap: TBitmap; 212 // is the area where to draw the bitmap 213 // also is the area of the bitmap to be drawn on the canvas 214 MyRect: TRectF; 215 begin 216 // loads the bitmap using the TOpenDialog. 217 if OpenDialog1.Execute then 218 MyBitmap := TBitmap.CreateFromFile(OpenDialog1.Files[0]); 219 // set the MyRect coordinates 220 MyRect := TRectF.Create(0, 0, 150, 200); 221 Image1.Bitmap.Canvas.BeginScene; 222 SetMYStyle; 223 // draws on the rectangle specified by MyRect the area from MyBitmap specified by MyRect 224 Image1.Bitmap.Canvas.DrawBitmap(MyBitmap, MyRect, MyRect, 20); 225 Image1.Bitmap.Canvas.EndScene; 226 end; 227 228 procedure TForm1.DrawEllipseClick(Sender: TObject); 229 var 230 MyRect: TRectF; 231 begin 232 // sets the circumscribed rectangle of the ellipse 233 MyRect := TRectF.Create(50, 40, 200, 270); 234 // draws the ellipse on the canvas 235 Image1.Bitmap.Canvas.BeginScene; 236 SetMYStyle; 237 Image1.Bitmap.Canvas.DrawEllipse(MyRect, 40); 238 Image1.Bitmap.Canvas.EndScene; 239 end; 240 241 procedure TForm1.DrawRectSidesClick(Sender: TObject); 242 var 243 MyRect: TRectF; 244 begin 245 // sets the rectangle to be customized and drawn 246 MyRect := TRectF.Create(50, 40, 200, 270); 247 Image1.Bitmap.Canvas.BeginScene; 248 SetMYStyle; 249 // customize the rectangle and draws it on the canvas 250 Image1.Bitmap.Canvas.DrawRectSides(MyRect, 50, 20, AllCorners, 40, AllSides, 251 TCornerType.Bevel); 252 Image1.Bitmap.Canvas.EndScene; 253 end; 254 255 procedure TForm1.FillTextClick(Sender: TObject); 256 var 257 MyRect: TRectF; 258 begin 259 // sets the rectangle to be customized and drawn 260 MyRect := TRectF.Create(0, 0, 100, 200); 261 Image1.Bitmap.Canvas.BeginScene; 262 SetMYStyle; 263 Image1.Bitmap.Canvas.FillText(MyRect, Edit3.Text, false, 100, [], TTextAlign.taLeading, TTextAlign.taCenter); 264 Image1.Bitmap.Canvas.EndScene; 265 end; 266 267 procedure TForm1.ClaerClick(Sender: TObject); 268 begin 269 Image1.Bitmap.Clear(TAlphaColors.White); 270 end; 271 272 procedure TForm1.FormCreate(Sender: TObject); 273 begin 274 SetMYStyle; 275 //第一种方式 276 // Self.OnPaint := Image1.OnPaint; 277 // Button1.OnPaint := Image1.OnPaint; 278 // Image1.Opacity := 0.75; 279 //第2种方式 280 Image1.Bitmap.SetSize(Round(Image1.Width), Round(Image1.Height)); 281 Image1.Bitmap.Clear(TAlphaColors.White); 282 end; 283 284 procedure TForm1.Image1Paint(Sender: TObject; Canvas: TCanvas; 285 const ARect: TRectF); 286 var 287 //图片 288 oBMP: TBitmap; 289 //路径 290 oPath: TPathData; 291 MyRect1, MyRect2: TRectF; 292 //多边形 293 p1, p2, p3, p4, p5, p6: TPointF; 294 MyPolygon: TPolygon; //System.Math.Vectors unit needed. 295 begin 296 //下面的代码是第二种方式,上面几个按钮事件是第一种方式。都可以 297 // //图片 298 // oBMP := TBitMap.Create; 299 // oBMP.LoadFromFile('....123.bmp'); 300 // //路径 301 // MyRect1 := TRectF.Create(90, 100, 230, 300); 302 // MyRect2 := TRectF.Create(70, 90, 220, 290); 303 // oPath := TPathData.Create(); 304 // oPath.AddEllipse(MyRect1); 305 // oPath.AddRectangle(MyRect2, 0, 0, AllCorners); 306 // //多边形 307 // p1 := TPointF.Create(80, 200); 308 // p2 := TPointF.Create(225, 30); 309 // p3 := TPointF.Create(370, 200); 310 // p4 := TPointF.Create(300, 340); 311 // p5 := TPointF.Create(150, 340); 312 // p6 := TPointF.Create(80, 200); 313 // 314 // SetLength(MyPolygon, 6); 315 // MyPolygon[0] := p1; 316 // MyPolygon[1] := p2; 317 // MyPolygon[2] := p3; 318 // MyPolygon[3] := p4; 319 // MyPolygon[4] := p5; 320 // MyPolygon[5] := p6; 321 // 322 // Canvas.Stroke.Kind := TBrushKind.bkSolid; 323 // Canvas.Stroke.Color := StrokeColor.Color; 324 // Canvas.Fill.Color := FillColor.Color; 325 // Canvas.Font.Size := 30; 326 // //画直线 327 // Canvas.DrawLine(ARect.Location, ARect.BottomRight, 1); 328 // //画矩形; 集合 TCorners: 四个角是否使用指定的样式类型; 枚举 TCornerType: 角样式类型 329 // Canvas.DrawRect(RectF(ARect.Width/4, ARect.Height/4, ARect.Width/4*2, ARect.Height/4*2), 0.5, 0.5, [TCorner.TopLeft], 1, TCornerType.Round); 330 // //画矩形边; 集合 TSides 指定要画的边 331 // Canvas.DrawRectSides(RectF(ARect.Width/3, ARect.Height/3, ARect.Width/3*4, ARect.Height/3*4), 0.5, 0.5,[TCorner.TopLeft], 1, [TSide.Left], TCornerType.Round); 332 // //画椭圆 333 // Canvas.DrawEllipse(RectF(ARect.Width/2, ARect.Height/2, ARect.Width/2*2, ARect.Height/2*2), 1); 334 // //画弧 335 // Canvas.DrawArc(ARect.TopLeft, ARect.BottomRight/2, 40, 40, 1); 336 // //画路径 337 // Canvas.DrawPath(oPath, 200); 338 // //画多边形 339 // Canvas.DrawPolygon(MyPolygon, 50); 340 // //图片 341 // Canvas.DrawBitmap(oBMP, 342 // RectF(0, 0, oBMP.Width, oBMP.Height), 343 // RectF(100, 100, 100 + oBMP.Width, 100 + oBMP.Height), 344 // 1); 345 346 // //填充矩形 347 // Canvas.FillRect(); 348 // //填充椭圆 349 // Canvas.FillEllipse(RectF(ARect.Width/2, ARect.Height/2, ARect.Width/2*2, ARect.Height/2*2), 1); 350 // //填充弧 351 // Canvas.FillArc(ARect.TopLeft, ARect.BottomRight/2, 40, 40, 1); 352 // //填充路径 353 // Canvas.FillPath(oPath, 200); 354 // //填充多边形 355 // Canvas.FillPolygon(MyPolygon, 50); 356 // //文本输出 357 // Canvas.FillText(ARect, 'TEST测试字符串', True, 1, [], TTextAlign.taLeading, TTextAlign.taCenter); 358 // oBMP.Free 359 end; 360 361 procedure TForm1.SetMYStyle; 362 begin 363 oStyle.StrokeColor := StrokeColor.Color; 364 oStyle.StrokeThickness := StrToInt(StrokeThickness.Text); 365 case StrokeCap.ItemIndex of 366 0: oStyle.StrokeCap := TStrokeCap.Flat; 367 1: oStyle.StrokeCap := TStrokeCap.Round; 368 end; 369 case StrokeDash.ItemIndex of 370 0: oStyle.StrokeDash := TStrokeDash.Solid; 371 1: oStyle.StrokeDash := TStrokeDash.Dash; 372 2: oStyle.StrokeDash := TStrokeDash.Dot; 373 3: oStyle.StrokeDash := TStrokeDash.DashDot; 374 4: oStyle.StrokeDash := TStrokeDash.DashDotDot; 375 5: oStyle.StrokeDash := TStrokeDash.Custom; 376 end; 377 case StrokeJoin.ItemIndex of 378 0: oStyle.StrokeJoin := TStrokeJoin.Miter; 379 1: oStyle.StrokeJoin := TStrokeJoin.Round; 380 2: oStyle.StrokeJoin := TStrokeJoin.Bevel; 381 end; 382 oStyle.FillColor := FillColor.Color; 383 oStyle.FontSize := StrToInt(FontSize.Text); 384 385 Image1.Bitmap.Canvas.Stroke.Kind := TBrushKind.bkSolid; 386 Image1.Bitmap.Canvas.Stroke.Color := oStyle.StrokeColor; 387 Image1.Bitmap.Canvas.Stroke.Thickness := oStyle.StrokeThickness; 388 Image1.Bitmap.Canvas.Stroke.Cap := oStyle.StrokeCap; 389 Image1.Bitmap.Canvas.Stroke.Dash := oStyle.StrokeDash; 390 Image1.Bitmap.Canvas.Stroke.Join := oStyle.StrokeJoin; 391 392 Image1.Bitmap.Canvas.Fill.Color := oStyle.FillColor; 393 Image1.Bitmap.Canvas.Font.Size := oStyle.FontSize; 394 Image1.Bitmap.Canvas.Font.Style := []; 395 end; 396 397 procedure TForm1.StrokeColorChange(Sender: TObject); 398 begin 399 SetMYStyle; 400 end; 401 402 end.