在Flutter中，繪圖需要用到?CustomPaint?和?CustomPainter，?CustomPainter可理解為畫板，承載畫布，CustomPaint可理解為畫布，承載繪制的具體內(nèi)容。

畫布（Canvas）顧名思義就是用來在上面畫圖形，如繪制點(diǎn)、線、路徑、矩形、圓形、以及添加圖像等。

畫筆（Paint）用來決定在畫布上繪制圖形的顏色、粗細(xì)、是否抗鋸齒、筆觸形狀以及作畫風(fēng)格等等。

基本圖片包括點(diǎn)、線、矩形（正方形、長(zhǎng)方形）、弧、橢圓等等，繪制功能需要結(jié)合CustomPaint 和 CustomPainter來實(shí)現(xiàn)。

通過canvas畫布的方法drawRect可以用來繪制矩形，如下圖所示是繪制的一個(gè)矩形：

核心實(shí)現(xiàn)代碼如下：

繪制矩形的核心內(nèi)容主要是創(chuàng)建Rect矩形，方式二是通過Rect的靜態(tài)方法fromLTWH根據(jù)設(shè)置左上角的點(diǎn)與矩形寬高來繪制，坐標(biāo)分析如圖所示，這樣創(chuàng)建出來的矩形實(shí)際width為參數(shù)三配置的值150，height為參數(shù)四配置的值100，代碼如下：

方式三是通過Rect的靜態(tài)方法fromCircle根據(jù)圓形來繪制正方形，如下圖所示，這里參考的圓形為所要繪制的正方形的內(nèi)切圓，代碼實(shí)現(xiàn)如下：

方式四是通過Rect的靜態(tài)方法fromCenter根據(jù)中心點(diǎn)來繪制矩形，如下圖所示，代碼如下：

方式五是通過Rect的靜態(tài)方法fromPoints來創(chuàng)建矩形，fromPoints需要兩個(gè)點(diǎn)，矩形的左上角的點(diǎn)與右下角的點(diǎn)：

通過canvas的drawRRect方法來繪制圓角矩形，如下圖所示，是繪制圓角矩形，基本使用代碼如下：

創(chuàng)建圓角矩形的方法RRect.fromLTRBXY最后兩個(gè)參數(shù)radiusX與radiusY，是用來設(shè)置圓角的兩個(gè)半徑的，如下圖所示的圓角半徑分析圖。