zoukankan      html  css  js  c++  java
  • flutter-贝塞尔曲线

    import 'package:flutter/material.dart';
    
    class HomePage extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Column(
            children: <Widget>[
              ClipPath(
                clipper: BottomClipper(),//路径
                child: Container(
                  color: Colors.deepOrange,
                  height: 200,
                ),
              )
            ],
          ),
        );
      }
    }
    
    class BottomClipper extends CustomClipper<Path>{
      @override
      Path getClip(Size size) {
        var path=Path();
        path.lineTo(0, 0);
        path.lineTo(0, size.height-30);
        var firstControlPoint =Offset(size.width/2,size.height);
        var firstEndPoint = Offset(size.width,size.height-30);
         path.quadraticBezierTo(firstControlPoint.dx, firstControlPoint.dy, firstEndPoint.dx, firstEndPoint.dy);
        path.lineTo(size.width, size.height-30);
        path.lineTo(size.width, 0);
        return path;
      }
    
      @override
      bool shouldReclip(CustomClipper<Path> oldClipper) {
        return false;
      }
    }

    双曲线

    import 'package:flutter/material.dart';
    
    class HomePage extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Column(
            children: <Widget>[
              ClipPath(
                clipper: BottomClipper(),//路径
                child: Container(
                  color: Colors.deepOrange,
                  height: 200,
                ),
              )
            ],
          ),
        );
      }
    }
    
    class BottomClipper extends CustomClipper<Path>{
      @override
      Path getClip(Size size) {
        var path=Path();
        path.lineTo(0, 0);
        path.lineTo(0, size.height-20);
        path.lineTo(0, size.height-20);
          var firstControlPoint =Offset(size.width/4,size.height);
          var firstEndPoint = Offset(size.width/2.25,size.height-30);
    
          path.quadraticBezierTo(firstControlPoint.dx, firstControlPoint.dy, firstEndPoint.dx, firstEndPoint.dy);
    
          var secondControlPoint = Offset(size.width/4*3,size.height-80);
          var secondEndPoint = Offset(size.width,size.height-40);
    
          path.quadraticBezierTo(secondControlPoint.dx, secondControlPoint.dy, secondEndPoint.dx, secondEndPoint.dy);
    
        path.lineTo(size.width, size.height-40);
        path.lineTo(size.width, 0);
    
        return path;
      }
    
      @override
      bool shouldReclip(CustomClipper<Path> oldClipper) {
        return false;
      }
    }

  • 相关阅读:
    recurse_array_change_key_case()递规返回字符串键名全为小写或大写的数组
    php循环创建目录
    ajaxFileUpload增加附加参数
    dedecms5.7 联动类型无法显示
    一些比较隐秘的OJ的网址
    Emacs 配置
    qwq
    233
    [八省联考2018]林克卡特树lct
    [APIO2014]序列分割
  • 原文地址:https://www.cnblogs.com/lxz-blogs/p/13235926.html
Copyright © 2011-2022 走看看