我想用 Flutter 中的 CustomPainter 创建一个自定义底部应用栏:我已经尝试了下面的代码,但没有给我想要的结果:
我想要这样的东西: 半径容器
从我的容器小部件:
Container(
height: ConfigSize.screenHeight * 0.15,
width: ConfigSize.screenWidth,
decoration: BoxDecoration(
color: CustomColor.white,
borderRadius: BorderRadius.vertical(
top: Radius.circular(CustomRadius.appbarradius),
),
),
),
import 'package:flutter/material.dart';
class Chevron extends CustomPainter {
@override
void paint(Canvas canvas, Size size) {
var paint = Paint();
paint.color = Colors.white;
Path path = Path();
path.moveTo(0, size.height * 0.5);
path.quadraticBezierTo(0, size.height * 0.15, size.width * 0.2, 0);
path.lineTo(size.width * 0.36, 0);
path.quadraticBezierTo(
size.width * 0.5, size.height * 0.95, size.width * 0.65, 0);
path.quadraticBezierTo(size.width*0.99, 0, size.width, size.height * 0.65);
//path.lineTo(size.width, 0);
path.lineTo(size.width, size.height);
path.lineTo(0, size.height);
path.close();
canvas.drawPath(path, paint);
}
@override
bool shouldRepaint(CustomPainter oldDelegate) => false;
}
注意:我想要自定义容器,例如带有自定义画家的图像,无需使用 BottomAppBar 小部件或 FloatingActionButton