手写SVG图片

有时候QT中可能会需要一些简单的SVG图片,但是网上的质量参差不齐,想要满意的SVG图片,我们可以尝试直接手写的方法.

新建文本文档,将以下代码复制进去,修改后缀名为.svg,保存

cpp 复制代码
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" height="128" width="128" viewBox="0 0 158 158">
  <g>
    <path id="path1" transform="rotate(0,64,64) translate(1.6,1.6) scale(3.9,3.9)" fill="#000000" d="M0,2L2,0 17,15 32,0 34,2 19,17 34,32 32,34 17,19 2,34 0,32 15,17z" />
  </g>
</svg>

效果是这样,我们通过类似写代码的方式得到了一个"X"的SVG图片:

如果我们想要修改颜色,就可以修改这里fill="#000000" ,换成你想要的颜色

想要花其他的图形,可以修改这里d="M0,2L2,0 17,15 32,0 34,2 19,17 34,32 32,34 17,19 2,34 0,32 15,17z

这个意思其实是确定一些点,让系统沿着这些点画线(L指画线),这段的意思是沿着(0,2)、(2,0)、(17,15)、(32,0)、(34,2)、(19,17)、(34,32)、(32,34)、(17,19)、(2,34)、(0,32)、(15,17)这些点,用颜色黑色fill="#000000来填充闭合的路径,因为这个"X"是有宽度的,所以描点的时候要注意把宽度考虑进去.这里只是展示了最简单的画线,还有很多其他的绘制读者可以自行去了解.

相关推荐
AI_零食11 小时前
开源鸿蒙跨平台Flutter开发:昼夜节律与睡眠相位-脑电波周期与最佳苏醒测绘架构
flutter·ui·华为·架构·开源·harmonyos·鸿蒙
stevenzqzq11 小时前
推荐页核心 UI 实现逻辑说明
ui
AI_零食11 小时前
Flutter 框架跨平台鸿蒙开发 - 自定义式按钮设计应用
学习·flutter·ui·华为·harmonyos·鸿蒙
千百元12 小时前
codex 中使用 ui-ux-pro-max-skill
ui·ux
ada0_ada114 小时前
qt模块学习记录
开发语言·qt·学习
knighthood200115 小时前
Qt5.15+VTK9.3.0实现点云点选功能
开发语言·qt
samroom16 小时前
【鸿蒙应用开发 Dev ECO Studio 5.0版本】从0到1!从无到有!最全!计算器------按钮动画、滑动退格、中缀表达式转后缀表达式、UI设计
数据结构·ui·华为·typescript·harmonyos·鸿蒙
xyx-3v16 小时前
qt创建新工程
开发语言·c++·qt
大神的风范17 小时前
QT部署YOLO11实时检测
驱动开发·深度学习·qt·目标检测·计算机视觉
cpp_learner17 小时前
Linux ARM架构 使用 linuxdeployqt 打包QT程序
qt