Flutter 设计创作

Question

我是颤振新手，我想在颤振中创建像 SPEED HUMPS 这样的设计。但我不知道如何创建它请帮助我。

我尝试过设计。但我刚刚转了半圈，否则边线悬而未决。所以我需要进行完整的设计，请帮助我，下面是我的半轮代码。

---

设计成半圆形或/----------___

Answer 1

您可以使用此代码吗：

import 'package:flutter/material.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return MaterialApp(
  home: Scaffold(
    appBar: AppBar(
      title: Text('Speed Humps'),
    ),
    body: Center(
      child: SpeedHumps(),
        ),
      ),
    );
  }
}

class SpeedHumps extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
  height: 100.0,
  child: CustomPaint(
    painter: SpeedHumpsPainter(),
      ),
    );
   }
}

class SpeedHumpsPainter extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
final paint = Paint()
  ..color = Colors.yellow
  ..style = PaintingStyle.fill;

final path = Path();
path.moveTo(0, size.height / 2);
path.quadraticBezierTo(size.width / 4, size.height / 4, size.width / 2, size.height / 2);
path.quadraticBezierTo(3 * size.width / 4, 3 * size.height / 4, size.width, size.height / 2);
path.lineTo(size.width, size.height);
path.lineTo(0, size.height);
path.close();

canvas.drawPath(path, paint);
}

@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return false;
   }
 }