有幾款flutter的裁剪插件,但它們只能裁剪成矩形、方形或橢圓形。我需要裁剪一個特定的物件(例如:只裁剪照片中的一個動物而不裁剪其背景)。這與Photoshop的 "套索選擇工具或磁性套索工具 "非常相似。
Flutter中是否有這樣的插件?我在pub.dev中搜索了一下,但是沒有找到。
uj5u.com熱心網友回復:
Flutter有一個ClipPath()部件,可以用一個結構化的路徑(比如Photoshop path layer->創建矢量蒙版,或者用套索工具畫一個路徑并剪下圖片)來剪輯一個孩子。你可以讓Container()包含一個背景圖片,然后用ClipPath()夾住它,
。//in your build()
ClipPath(
clipper: MyClipperPath(), //你可以傳入你自己的args如果你想的話。
孩子。容器()
裝飾。BoxDecoration(
影像。裝飾圖片(
影像。//你的影像 - AssetImage(), NetworkImage() etc.。
適合。BoxFit.fill, /or whatever BoxFit you want。
)
)
)
)
然后在你的widget類外
class MyClipperPath extends CustomClipper< Path> {
MyClipperPath()。
Path getClip(Size size) {
//size.height和size.width是你孩子的寬度和高度。上面的容器()
Path = Path();
path.moveTo(0,0) 。
path.lineTo(size.width,0)。
path.lineTo(size.width/3, size.height/3)。
path.lineTo(0,size.height)。
path.close()。
return path。
}
上面的路徑是一個類似L的形狀。改變lineTo的值,你會看到剪裁路徑在螢屏上的更新。
路徑類有一堆方法來創建線條和曲線,包括多種貝塞爾線段型別的方法,這就是你用來復制路徑或Photoshop中套索工具定義任意形狀的方法。
<
下面是我在應用程式中使用的一個 CustomClipper 物件。它在一個盒子上創建了一個 S 形邊緣。
class TabClipper extends CustomClipper< Path> {
final double radius;
const TabClipper([this.radius = 0] )。
@override.
Path getClip(Size size) {
double _radius = radius;
if(_radius==0) _radius = size.height * 16 / 57;
final path = Path();
path.arcToPoint(Offset(_radius,_radius), radius: Radius.round(_radius*0.95),旋轉。90.0)。
path.lineTo(_radius, size.height - _radius);
path.arcToPoint(Offset(_radius*2,size.height), radius: Radius.round(_radius*0.95),rotation: 90.0, clockwise: false)。)
path.lineTo(size.width, size.height)。
path.lineTo(size.width, 0.0)。
path.close()。
return path。
}
@override
bool shouldReclip(CustomClipper oldClipper) {return false; }
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/329333.html
標籤:
