android - 如何生成像提供的图像中的clipPath
问题描述
我想生成一个小部件,它的剪贴路径与给定图像中的一样。我在这里谈论的是应用程序屏幕的白色部分,其中包含信息。
下面的代码是我在试验时尝试的,但失败了!
Path getClip(Size size) {
var path = new Path();
var controlpoint = Offset(10.0, size.height);
var endpoint = Offset(size.width / 2, size.height);
path.lineTo(0.0, size.height - 100);
path.quadraticBezierTo(
controlpoint.dx, controlpoint.dy, endpoint.dx, endpoint.dy);
path.lineTo(size.width, size.height);
path.lineTo(size.width, 0.00);
return path;
请帮我处理这段代码:)
编辑:我到了这部分,但我仍然卡住了:(
**Path getClip(Size size) {
final path = Path();
path.lineTo(size.width, 100);
path.lineTo(size.width, size.height);
path.lineTo(0.00, size.height);
path.close();
return path;
}**
及以上自定义clipPath,使用ClipRRect。
解决方案
最后,对代码进行了一些操作,最终得到以下输出:
Path getClip(Size size) {
final path = Path();
path.lineTo(20.0, 0.0);
path.lineTo(size.width, 120);
path.lineTo(size.width, size.height);
path.lineTo(0.00, size.height);
path.close();
return path;
添加了一个父母是这样的:
ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(25.0),
bottomLeft: Radius.circular(25.0),
),
child: ClipPath(
clipper: SinglePageClipper(),
child: Container(
color: Colors.red,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
SizedBox(
height: 400,
),
Center(child: Text('Demo Page'),)
],
),
),
),
),
我认为这是一些可以改进的事情,所以会尝试这样做。但与此同时,如果有人有更好的方法。请用知识启发我们,因为这对于像我这样的初学者来说更耗时。
推荐阅读
- php - Laravel\Passport\Client 返回空实例
- python - Python:从 long long long 字符串中获取子字符串
- mysql - 将存储为文本格式的列转换为 mySQL 中的日期:yyyy-mm-ddT00:00:00.000
- c# - 为什么我的 viewModel 对象返回 null?
- python - 如何在默认绑定到“Tab”键的python中取消绑定Ctrl-i
- c# - 以下代码片段的时间复杂度是多少?
- javascript - 使用服务工作者 Angular 限制 api 调用
- content-management-system - 如何连接 Algosec 和 servicenow?
- amazon-web-services - AWS CloudWatch 规则计划有不规则的时间间隔(不应该)
- java - 强制库 B 的版本匹配库 A 的传递依赖