zoukankan      html  css  js  c++  java
  • Flutter 动画设置贝塞尔曲线

    废话不多说直接上源码

    import 'package:flutter/cupertino.dart';
    import 'package:flutter/material.dart';


    class FixedServiceView extends StatefulWidget{
    FixedServiceView({ this.sctrollController }) : super();
    ScrollController sctrollController = new ScrollController();

    @override
    _FixedServiceView createState() {
    return _FixedServiceView();
    }

    }

    class _FixedServiceView extends State<FixedServiceView>{
    // 滚动视图
    ScrollController _sctrollController = new ScrollController();

    @override
    void initState() {
    // TODO: implement initState
    super.initState();
    setState(() {
    _sctrollController = widget.sctrollController;
    });
    }

    @override
    Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;
    final width = size.width;

    return Container(
    margin: new EdgeInsets.fromLTRB(0, 0, 0, 10),
    width,
    height: 180,
    alignment: Alignment.center,
    color: Colors.transparent,
    child: CurveWidget(sctrollController: _sctrollController),
    );
    }
    }

    // 自定义曲线视图
    class CurveWidget extends StatefulWidget{
    ScrollController sctrollController = new ScrollController();
    CurveWidget({this.sctrollController}) : super();

    @override
    _CurveWidget createState() {
    return _CurveWidget();
    }
    }

    class _CurveWidget extends State<CurveWidget> {
    ScrollController _sctrollController = new ScrollController();
    double _offsetY = 60;
    @override
    void initState() {
    // TODO: implement initState
    super.initState();
    setState(() {
    _sctrollController = widget.sctrollController;
    _sctrollController.addListener(() {
    setState(() {
    var tempOffsetY = 60 - _sctrollController.offset;
    if (tempOffsetY > 60) {
    tempOffsetY = 60;
    }else if (tempOffsetY < 0) {
    tempOffsetY = 0;
    }
    _offsetY = tempOffsetY;
    });
    });
    });
    }

    @override
    Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;
    final width = size.width;
    return Container(
    width,
    height: 180,
    color: Colors.transparent,
    child: CustomPaint(foregroundPainter: BezierPainter(offsetY: _offsetY),),
    );
    }
    }

    // 曲线路径
    class BezierPainter extends CustomPainter {
    double offsetY;

    BezierPainter({ this.offsetY });

    @override
    void paint(Canvas canvas, Size size) {
    // TODO: implement paint
    final paint = Paint();
    paint.color = Colors.white;
    paint.style = PaintingStyle.fill;
    var path = Path();
    // 原点 p1
    path.moveTo(0, 0);
    //第2个点
    var controlPoint = Offset(size.width / 2, offsetY);
    var ednPoint = Offset(size.width, 0);
    path.quadraticBezierTo(
    controlPoint.dx,
    controlPoint.dy,
    ednPoint.dx,
    ednPoint.dy
    );
    //第3个点
    path.lineTo(size.width, size.height);
    //第4个点
    path.lineTo(0, size.height);
    path.lineTo(0, 0);
    path.close();
    canvas.drawPath(path, paint);
    }

    @override
    bool shouldRepaint(CustomPainter oldDelegate) {
    // TODO: implement shouldRepaint
    return true;
    }
    }

  • 相关阅读:
    每个Java开发人员都应该知道的4个Spring注解
    JVM中的动态语言支持简介
    深入探索Java设计模式(五)之构建器模式
    Java——MVC模式
    程序出了问题,报错只能参考
    查看电脑端口占用情况
    Java——参数传递
    Python——关于定义过程
    Java——super的使用
    关于如何查看论文是否被SCI或者EI收录
  • 原文地址:https://www.cnblogs.com/diweinan/p/13517134.html
Copyright © 2011-2022 走看看