当前位置:首页 > 技术 > 正文内容

Android矢量图路径数据详解与绘图实践

访客 技术 2026年6月13日 1

矢量图形基础与<vector>标签结构

在Android中,<vector>标签用于定义可缩放的矢量图像资源,其本质是基于SVG(Scalable Vector Graphics)标准的XML描述。该格式支持高分辨率适配且文件体积小,特别适合图标和UI元素。

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">
    <path
        android:fillColor="#FF000000"
        android:pathData="M22,16V4c0,-1.1 -0.9,-2 -2,-2H8c-1.1,0 -2,0.9 -2,2v12c0,1.1 0.9,2 2,2h12c1.1,0 2,-0.9 2,-2z" />
</vector>

路径命令语法解析

路径数据由一系列指令组成,每个指令以字母开头,后接坐标参数。大小写决定坐标类型:

  • 大写字母:绝对坐标(相对于画布原点)
  • 小写字母:相对坐标(相对于上一个位置)

基本路径指令

  • M x y:移动画笔至坐标点 (x, y),作为后续绘制的起点。
  • L x y:从当前位置直线绘制到 (x, y)。
  • H x:水平移动至指定横坐标。
  • V y:垂直移动至指定纵坐标。
  • Z:闭合路径,连接起始点与终点。

贝塞尔曲线

  • C x1 y1 x2 y2 x y:三次贝塞尔曲线,通过两个控制点定义弯曲形状。
  • Q x1 y1 x y:二次贝塞尔曲线,仅需一个控制点。

对比说明:三次贝塞尔提供更精细的控制能力,而二次则更简洁。实际应用中可根据复杂度选择。

椭圆弧线命令 A

A rx ry x-axis-rotation large-arc-flag sweep-flag x y
  • rx, ry:椭圆在X轴和Y轴上的半径。
  • x-axis-rotation:椭圆主轴相对于水平方向的旋转角度。
  • large-arc-flag
    • 0:取较短弧段
    • 1:取较长弧段
  • sweep-flag
    • 0:逆时针绘制
    • 1:顺时针绘制

属性详解与高级用法

<path>标签支持多种样式控制属性:

  • android:fillColor:填充颜色,若未设置则无填充。
  • android:strokeColor:描边颜色。
  • android:strokeWidth:描边粗细。
  • android:trimPathStartandroid:trimPathEnd:截取路径起始与结束部分的比例(0~1)。
  • android:trimPathOffset:偏移截取区域,实现动画效果。
  • android:strokeLineCap:线帽样式,可选 butt(平头)、round(圆头)、square(方头)。
  • android:strokeLineJoin:线段连接方式,可选 miter(尖角)、round(圆角)、bevel(斜切)。
  • android:strokeMiterLimit:限制斜角长度,防止过长。

剪裁与分组管理

通过<group>可对多个<path>进行统一变换:

  • android:rotation:旋转角度。
  • android:pivotXandroid:pivotY:旋转/缩放参考点。
  • android:scaleXandroid:scaleY:缩放比例。
  • android:translateXandroid:translateY:位移偏移。

<clip-path>用于定义剪切区域,仅影响当前组及其子元素:

<clip-path android:pathData="M200,200 h200 v150 h-200 v-150" />

该设置将使图形只显示在指定矩形区域内。

视图配置与布局适配

<vector>根标签中的关键属性:

  • android:widthandroid:height:定义资源的固有尺寸(通常使用dp)。
  • android:viewportWidthandroid:viewportHeight:虚拟画布尺寸,所有路径坐标基于此单位。
  • android:tint:动态着色,可用于主题切换或状态变化。
  • android:autoMirrored:在RTL语言环境下自动镜像图像。
  • android:alpha:整体透明度设置。

通过合理组合这些特性,开发者可以构建出高度可定制、响应式且高性能的矢量图标系统。

标签: Android

相关文章

富文本里可以允许的 HTML 属性

一、所有标签默认允许的安全属性(极少)class        (可选)id           (通常建议禁用)title️ 注意:id 容易被滥用做锚点注入,很多系统直接禁用class 允许的话最好只允许固定前缀(如 editor-*)二、a 标签允许属性<a href="" t...

Mac 安装 Node.js 指南

方法一:通过官网安装包(最简单,适合初学者)如果你只是想快速安装并开始使用,这是最直接的方法。访问 Node.js 官网。页面会显示两个版本:LTS (Recommended For Most Users):长期支持版,最稳定。建议选这个。Current:最新特性版,包含最新功能但可能不够稳定。下载 .pkg 安装包并运行。按照安装向导点击“下一步”即可完成。方法二:使用 Homebrew 安装(...

Dom\HTML_NO_DEFAULT_NS 的副作用:自动加闭合标签

在使用Dom\HTMLDocument时,Dom\HTML_NO_DEFAULT_NS 将禁止在解析过程中设置元素的命名空间, 此设置是为了与DOMDocument向后兼容而存在的。当使用它时,已知的一个副作用就是:自动加闭合标签例如 </img> 为什么会这样?当你使用:Dom\HTML_NO_DEFAULT_NS文档会变成 无命名空间模式,此时内部更接近 XML...

Laravel 事件和监听器创建

在 Laravel 中,使用 Artisan 命令创建 Events(事件) 和 Listeners(监听器) 是非常高效的。你可以通过以下几种方式来实现:1. 手动创建单个 Event如果你只想创建一个事件类,可以使用 make:event 命令:Bashphp artisan make:event UserRegistered执行后,文件将生成在 app/Even...

自定义域名解析神器 dnsmasq

什么是 dnsmasq?dnsmasq 是一个轻量级、功能强大的网络服务工具,专为小型和中等规模网络设计。它是一个综合的网络基础设施解决方案[1]。dnsmasq 能做什么?功能说明应用场景DNS 转发与缓存将 DNS 查询转发到上游服务器(ISP、Google DNS 等),并在本地缓存结果加快 DNS 查询速度,减少外部 DNS 流量本地 DNS解析本地网络设备的主机名,无需编辑&n...

linux screen 用法详情 (nohup 的替代方案)

一、screen 是什么?能干嘛?screen 是一个终端复用器,可以:在一个 SSH 会话中开多个“虚拟终端”SSH 断线后,程序仍然在后台运行随时重新连接到原来的会话特别适合:nohup 的替代方案跑脚本 / 爬虫 / 训练模型运维、远程开发二、安装 screen# CentOS / Rocky / Almayum install -y screen# Debian / Ubuntuapt i...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。