我正在嘗試像這樣在顫動中構建一個票形容器：
我正在嘗試使用 ClipPath 小部件，但我不知道如何正確設定路徑。
uj5u.com熱心網友回復：
您可以使用 aCustomeClipper或 aStack來獲得此票證形狀。請參閱以下代碼以使用 Stack 獲取此形狀：
Stack(
alignment: Alignment.center,
children: [
Container(
height: 100,
width: 200,
color: Colors.black,
),
Positioned(
left: -5,
child: Container(
height: 20,
width: 20,
decoration: const BoxDecoration(
color: Colors.white,
shape: BoxShape.circle
),
)),
Positioned(
right: -5,
child: Container(
height: 20,
width: 20,
decoration: const BoxDecoration(
color: Colors.white,
shape: BoxShape.circle
),
)),
],
)
輸出：
uj5u.com熱心網友回復：
試試下面的代碼希望它對你有幫助。參考
參考其他包fw_ticket , ticketview
uj5u.com熱心網友回復：
我最終通過以下方式完成了這項作業：https ://www.flutterclutter.dev/flutter/tutorials/how-to-cut-a-hole-in-an-overlay/2020/510/
class SCticketShape extends StatelessWidget {
const SCticketShape({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return ClipPath(
clipper: CustomTicketShape(),
child: Container(
color: Colors.lightBlue,
height: 0.3.sh,
width: 0.9.sw,
),
);
}
}
class CustomTicketShape extends CustomClipper<Path> {
@override
Path getClip(Size size) {
final path = Path();
path.addRRect(
RRect.fromRectAndRadius(
Rect.fromLTWH(0, 0, size.width, size.height),
Radius.circular(8)));
path.addOval(
Rect.fromCircle(
center: Offset(0, (size.height/3) *1.8),
radius: 15));
path.addOval(
Rect.fromCircle(
center: Offset(size.width, (size.height/3) *1.8),
radius: 15));
path.fillType = PathFillType.evenOdd;
return path;
}
@override
bool shouldReclip(CustomClipper oldClipper) {
return true;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/440010.html
標籤：扑
下一篇：文本從容器的頂部邊框被剪裁