SVG控件
# Smart 控件使用(SVG)
以下组中包含用于显示SVG图形相关的控件。
# 1. TRSSVGDocument
此控件为SVG图形的显示控件提供访问库。可通过在此控件的FileName
属性中指定SVG文件的目录地址,或者在Lines
属性中引入SVG文本来实现引入的功能。
# 1.1. 属性
属性 | 功能说明 |
---|---|
DefaultAspectRatio | 定义 SVG 的默认纵横比。如果 SVG 中未使用preserveAspectRatio 属性对纵横比进行指定,则 SVG 将使用此默认值的纵横比来显示图形。 |
DefaultColorInterpolation | 设定SVG图形使用的默认颜色插值算法类型,可使用渐变颜色插值或者Alpha通道合成颜色空间 |
DefaultColorRendering | 指定SVG图形默认的颜色渲染类型,向SVG库提供有关如何优化其颜色插值和合成操作的提示 |
DefaultShapeRendering | 默认形状渲染类型,它向 SVG 库提供了有关在渲染矢量图形元素(例如路径元素)和基本形状(例如圆形和矩形)时要进行哪些权衡的提示 |
DefaultTextRendering | 默认文本渲染类型,它向 SVG 库提供有关在渲染文本时进行哪些权衡的提示 |
DPI | 用于计算将字符串长度转换为实际值的单位系数的每英寸点数,DPI 应该在加载 SVG 之前设置。例如,如果输入字符串包含“1cm”,则 DPI 可帮助 SVG 库计算出一厘米有多大 |
EmbedSVGAsBinary | 是否将SVG文档作为二进制嵌入到表单中。将 EmbedSVGABinary 设置为 true 以将 SVG 作为二进制嵌入到表单中。 与使用 RSSVGCtrls.TRSSVGDocument.Lines 属性或从文件加载 SVG 相比,将 SVG 嵌入为二进制通常允许更快的表单初始化 |
Filename | 定义要在设计时和运行时加载的 SVG 文档的文件名。使用 RSSVGCtrls.TRSSVGDocument.EmbedSVGABinary 属性将 SVG 作为二进制数据嵌入到表单中。使用 RSSVGCtrls.TRSSVGDocument.Lines 属性将 SVG 作为 XML 文本加载和嵌入 |
Lines | 定义要加载的 SVG 的 XML 文本。 使用 RSSVGCtrls.TRSSVGDocument.EmbedSVGABinary 属性将 SVG 作为二进制数据嵌入到表单中。使用 RSSVGCtrls.TRSSVGDocument.Lines 属性将 SVG 作为 XML 文本加载和嵌入 |
Options | 定义用于读取、显示和写入文档的选项 |
PreferredLanguage | 指定用于 SVG 的首选语言。 |
# 1.1.1. DefaultAspectRatio
property DefaultAspectRatio: TSVGPreserveAspectRatio;
定义 SVG 的默认纵横比。如果 SVG 中未使用preserveAspectRatio
属性对纵横比进行指定,则 SVG 将使用此默认值的纵横比来显示图形。其中使用到的属性如下:
- Align:指示是否强制统一缩放。有以下类型的选项:
saNone
:不使用强制统一缩放。saXMaxYMax
:使用强制统一缩放。将元素viewBox
的<min-x>+<width>
取值与控件可视窗口的最大值X对齐。将元素viewBox
的<min-y>+<height>
取值与控件可视窗口的最大值Y对齐。saXMaxYMid
:使用强制统一缩放。将元素viewBox
的<min-x>+<width>
取值与控件可视窗口的最大值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的中点Y值对齐。saXMaxYMin
:使用强制统一缩放。将元素viewBox
的<min-x>+<width>
取值与控件可视窗口的最大值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的最小值Y对齐。saXMidYMax
:使用强制统一缩放。将元素viewBox
的中点X值与控件可视窗口中的中点X值对齐。将元素viewBox
的<min-y>+<height>
取值与控件可视窗口的最大值Y对齐。saXMidYMid
:使用强制统一缩放。将元素viewBox
的中点X值与控件可视窗口中的中点X值对齐。将元素viewBox
的中点Y值与控件可视窗口中的中点Y值对齐。saXMidYMin
:使用强制统一缩放。将元素viewBox
的中点X值与控件可视窗口中的中点X值对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的最小值Y对齐。saXMinYMax
:使用强制统一缩放。将元素viewBox
的<min-x>
取值与控件可视窗口的最小值X对齐。将元素viewBox
的<min-y>+<height>
取值与控件可视窗口的最大值Y对齐。saXMinYMid
:使用强制统一缩放。使用强制统一缩放。将元素viewBox
的<min-x>
取值与控件可视窗口的最小值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的中点Y值对齐。saXMinYMin
:使用强制统一缩放。使用强制统一缩放。将元素viewBox
的<min-x>
取值与控件可视窗口的最小值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的最小值Y对齐。
- Defer:设置纵横比与 TSVGImage 元素一起使用时的效果。 如果此项属性设置为 true,则会使用SVG中定义的
preserveAspectRatio
属性(如果存在)。 如果引用的SVG中缺少preserveAspectRatio
属性的值,则按照正常的其他规则来处理preserveAspectRatio
属性(即忽略Defer
属性的设置)。 对于其他SVG元素上的preserveAspectRatio
,不会使用此属性。 - Slice:设置图形是否为拉伸覆盖。
# 1.1.2. DefaultColorInterpolation
property DefaultColorInterpolation: TSVGColorInterpolation;
设定SVG图形使用的默认颜色插值算法类型,可使用渐变颜色插值或者Alpha通道合成颜色空间。有以下选项可选择:
名称 | 说明 |
---|---|
sciAuto | 表示用户可以选择sRGB或linearRGB的颜色空间进行颜色插值。 此选项表示不需要指定特定的颜色空间中进行颜色插值 |
sciLinearRGB | 指定在linearRGB颜色空间中进行颜色插值 |
sciNone | 不使用颜色空间插值 |
sciSRGB | 指定在sRGB颜色空间中进行颜色插值 |
# 1.1.3. DefaultColorRendering
property DefaultColorRendering: TSVGColorRendering;
默认颜色渲染类型,它向 SVG 库提供有关如何优化其颜色插值和合成操作的提示,有以下选项可选择。
名称 | 说明 |
---|---|
clrnAuto | 自动选择,以平衡颜色渲染速度和质量,两者之间会偏向注重质量 |
clrnNone | 不设定颜色渲染类型 |
clrnOptimizeQuality | 更加注重颜色渲染的质量而不是渲染速度 |
clrnOptimizeSpeed | 更加注重渲染速度而非质量 |
# 1.1.4. DefaultShapeRendering
property DefaultShapeRendering: TSVGShapeRendering;
指定默认形状渲染类型,它向 SVG 库提供了在渲染矢量图形元素(例如路径元素)和基本形状(例如圆形和矩形)时要进行哪些权衡的提示。
名称 | 说明 |
---|---|
srnAuto | 进行适当的权衡以平衡速度、边缘清晰度和几何精度,但几何精度比速度和边缘清晰度更重要 |
srnCrispEdges | 更加注重边缘清晰度,而不是渲染速度和几何精度 |
srnGeometricPrecision | 更加注重几何精度,而不是速度和边缘清晰度 |
srnNone | 无特别权衡的项目 |
srnOptimizeSpeed | 更加注重渲染速度,而不是几何精度、边缘清晰度,无抗锯齿 |
# 1.1.5. DefaultTextRendering
property DefaultTextRendering: TSVGTextRendering;
默认文本渲染类型,它向 SVG 库提供有关在渲染文本时进行哪些权衡的提示。
名称 | 说明 |
---|---|
txrnAuto | 进行适当的设置以平衡速度、易读性和几何精度,但易读性比速度和几何精度更重要 |
txrnGeometricPrecision | 更加注重几何精度而不是易读性和渲染速度 |
txrnNone | 无特别权衡的项目 |
txrnOptimizeLegibility | 更加注重易读性而不是渲染速度和几何精度 |
txrnOptimizeSpeed | 更加注重渲染速度而不是易读性和几何精度 |
# 1.1.6. DPI
property DPI: Integer;
当前属性用于将字符串长度转换为单位英寸包含的像素点数,DPI 应该在加载 SVG 之前设置。例如,如果输入字符串包含“1cm”,则 DPI 可帮助 SVG库计算出一厘米有多大。
# 1.1.7. EmbedSVGAsBinary
property EmbedSVGAsBinary: Boolean;
此属性用于设置是否将SVG文档作为二进制嵌入到表单中。此属性设置为true时,将SVG作为二进制嵌入到表单中。 与单使用 Lines
属性或单从FilName
属性加载 SVG 相比,将 SVG 嵌入为二进制可以使表单更快实现初始化效果。
# 1.1.8. FileName
property Filename: String;
定义要在设计时和运行时加载的 SVG 文档的文件名。
# 1.1.9. Lines
property Lines: TStrings;
定义要加载的 SVG 的 XML 文本。
# 1.1.10. Options
property Options: TSVGOptions;
定义用于读取、显示和写入文档的选项。包含以下选项:
名称 | 说明 |
---|---|
soApplyClipping | 设置是否为绘图使用剪切路径 |
soCompactExport | 设置导出SVG时,是否只导出非继承类属性 |
soEnforceUniqueID | 为SVG元素强制应用唯一ID除非引发异常。如果此选项不存在,SVG文档将生成唯一ID(可能会破坏 URI)以确保保留唯一性 |
soExportDisabled | 设置导出 SVG 时,是否导出禁用元素和启用元素 |
soExportOptimizedBinaryStyleProperties | 设置导出二进制 SVG 时,优化样式属性集(继承和首选样式)的流式传输方式 |
soExportUnknownXML | 设置导出SVG时,是否导出未知的svg/xml元素 |
soFMXRadialGradientPatch | 设置此项以获得最佳质量 |
soSkipUnknownXML | 设置在加载 XML 时,跳过未知节点,否则在加载时会引发异常 |
soUseFillText | 在绘制文本元素时,是否使用 FillText(更快但不太兼容),如果设置为False,在绘制文本元素时会将文本转换为路径并使用 FillPath(更慢但更兼容) |
soUseLocaleForLanguage | 使用系统区域设置语言显示元素(适用于 Switch SVG 元素) |
# 1.1.11. PreferredLanguage
property PreferredLanguage: String;
设置指定用于 SVG 的首选语言。不同的语言之间使用,
进行分隔。
# 1.2. 事件
事件 | 何时触发 |
---|---|
OnAddStyle | 当样式添加至文档时触发事件 |
OnDisableAppearance | 在禁用元素即将被绘制到画布之前触发事件 |
OnDrawing | 在绘制当前元素及其子元素之前触发事件 |
OnDraw | 在绘制 SVG 元素之后触发事件 |
OnParsedNode | 解析 SVG 元素的子元素之后触发事件。当加载并解析 SVG 元素及其所有子元素时,会发生此事件 |
OnParsingNode | 解析 SVG 元素的子元素之前触发事件。当一个 SVG 元素已经被解析为它自己的属性但在它的任何子元素被加载和解析之前,这个事件发生 |
OnRemoveStyle | 从文档中提取或删除样式时触发事件 |
# 1.3. 方法
# 1.3.1. LoadSVGFromStrings
procedure LoadSVGFromStrings( const Lines: TStrings );
从TStrings
参数中获取SVG。
# 1.4. 用法
一个 SVG 文档组件可以作为多个 TRSSVGImage 控件的数据提供者。 例如,如果 SVG 文档包含一副完整的卡片,您可以使用 SVGRoot 属性为每张卡片设置多个 TRSSVGImage 控件。使用 TRSSVGDocument.Lines
属性将您的 SVG 文档“捆绑”到应用程序中。
在设计阶段,可使用以下方式来使用:
- 在窗体中放置一个
TRSSVGDocument
组件。 - 设置
TRSSVGDocument
组件的FileName
属性,指定为SVG文件,也可以在Lines
属性中输入SVG的数据信息。 - 在窗体中放置一个
TRSSVGImage
组件。 - 设置
TRSSVGImage
组件的SVGDocument
属性为TRSSVGDocument
的名称。
或者,如果您只想显示 SVG 文档的一个分支,您可以将 TRSSVGImage.SVGRoot
属性设置为您想要显示的 SVG 元素。 如果 SVGRoot 不为空并且它不等于文档中的任何 SVG 元素,则不会显示任何内容。
# 2. TRSSVGPanel
此控件提供一个面板,用于为 SVG 生成设计时或运行时对象。 与 TRSSVGImage 组件不同,TRSSVGPanel 组件不使用画布操作绘制 SVG。 相反,它生成 控件来绘制 SVG。TRSSVGPanel 在功能和与 SVG 规范的兼容性方面受到更多限制。 限制包括不能剪裁、旋转和缩放的控件可能会被剪裁。 建议仅在经过测试的 SVG 图形上使用 TRSSVGPanel 以防止错误。
# 2.1. 属性
属性 | 功能说明 |
---|---|
ScaleOriginal | 指定用于绘制 SVG 的比例。使用 ScaleOriginal 属性可以在控件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用 |
SVGDocument | 指定要在控件中显示的SVG文档的名称。SVGDocument和SVGRootID属性精确控制要显示的SVG文档和SVG文档层次结构分支 |
SVGRootID | 指定将 SVGDocument 中的某个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性可仅显示 SVGDocument 中的一部分内容 |
WrapMode | 指定是否调整SVG图形,以及设定如何调整图像大小、复制和定位SVG图像以呈现在控件中 |
# 2.1.1. ScaleOriginal
property ScaleOriginal: Single;
指定用于绘制 SVG 的比例。使用 ScaleOriginal 属性可以在 TRSSVGImage 组件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用。
# 2.1.2. SVGDocument
property SVGDocument: TRSSVGDocument;
指定要在控件中显示的SVG文档的名称。SVGDocument和SVGRootID属性精确控制要显示的SVG文档和SVG文档层次结构分支。
# 2.1.3. SVGRootID
property SVGRootID: String;
指定将 SVGDocument 中的某个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性可仅显示 SVGDocument 中的一部分内容。
# 2.1.4. WrapMode
property WrapMode: TSVGImageWrapMode
指定是否调整SVG图形,以及设定如何调整图像大小、复制和定位SVG图像以呈现在TRSSVGImage中。
iwOriginal
: 以原始尺寸显示 SVG。iwFit
: TRSSVGImage 矩形的最佳拟合(保持 SVG 比例 - 宽度和高度之间的比率)。此项为默认设置项。iwStretch
:拉伸SVG以填充TRSSVGImage组件的整个矩形。iwTile
:平铺 TRSSVGImage 图像以覆盖 TRSSVGImage 组件的整个矩形。iwCenter
: 将 SVG 在 TRSSVGImage 组件内居中。
# 2.2. 事件
事件 | 何时触发 |
---|---|
OnGenerateControl | 为SVG元素生成控件时触发的事件,在为SVG元素创建和初始化控件之后,使用OnGenerateControl事件来修改它。 |
# 2.3. 方法
# 2.3.1. ClearSVGDocument
procedure ClearSVGDocument;
此方法用于清除SVGDocument
属性而不删除 SVG 元素。
# 2.3.2. FindControl
function FindControl(SVGID: String): TControl;
返回具有等于SVGID
属性的参数名称的面板子控件。
# 3. TRSSVGImage
TRSSVGImage可用于显示SVG的图形图像。 该控件在缩放控件时通过重新绘制SVG来确保图像始终具有最高分辨率。
使用 TRSSVGImage在表单上显示 SVG 的图形图像。 使用SVGDocument和SVGRootID属性来控制图像中显示的SVG。 TRSSVGImage引入了几个属性来确定如何在TRSSVGImage对象的边界内显示SVG。
# 3.1. 属性
属性 | 功能说明 |
---|---|
Buffered | 指定是否将SVG绘制到后台缓冲区,然后将该图像复制到前台(默认设置)还是直接在前台绘制SVG图形 |
FindOptions | 此属性用于帮助控件确定哪个svg元素位于鼠标光标处 |
Opacity | 指定SVG图像的不透明度。如果Opacity小于1,则SVG显示为半透明。 如果 Opacity为 0,则不显示SVG |
Quality | 控制SVG图像的TRSSVGImage.Buffered 绘画的质量。 质量值可以取值于1(低)到 8(非常高) |
ScaleQriginal | 指定用于绘制 SVG 的比例。使用 ScaleOriginal 属性可以在 TRSSVGImage 组件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用 |
SVGDocument | 指定要在控件中显示的SVG文档的名称。SVGDocument和SVGRootID属性精确控制要显示的SVG文档和SVG文档层次结构分支 |
SVGRootID | 指定将 SVGDocument 中的某个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性可仅显示 SVGDocument 中的一部分内容 |
Transform | 指定要应用于SVG图像的整体转换模式 |
WrapMode | 指定是否调整SVG图形,以及设定如何调整图像大小、复制和定位SVG图像以呈现在控件中 |
# 3.1.1. Buffered
property Buffered: Boolean;
此属性用于指定是否将SVG绘制到后台缓冲区,然后将该图像复制到前台(默认设置)还是直接在前台绘制SVG图形 。当 Opacity 小于 1 或平铺 SVG 时,缓冲功能将始终处于启用状态。
# 3.1.2. FindOptions
property FindOptions: TSVGFindOptions
此属性用于帮助控件确定哪个svg元素位于鼠标光标处。
名称 | 说明 |
---|---|
foFindDisabled | 当此选项存在时,搜索算法将检测禁用的 (TSVGElement.Enabled=False) 元素以及启用的元素。当此选项不存在时,搜索算法将只检测启用的元素 |
foFindGroups | 是否将分组与SVG作为元素查找。如果此选项不存在,则只能找到组的子项,而不是组本身 |
foFindHiddenElements | 是否查找隐藏的元素。当这个选项存在时,仍然可以找到不可见的元素 |
foFindNonFilled | 当此选项存在时,搜索算法会将具有Brush.Kind = None 的svg元素视为没有孔的实体对象。当此选项不存在时,带有 Brush.Kind = None 的 svg 元素将被视为“空心”,并且只会检测元素轮廓上的点 |
foFindNoRecursion | 当此选项存在时,查找算法将不会尝试查找元素的子元素 |
foUseBoundingBox | 当此选项存在时,使用它们的边界框查找元素(更快但不太准确)。当此选项不存在时,按形状查找元素(更慢但更准确) |
# 3.1.3. Opacity
property Opacity: Single;
此属性用于指定SVG图像的不透明度。如果Opacity小于1,则SVG显示为半透明。 如果 Opacity为 0,则不显示SVG。
# 3.1.4. Quality
property Quality: Integer;
此属性控制SVG图像的TRSSVGImage.Buffered
绘画的质量。 质量值可以取值于1(低)到 8(非常高)。
# 3.1.5. ScaleQriginal
property ScaleOriginal: Single;
指定用于绘制 SVG 的比例。使用 ScaleOriginal 属性可以在 TRSSVGImage 组件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用。
# 3.1.6. SVGDocument
property SVGDocument: TRSSVGDocument;
指定要在控件中显示的SVG文档的名称。SVGDocument和SVGRootID属性精确控制要显示的SVG文档和SVG文档层次结构分支。
# 3.1.7. SVGRootID
property SVGRootID: String;
指定将 SVGDocument 中的某个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性可仅显示 SVGDocument 中的一部分内容。
# 3.1.8. Transform
property Transform: TRSTransform;
指定要应用于SVG图像的整体转换模式。
# 3.1.9. WrapMode
property WrapMode: TSVGImageWrapMode
指定是否调整SVG图形,以及设定如何调整图像大小、复制和定位SVG图像以呈现在TRSSVGImage中。
iwOriginal
: 以原始尺寸显示 SVG。iwFit
: TRSSVGImage 矩形的最佳拟合(保持 SVG 比例 - 宽度和高度之间的比率)。此项为默认设置项。iwStretch
:拉伸SVG以填充TRSSVGImage组件的整个矩形。iwTile
:平铺 TRSSVGImage 图像以覆盖 TRSSVGImage 组件的整个矩形。iwCenter
: 将 SVG 在 TRSSVGImage 组件内居中。
# 3.2. 事件
事件 | 何时触发 |
---|---|
OnClickElement | 在控件中单击鼠标时发生。 Element参数指定鼠标光标下的元素,如果鼠标下没有元素,则为nil。TRSSVGImage.FindOptions 属性指定控件如何确定鼠标光标下的 svg 元素。 |
# 3.3. 方法
# 3.3.1. GetOpacity
function GetOpacity: Single;
返回控件的不透明度。
# 3.3.2. IsBuffered
function IsBuffered: Boolean;
如果应该将 SVG 绘制到屏幕外位图,则返回 True。
# 3.3.3. SetOpacity
procedure SetOpacity(const Value: Single);
设置控件的不透明度。 如果 Opacity 小于 1,则 SVG 显示为半透明。 如果 Opacity 为 0,则不显示 SVG。
# 4. TRSSVGImageList
定义一个完全由 SVG 组成的 TImageList,以实现对不同屏幕分辨率和密度的紧凑图形支持。
TImageList 组件表示一组相同大小的图像,每个图像都可以通过其索引引用。 它可以在图像列表的 Width 和 Height 发生变化时重新生成位图。
TRSSVGImageList.Items 属性包含图像列表中的 SVG 列表。也可在设计模式下,右键点击此控件,在菜单中选择[Edit SVG Image List...]
来打开界面进行添加。

