TSkSvg元件使用

1. 把svg靜態字串寫死程式裡

unit Unit1;

interface

uses
  Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System.Classes, Vcl.Graphics,
  Vcl.Controls, Vcl.Forms, Vcl.Dialogs, System.Skia, Vcl.Skia, Vcl.StdCtrls;

type
  TForm1 = class(TForm)
    SkSvg1: TSkSvg;
    Button1: TButton;
    Button2: TButton;
    procedure Button1Click(Sender: TObject);
    procedure Button2Click(Sender: TObject);
  private
    { Private declarations }
  public
    { Public declarations }
  end;

const
  /// <summary>
  /// 把圖片寫死在程式裡
  /// </summary>
  svgStr = '<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717364678249" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6571" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M0 0h1024v1024H0z" fill="#FFFFFF" fill-opacity="0" p-id="6572"></path><path d="M760.901604 195.216203m5.656854 5.656854l56.568543 56.568542q5.656854 5.656854 0 11.313709l-554.371717 554.371716q-5.656854 5.656854-11.313708 0l-56.568543-56.568542q-5.656854-5.656854 0-11.313709l554.371717-554.371716q5.656854-5.656854 11.313708 0Z" fill="#000000" p-id="6573"></path><path d="M828.783855 760.901627m-5.656854 5.656855l-56.568543 56.568542q-5.656854 5.656854-11.313708 0l-554.371717-554.371716q-5.656854-5.656854 0-11.313709l56.568543-56.568542q5.656854-5.656854 11.313708 0l554.371717 554.371716q5.656854 5.656854 0 11.313709Z" fill="#000000" p-id="6574"></path></svg>';

var
  Form1: TForm1;

implementation

{$R *.dfm}

procedure TForm1.Button1Click(Sender: TObject);
begin
  SkSvg1.Svg.Source := svgStr;
end;

procedure TForm1.Button2Click(Sender: TObject);
begin
  SkSvg1.Svg.Source := '';
end;

end.

//這個SkSvg1.Svg.Source 的定義我們看下，父類是這樣的
property Source: TSkSvgSource read FSource write SetSource;
//再點選 TSkSvgSource 進去，我們會看到 是 string的一個別名，所以可以直接string賦值
TSkSvgSource = type string;

看下以上程式碼的效果：

2. 動態載入svg圖片