69 lines
1.8 KiB
Plaintext
69 lines
1.8 KiB
Plaintext
import { UIView } from "UIKit";
|
||
import { SVGKFastImageView, SVGKImage } from "SVGKit";
|
||
|
||
/**
|
||
* CoolSvg iOS 平台 SVG 渲染器
|
||
* - 本地文件路径
|
||
*/
|
||
export class CoolSvg {
|
||
/** uni-app x 原生视图元素 */
|
||
$element: UniNativeViewElement;
|
||
/** iOS SVGKFastImageView 实例 */
|
||
imageView: SVGKFastImageView | null = null;
|
||
|
||
/**
|
||
* 构造函数
|
||
* @param element uni-app x 原生视图元素
|
||
*/
|
||
constructor(element: UniNativeViewElement) {
|
||
this.$element = element;
|
||
|
||
// 创建占位符 SVG 图像
|
||
let placeholderImage = SVGKImage((contentsOf = URL((fileURLWithPath = ""))));
|
||
// 初始化 SVG 图像视图
|
||
this.imageView = new SVGKFastImageView((svgkImage = placeholderImage));
|
||
// 将视图绑定到 uni-app x 元素
|
||
this.$element.bindIOSView(this.imageView!);
|
||
}
|
||
|
||
/**
|
||
* 加载并渲染 SVG
|
||
* @param src SVG 数据源
|
||
* @param color 填充颜色,用于替换 SVG 中 path 元素的 fill 属性
|
||
*/
|
||
load(src: string, color: string) {
|
||
// 空字符串检查
|
||
if (src == "") {
|
||
return;
|
||
}
|
||
|
||
try {
|
||
// 从资源路径加载 SVG 图像
|
||
let svgImage = SVGKImage(
|
||
(contentsOf = URL((fileURLWithPath = UTSiOS.getResourcePath(src))))
|
||
);
|
||
|
||
// 加载失败检查
|
||
if (svgImage == null) {
|
||
return;
|
||
}
|
||
|
||
// 设置 SVG 图像到视图
|
||
this.imageView!.image = svgImage;
|
||
|
||
// 应用颜色覆盖
|
||
if (color != "") {
|
||
// 创建颜色覆盖层视图
|
||
let colorView = new UIView();
|
||
colorView.frame = this.imageView!.bounds;
|
||
colorView.backgroundColor = UTSiOS.colorWithString(color);
|
||
// 设置合成滤镜为 sourceAtop,实现颜色覆盖效果
|
||
colorView.layer.compositingFilter = "sourceAtop";
|
||
this.imageView!.addSubview(colorView);
|
||
}
|
||
} catch (e) {
|
||
// 静默处理异常,避免影响应用运行
|
||
}
|
||
}
|
||
}
|