2

我想用 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

4

0 回答 0