当前位置: 首页 > news >正文

flutter 绘制右上角圆角三角形标签

在这里插入图片描述
绘制:

import 'package:jade/utils/JadeColors.dart';
import 'package:flutter/material.dart';
import 'dart:math' as math;class LabelTopRightYellow extends StatefulWidget {final String labelTitle; // 只能两个字的(文字偏移量没有根据文字长度改变)const LabelTopRightYellow({ this.labelTitle});State<StatefulWidget> createState() {return LabelViewState();}
}class LabelViewState extends State<LabelTopRightYellow> with SingleTickerProviderStateMixin {Widget build(BuildContext context) {return CustomPaint(painter: ArcPainter(labelTitle: widget.labelTitle),size: Size(35,35), // 调整大小以适应你的需求);}
}class ArcPainter extends CustomPainter {//标签文字String labelTitle;ArcPainter({this.labelTitle});void paint(Canvas canvas, Size size) {double originX = 0.0 ;double originY = 0.0 ;double cx = size.width / 2;double cy = size.height / 2;Paint _paint = Paint()..color = Color(0xffFFE50F)..strokeWidth = 2//画笔是线段(默认是fill填充)/*..style = PaintingStyle.stroke*/;// canvas.drawCircle(Offset(cx,cy), 2, _paint);Path path = Path();// 绘制圆锥路径 权重越大路径越接近直角(不使用path.moveTo时,默认起点为左上角)path.conicTo(originX + size.width, originY, originX + size.width, originY+ size.height, 10);// 控制路径是否闭合,可不写path.close();canvas.drawPath(path, _paint);canvas.save();canvas.restore();TextPainter textPainterCenter = TextPainter(text: TextSpan(text: labelTitle, style: TextStyle(color: Color(0xff333333),fontSize: 10)),textDirection: TextDirection.ltr,);textPainterCenter.layout();canvas.rotate(math.pi / 4);canvas.translate(-math.pi , -((cy - math.pi)  * 2));textPainterCenter.paint(canvas, Offset(cx /*- textPainterCenter.size.width / 2*/,cy - textPainterCenter.size.height / 4));canvas.save();canvas.restore();}/// 度数转类似于π的那种角度double degToRad(double deg) => deg * (math.pi / 180.0);bool shouldRepaint(covariant CustomPainter oldDelegate) {return true;}
}

引用:

Container(height: 180.wmargin: EdgeInsets.symmetric(horizontal: 20.w),padding: EdgeInsets.only(left: 20.w),decoration: BoxDecoration(color: Colors.white,borderRadius: BorderRadius.circular(8),boxShadow: [BoxShadow(color: JadeColors.grey_4,blurRadius: 2.0,offset: Offset(0.0, 0.0),)]),child: Column(children: [_userView(),SizedBox(height: 20.w),_productView(),_countdownView()],),)
_userView(){return Stack(alignment: Alignment.topRight,children: [Row(children: [Container(width: 70.w,height: 70.w,margin: EdgeInsets.only(right: 20.w),child: Utils().roundedImage(PathConfig.testImageUrl[3], 70),),Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start,children: [Text('商户商户商户商户',style: TextStyle(fontSize: 30.sp,color: JadeColors.grey_2,fontWeight: FontWeight.w600),maxLines: 1,overflow: TextOverflow.ellipsis,),Text('10分钟前',style: TextStyle(fontSize: 22.sp,color: JadeColors.grey))],))],),LabelTopRightYellow(labelTitle: S.current.cuxiao,)],);}
http://www.lryc.cn/news/232521.html

相关文章:

  • C/C++输出整数部分 2021年12月电子学会青少年软件编程(C/C++)等级考试一级真题答案解析
  • 通过20天预测7天
  • 【python】均值、中值和高斯滤波详解和示例
  • 基于STM32的循迹小车项目实战
  • Element UI 偶发性图标乱码问题
  • UniApp中的数据存储与获取指南
  • VUE基础的一些实战总结
  • 【算法】算法题-20231117
  • 轮播图(多个一起轮播)
  • OpenCV中的像素重映射原理及实战分析
  • 如何快速搭建Spring Boot接口调试环境并实现公网访问
  • 简单的用Python实现一下,采集某牙视频,多个视频翻页下载
  • 【手撕数据结构】二分查找(好多细节)
  • Python+Selenium WebUI自动化框架 -- 基础操作封装
  • PyCharm 【unsupported Python 3.1】
  • flutter TabBar指示器
  • PDF/X、PDF/A、PDF/E:有什么区别,为什么有这么多格式?
  • Microsoft发布了一份关于其产品安全修复的 11 月报告。
  • 12v24v60v高校同步降压转换芯片推荐
  • pip 问题
  • 云计算(一):弹性计算概述
  • Qt/C++ 获取QProcess启动的第三方软件的窗体标题
  • Borland编辑器DOS系统快捷键应用
  • KeyarchOS的CentOS迁移实践:使用操作系统迁移工具X2Keyarch V2.0
  • Golang抓包:实现网络数据包捕获与分析
  • 分类预测 | Matlab实现QPSO-SVM、PSO-SVM、SVM多特征分类预测对比
  • kubernetes部署jenkins
  • Node.js详解
  • v-html命令渲染的内容,使用scoped属性的情况下,样式不起作用
  • 浅谈vue2.0和vue3.0的区别