如何将ClipPatch放置在屏幕底部

时间:2020-11-04 11:54:14

标签: flutter

我已经实现了渲染我一直在寻找屏幕顶部的ClipPath。我现在想做的是像“镜面效果”一样在屏幕底部显示倒置的剪切路径,但我无法实现。

这是我的代码:

    return Stack(
      children: <Widget>[
        ClipPath(
          clipper: AddInformationClipper(),
          child: Container(
            decoration: BoxDecoration(color: TheBaseColors.lightGreen),
          ),
        ),
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Container(
              child: Stack(
                children: <Widget>[
                  Container(
                    padding: EdgeInsets.fromLTRB(15.0, 50.0, 0.0, 0.0),
                    child: Text('This is',
                        style: TextStyle(
                            fontSize: 30.0, fontWeight: FontWeight.bold)),
                  ),
                  Container(
                    padding: EdgeInsets.fromLTRB(60.0, 80.0, 0.0, 0.0),
                    child: Text('Your information',
                        style: TextStyle(
                            fontSize: 30.0, fontWeight: FontWeight.bold)),
                  ),
                  Container(
                    padding: EdgeInsets.fromLTRB(300.0, 35.0, 0.0, 0.0),
                    child: Text('.',
                        style: TextStyle(
                            fontSize: 80.0,
                            fontWeight: FontWeight.bold,
                            color: TheBaseColors.lightGreen)),
                  )
                ],
              ),
            ),
            //TEXTFIELDS SHOULD GO HERE
           Center(child: TextFormProfile()),
          ],
        ),

      ],
    );
  }
}

class AddInformationClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    var path = Path();
    path.moveTo(0, size.height / 4);
    path.lineTo(size.width - 40, 0);
    path.lineTo(0, 0);
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}

我需要在屏幕底部添加另一个Clippath,这是相反的。

0 个答案:

没有答案