# 4.1. 属性
属性 | 功能说明 |
---|---|
ColorDepth | 指定存储的图形的颜色位深度,默认为32位 |
Height | 指定图像列表中图片的高度 |
Items | 定义图像列表中的 SVG 集合,用于为其他控件提供图像列表使用的图像 |
MasterImageList | 指定用于为图像列表提供主SVG图像列表。 如果 MasterImageList 不为 nil,则当前控件中的TRSSVGImageList.Items 为空,SVG 由 MasterImageList 提供。 |
Quality | 控制 SVG 图像绘制的采样质量。 质量值可以在 1(默认质量)到 8(最佳质量) 之间变化 |
Width | 指定图像列表中图片的宽度 |
# 4.1.1. ColorDepth
property ColorDepth default cd32Bit;
指定存储的图形的颜色位深度,默认为32位。
# 4.1.2. Height
property Height: Integer;
指定图像列表中图片的高度。
# 4.1.3. Items
property Items: TSVGCollection;
定义图像列表中的 SVG 集合,用于为其他控件提供图像列表使用的图像。
# 4.1.4. MasterImageList
property MasterImageList: TRSSVGImageList;
此属性指定用于为图像列表提供主SVG图像列表。 如果 MasterImageList 不为 nil,则当前控件中的TRSSVGImageList.Items
为空,SVG 由 MasterImageList 提供。。 如果 MasterImageList 为 nil,则 Items 属性为图像提供 SVG。
# 4.1.5. Quality
property Quality: Integer;
控制 SVG 图像绘制的过采样质量。 质量值可以在 1(默认质量)到 8(最佳质量) 之间变化。此属性控制在缓冲绘图中执行的过采样量。 其取值为屏幕外缓冲区的尺寸乘以属性值。 在绘制控件时,对屏幕外缓冲区进行下采样,提供缓冲绘图的抗锯齿特性。 如果 Quality 为 1,则使用默认的 GDI+ 质量来绘制 SVG,这会使绘图结果趋于平滑。 如果您想要更清晰的结果,请增大属性的取值。
# 4.1.6. Width
property Width: Integer;
指定图像列表中图片的宽度。
# 5. TRSSVGScreen
TRSSVGScreen 控件用于显示 SVG 的图形图像。 该控件通过在重新缩放控件时重新绘制 SVG 来确保图像始终具有最高分辨率。
使用 TRSSVGScreen 在表单上显示 SVG 的图形图像。 使用 SVGDocument 和 SVGRootID 属性来控制图像中显示的 SVG。 TRSSVGScreen 引入了几个属性来确定如何在 TRSSVGScreen 对象的边界内显示 SVG。
# 5.1. 属性
属性 | 功能说明 |
---|---|
Buffered | 指定是否将SVG绘制到后台缓冲区,然后将该图像复制到前台(默认设置)还是直接在前台绘制SVG图形 |
FindOptions | 此属性用于帮助控件确定哪个svg元素位于鼠标光标处 |
Opacity | 指定SVG图像的不透明度。如果Opacity小于1,则SVG显示为半透明。 如果 Opacity为 0,则不显示SVG |
Quality | 控制SVG图像的Buffered 绘画的质量。 质量值可以取值于1(低)到 8(非常高) |
ScaleQriginal | 指定用于绘制 SVG 的比例。使用 ScaleOriginal 属性可以在 TRSSVGImage 组件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用 |
SVGDocument | 指定要在控件中显示的SVG文档的名称。SVGDocument和SVGRootID属性精确控制要显示的SVG文档和SVG文档层次结构分支 |
SVGRootID | 指定将 SVGDocument 中的某个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性可仅显示 SVGDocument 中的一部分内容 |
Transform | 指定要应用于SVG图像的整体转换模式 |
WrapMode | 指定是否调整SVG图形,以及设定如何调整图像大小、复制和定位SVG图像以呈现在控件中 |
# 5.1.1. Buffered
property Buffered: Boolean;
此属性用于指定是否将SVG绘制到后台缓冲区,然后将该图像复制到前台(默认设置)还是直接在前台绘制SVG图形 。当 Opacity 小于 1 或平铺 SVG 时,缓冲功能将始终处于启用状态。
# 5.1.2. FindOptions
property FindOptions: TSVGFindOptions
此属性用于帮助控件确定哪个svg元素位于鼠标光标处。
名称 | 说明 |
---|---|
foFindDisabled | 当此选项存在时,搜索算法将检测禁用的 (TSVGElement.Enabled=False) 元素以及启用的元素。当此选项不存在时,搜索算法将只检测启用的元素 |
foFindGroups | 是否将分组与SVG作为元素查找。如果此选项不存在,则只能找到组的子项,而不是组本身 |
foFindHiddenElements | 是否查找隐藏的元素。当这个选项存在时,仍然可以找到不可见的元素 |
foFindNonFilled | 当此选项存在时,搜索算法会将具有Brush.Kind = None 的svg元素视为没有孔的实体对象。当此选项不存在时,带有 Brush.Kind = None 的 svg 元素将被视为“空心”,并且只会检测元素轮廓上的点 |
foFindNoRecursion | 当此选项存在时,查找算法将不会尝试查找元素的子元素 |
foUseBoundingBox | 当此选项存在时,使用它们的边界框查找元素(更快但不太准确)。当此选项不存在时,按形状查找元素(更慢但更准确) |
# 5.1.3. Opacity
property Opacity: Single;
此属性用于指定SVG图像的不透明度。如果Opacity小于1,则SVG显示为半透明。 如果 Opacity为 0,则不显示SVG。
# 5.1.4. Quality
property Quality: Integer;
此属性控制SVG图像的Buffered
绘画的质量。 质量值可以取值于1(低)到 8(非常高)。
# 5.1.5. ScaleQriginal
property ScaleOriginal: Single;
指定用于绘制 SVG 的比例。使用 ScaleOriginal 属性可以在组件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用。
# 5.1.6. SVGDocument
property SVGDocument: TRSSVGDocument;
指定要在控件中显示的SVG文档的名称。SVGDocument和SVGRootID属性精确控制要显示的SVG文档和SVG文档层次结构分支。
# 5.1.7. SVGRootID
property SVGRootID: String;
指定将 SVGDocument 中的某个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性可仅显示 SVGDocument 中的一部分内容。
# 5.1.8. Transform
property Transform: TRSTransform;
指定要应用于SVG图像的整体转换模式。
# 5.1.9. WrapMode
property WrapMode: TSVGImageWrapMode
指定是否调整SVG图形,以及设定如何调整图像大小、复制和定位SVG图像以呈现在控件中。
iwOriginal
: 以原始尺寸显示 SVG。iwFit
: 控件矩形的最佳拟合(保持 SVG 比例 - 宽度和高度之间的比率)。此项为默认设置项。iwStretch
:拉伸SVG以填充控件的整个矩形。iwTile
:平铺 TRSSVGImage 图像以覆盖控件的整个矩形。iwCenter
: 将 SVG 在控件内居中。
# 5.2. 事件
事件 | 何时触发 |
---|---|
OnClickElement | 在控件中单击鼠标时发生。 Element 参数指定鼠标光标下的元素,如果鼠标下没有元素,则为 nil。FindOptions 属性指定控件如何确定鼠标光标下的 svg 元素。 |
# 5.3. 方法
# 5.3.1. GetOpacity
function GetOpacity: Single;
返回控件的不透明度。
# 5.3.2. IsBuffered
function IsBuffered: Boolean;
如果要将 SVG 绘制到屏幕外的位图缓冲区中,则返回 True。
# 5.3.3. SetOpacity
procedure SetOpacity(const Value: Single);
设置控件的不透明度。 如果 Opacity 小于 1,则 SVG 显示为半透明。 如果 Opacity 为 0,则不显示 SVG。
# 6. TRSSVGThreadImage
TRSSVGThreadImage 显示 SVG 的图形图像。 该控件通过在重新缩放控件时重新绘制 SVG 来确保图像始终具有最高分辨率。
使用 TRSSVGThreadImage 在表单上显示 SVG 的图形图像。 使用 Filename 或 Lines 属性来控制图像中显示的 SVG。
在TRSSVGThreadImage中预置了一个目录用于放置默认或者自定义的SVG图形列表。其目录位于Smart安装目录中的resources/images/svg
中,所有的SVG图形按照文件夹进行分组放置。通过双击控件来打开SVG图库,进行图片的选择。

# 6.1. 属性
属性 | 功能说明 |
---|---|
DefaultAspectRatio | 定义 SVG 的默认纵横比。如果 SVG 中未使用preserveAspectRatio 属性对纵横比进行指定,则 SVG 将使用此默认值的纵横比来显示图形。 |
DefaultColorInterpolation | 设定SVG图形使用的默认颜色插值算法类型,可使用渐变颜色插值或者Alpha通道合成颜色空间 |
DefaultColorRendering | 指定SVG图形默认的颜色渲染类型,向SVG库提供有关如何优化其颜色插值和合成操作的提示 |
DefaultShapeRendering | 默认形状渲染类型,它向 SVG 库提供了有关在渲染矢量图形元素(例如路径元素)和基本形状(例如圆形和矩形)时要进行哪些权衡的提示 |
DefaultTextRendering | 默认文本渲染类型,它向 SVG 库提供有关在渲染文本时进行哪些权衡的提示 |
DPI | 用于计算将字符串长度转换为实际值的单位系数的每英寸点数,DPI 应该在加载 SVG 之前设置。例如,如果输入字符串包含“1cm”,则 DPI 可帮助 SVG 库计算出一厘米有多大 |
Filename | 定义要在设计时和运行时加载的 SVG 文档的文件名。 |
FindOptions | 此属性用于帮助控件确定哪个svg元素位于鼠标光标处。 |
Lines | 定义要加载的 SVG 文本。 当您不想从具有 Filename 属性的文件加载 SVG 时,Lines 属性非常有用 |
Opacity | 指定 SVG 图像的不透明度。 如果 Opacity 小于 1,则 SVG 显示为半透明。 如果 Opacity 为 0,则不显示 SVG |
Options | 定义用于读取、显示和写入文档的选项 |
ScaleOriginal | 设定 SVG 的缩放比例,使用 ScaleOriginal 属性在控件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用 |
SVGRootID | 指定将 SVGDocument 的哪个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性仅显示 SVGDocument 的一部分。 |
Transform | 指定要应用于 SVG 图像的整体转换。 |
WrapMode | 指定是否以及如何调整大小、复制和定位 SVG 图像以呈现在控件表面。 |
# 6.1.1. DefaultAspectRatio
property DefaultAspectRatio: TSVGPreserveAspectRatio;
定义 SVG 的默认纵横比。如果 SVG 中未使用preserveAspectRatio
属性对纵横比进行指定,则 SVG 将使用此默认值的纵横比来显示图形。其中使用到的属性如下:
- Align:指示是否强制统一缩放。有以下类型的选项:
saNone
:不使用强制统一缩放。saXMaxYMax
:使用强制统一缩放。将元素viewBox
的<min-x>+<width>
取值与控件可视窗口的最大值X对齐。将元素viewBox
的<min-y>+<height>
取值与控件可视窗口的最大值Y对齐。saXMaxYMid
:使用强制统一缩放。将元素viewBox
的<min-x>+<width>
取值与控件可视窗口的最大值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的中点Y值对齐。saXMaxYMin
:使用强制统一缩放。将元素viewBox
的<min-x>+<width>
取值与控件可视窗口的最大值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的最小值Y对齐。saXMidYMax
:使用强制统一缩放。将元素viewBox
的中点X值与控件可视窗口中的中点X值对齐。将元素viewBox
的<min-y>+<height>
取值与控件可视窗口的最大值Y对齐。saXMidYMid
:使用强制统一缩放。将元素viewBox
的中点X值与控件可视窗口中的中点X值对齐。将元素viewBox
的中点Y值与控件可视窗口中的中点Y值对齐。saXMidYMin
:使用强制统一缩放。将元素viewBox
的中点X值与控件可视窗口中的中点X值对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的最小值Y对齐。saXMinYMax
:使用强制统一缩放。将元素viewBox
的<min-x>
取值与控件可视窗口的最小值X对齐。将元素viewBox
的<min-y>+<height>
取值与控件可视窗口的最大值Y对齐。saXMinYMid
:使用强制统一缩放。使用强制统一缩放。将元素viewBox
的<min-x>
取值与控件可视窗口的最小值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的中点Y值对齐。saXMinYMin
:使用强制统一缩放。使用强制统一缩放。将元素viewBox
的<min-x>
取值与控件可视窗口的最小值X对齐。将元素viewBox
的<min-y>
取值与控件可视窗口的最小值Y对齐。
- Defer:设置纵横比与 TSVGImage 元素一起使用时的效果。 如果此项属性设置为 true,则会使用SVG中定义的
preserveAspectRatio
属性(如果存在)。 如果引用的SVG中缺少preserveAspectRatio
属性的值,则按照正常的其他规则来处理preserveAspectRatio
属性(即忽略Defer
属性的设置)。 对于其他SVG元素上的preserveAspectRatio
,不会使用此属性。 - Slice:设置图形是否为拉伸覆盖。
# 6.1.2. DefaultColorInterpolation
property DefaultColorInterpolation: TSVGColorInterpolation;
设定SVG图形使用的默认颜色插值算法类型,可使用渐变颜色插值或者Alpha通道合成颜色空间。有以下选项可选择:
名称 | 说明 |
---|---|
sciAuto | 表示用户可以选择sRGB或linearRGB的颜色空间进行颜色插值。 此选项表示不需要指定特定的颜色空间中进行颜色插值 |
sciLinearRGB | 指定在linearRGB颜色空间中进行颜色插值 |
sciNone | 不使用颜色空间插值 |
sciSRGB | 指定在sRGB颜色空间中进行颜色插值 |
# 6.1.3. DefaultColorRendering
property DefaultColorRendering: TSVGColorRendering;
默认颜色渲染类型,它向 SVG 库提供有关如何优化其颜色插值和合成操作的提示,有以下选项可选择。
名称 | 说明 |
---|---|
clrnAuto | 自动选择,以平衡颜色渲染速度和质量,两者之间会偏向注重质量 |
clrnNone | 不设定颜色渲染类型 |
clrnOptimizeQuality | 更加注重颜色渲染的质量而不是渲染速度 |
clrnOptimizeSpeed | 更加注重渲染速度而非质量 |
# 6.1.4. DefaultShapeRendering
property DefaultShapeRendering: TSVGShapeRendering;
指定默认形状渲染类型,它向 SVG 库提供了在渲染矢量图形元素(例如路径元素)和基本形状(例如圆形和矩形)时要进行哪些权衡的提示。
名称 | 说明 |
---|---|
srnAuto | 进行适当的权衡以平衡速度、边缘清晰度和几何精度,但几何精度比速度和边缘清晰度更重要 |
srnCrispEdges | 更加注重边缘清晰度,而不是渲染速度和几何精度 |
srnGeometricPrecision | 更加注重几何精度,而不是速度和边缘清晰度 |
srnNone | 无特别权衡的项目 |
srnOptimizeSpeed | 更加注重渲染速度,而不是几何精度、边缘清晰度,无抗锯齿 |
# 6.1.5. DefaultTextRendering
property DefaultTextRendering: TSVGTextRendering;
默认文本渲染类型,它向 SVG 库提供有关在渲染文本时进行哪些权衡的提示。
名称 | 说明 |
---|---|
txrnAuto | 进行适当的设置以平衡速度、易读性和几何精度,但易读性比速度和几何精度更重要 |
txrnGeometricPrecision | 更加注重几何精度而不是易读性和渲染速度 |
txrnNone | 无特别权衡的项目 |
txrnOptimizeLegibility | 更加注重易读性而不是渲染速度和几何精度 |
txrnOptimizeSpeed | 更加注重渲染速度而不是易读性和几何精度 |
# 6.1.6. DPI
property DPI: Integer;
当前属性用于将字符串长度转换为单位英寸包含的像素点数,DPI 应该在加载 SVG 之前设置。例如,如果输入字符串包含“1cm”,则 DPI 可帮助 SVG库计算出一厘米有多大。
# 6.1.7. FileName
property Filename: String;
定义要在设计时和运行时加载的 SVG 文档的文件名。
# 6.1.8. FindOptions
property FindOptions: TSVGFindOptions;
此属性用于帮助控件确定哪个svg元素位于鼠标光标处。
名称 | 说明 |
---|---|
foFindDisabled | 当此选项存在时,搜索算法将检测禁用的 (TSVGElement.Enabled=False) 元素以及启用的元素。当此选项不存在时,搜索算法将只检测启用的元素 |
foFindGroups | 将组或视口作为元素查找。如果此选项不存在,则只能找到组的子项,而不是组本身 |
foFindHiddenElements | 找到隐藏的元素。当这个选项存在时,仍然可以找到不可见的元素 |
foFindNonFilled | 当此选项存在时,搜索算法会将具有 Brush.Kind = None 的 svg 元素视为没有孔的实体对象。当此选项不存在时,带有 Brush.Kind = None 的 svg 元素将被视为“空心”,并且只会检测元素轮廓上的点 |
foFindNoRecursion | 当此选项存在时,查找算法将不会尝试查找元素的子元素 |
foUseBoundingBox | 当此选项存在时,使用它们的边界框查找元素(更快但不太准确)。当此选项不存在时,按形状查找元素(更慢但更准确) |
# 6.1.9. Lines
property Lines: TStrings;
定义要加载的 SVG 的 XML 文本。当您不想从具有 Filename 属性的文件加载 SVG 时,Lines 属性非常有用。
# 6.1.10. Opacity
property Opacity: Single;
指定 SVG 图像的不透明度或透明度。 如果 Opacity 小于 1,则 SVG 显示为半透明。 如果 Opacity 为 0,则不显示 SVG。
# 6.1.11. Options
property Options: TSVGOptions;
定义用于读取、显示和写入文档的选项。包含以下选项:
名称 | 说明 |
---|---|
soApplyClipping | 为绘图应用剪切路径 |
soCompactExport | 导出SVG时,只导出非继承属性 |
soEnforceUniqueID | 为 SVG 元素强制执行唯一 ID 或引发异常。如果此选项不存在,SVG 文档将生成唯一 ID(可能会破坏 URI)以确保保留唯一性 |
soExportDisabled | 导出 SVG 时,导出禁用元素和启用元素 |
soExportOptimizedBinaryStyleProperties | 导出二进制 SVG 时,优化样式属性集(继承和首选样式)的流式传输方式。优化集合流的速度要快得多,因为它会流出样式属性枚举值的序数值。但是,如果样式属性枚举的顺序将来发生变化,您可能会加载不正确的结果 |
soExportUnknownXML | 导出SVG时,导出未知的svg/xml元素 |
soFMXRadialGradientPatch | 设置 Gradient.Transform 属性以获得最佳渲染质量 |
soSkipUnknownXML | 加载 XML 时跳过未知节点或在加载时触发异常 |
soUseFillText | 绘制文本元素时,使用 FillText(更快但不太兼容)或将文本转换为路径并使用 FillPath(更慢但更兼容) |
soUseLocaleForLanguage | 使用系统区域设置语言显示元素(适用于 Switch SVG 元素)(仅限 Windows) |
# 6.1.12. ScaleQriginal
property ScaleOriginal: Single;
指定用于绘制 SVG 的比例因子。使用 ScaleOriginal 属性在 TRSSVGImage 组件内放大或缩小 SVG。 这对于控制平铺 SVG 或放大或缩小 SVG 很有用。
# 6.1.13. SVGRootID
property SVGRootID: String;
指定将 SVGDocument 的哪个节点绘制为顶级 SVG 文档。使用 SVGRootID 属性仅显示 SVGDocument 的一部分。
# 6.1.14. Transform
property Transform: TRSTransform;
指定要应用于 SVG 图像的整体转换。
# 6.1.15. WrapMode
property WrapMode: TSVGImageWrapMode
指定是否调整SVG图形,以及设定如何调整图像大小、复制和定位SVG图像以呈现在控件中。
iwOriginal
: 以原始尺寸显示 SVG。iwFit
: 控件矩形的最佳拟合(保持 SVG 比例 - 宽度和高度之间的比率)。此项为默认设置项。iwStretch
:拉伸SVG以填充控件的整个矩形。iwTile
:平铺 TRSSVGImage 图像以覆盖控件的整个矩形。iwCenter
: 将 SVG 在控件内居中。
# 6.2. 事件
事件 | 何时触发 |
---|---|
OnClickElement | 在控件中单击鼠标时发生。 Element 参数指定鼠标光标下的元素,如果鼠标下没有元素,则为 nil。FindOptions 属性指定控件如何确定鼠标光标下的 svg 元素。 |
# 6.3. 方法
# 6.3.1. GetOpacity
function GetOpacity: Single;
返回控件的不透明度。
# 6.3.2. SetOpacity
procedure SetOpacity(const Value: Single);
设置控件的不透明度。 如果 Opacity 小于 1,则 SVG 显示为半透明。 如果 Opacity 为 0,则不显示 SVG。
# 7. TRSSVGText
为 SVG 文本元素定义 TText。 当为 SVG 生成 对象时使用这个类(不是使用 TRSSVGImage 组件直接绘制它们),它提供对 SVG 元素的控件访问。
# 7.1. 属性
属性 | 功能说明 |
---|---|
SVGID | 生成此控件的 SVG 元素名称 |
SVGText | 设定文本显示的属性信息 |
# 7.1.1. SVGID
property SVGID: String;
指定生成此控件的SVG元素名称。
# 7.1.2. SVGText
property SVGText: TSVGText;
设定文本显示的属性信息。
# 8. TRSSVGPath
为 SVG 图像元素定义路径控件。 当为 SVG 生成控件时使用这个类(不是使用 TRSSVGImage 组件直接绘制它们),它提供对 SVG 元素的控件访问。
# 8.1. 属性
属性 | 功能说明 |
---|---|
SVGID | 生成此控件的 SVG 元素名称 |
# 8.1.1. SVGID
property SVGID: String;
生成此控件的 SVG 元素名称。
# 9. TRSSVGLayout
为 SVG 组元素定义占位符控件。 当为 SVG 生成控件对象时使用这个类(而不是使用 TRSSVGImage 组件直接绘制它们),它提供对 SVG 元素的控件访问。
# 9.1. 属性
属性 | 功能说明 |
---|---|
SVGID | 生成此控件的 SVG 元素名称 |
# 9.1.1. SVGID
property SVGID: String;
生成此控件的 SVG 元素名称。
# 10. TSVGThreadImage
该控件实现的功能与TRSSVGThreadImage相同,其功能为对SVG列表中的内容进行轮播。下面介绍其新增的属性。
# 10.1. 属性
属性 | 功能说明 |
---|---|
SVGImgList | 设定显示轮播图形使用的图像列表控件名称 |
Interval | 设定轮播的时间间隔,以ms为单位 |
ThreadEnabled | 设定是否启用图片轮播的功能 |
# 10.1.1. SVGImgList
property SVGImgList: TRSSVGImageList;
此属性用于设定显示轮播图形使用的图像列表控件的名称。
# 10.1.2. Interval
property Interval: Integer;
此属性用于设定图片轮播的时间间隔,以ms为单位。
# 10.1.3. ThreadEnabled
property ThreadEnabled: Boolean;
此属性用于设定是否启用图片的轮播功能。