SVG资产在iOS应用中指定XCode中的Colorspace

Question

我目前正在我的iOS应用中使用SVG资产。资产已设计为使用显示P3彩色空间。当资产加载并以SwiftUI图像显示时，它们似乎是在使用SRGB颜色空间而不是P3。

我看不到一种指定在资产目录中使用的颜色空间的方法，也看不到图像上的任何功能来指定此功能。有没有办法做到这一点，还是我需要返回使用PNG？

Answer 1

您需要进入SVG文件，然后将基于十六进制的颜色更改为使用此示例的P3颜色：

<?xml version="1.0" encoding="UTF-8"?>
<svg id="empty_groups" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
  <defs>
    <style>
      .cls-1 { fill: color(display-p3 0.93 0.42 0.35); }
      .cls-2 { fill: color(display-p3 1.00 0.91 0.90); }
      .cls-3 { fill: color(display-p3 1.00 0.73 0.70); }
    </style>
  </defs>
  <circle class="cls-2" cx="51.49" cy="50" r="47.5"/>
  <rect class="cls-3" x="3.52" y="21.42" width="71.92" height="25.18" rx="5.3" ry="5.3"/>
  <path class="cls-1" d="m67.96,43.35H6.63c-3.34,0-6.05-2.71-6.05-6.05v-14.58c0-3.34,2.71-6.05,6.05-6.05h61.32c3.34,0,6.05,2.71,6.05,6.05v14.58c0,3.34-2.71,6.05-6.05,6.05ZM6.63,18.17c-2.51,0-4.55,2.04-4.55,4.55v14.58c0,2.51,2.04,4.55,4.55,4.55h61.32c2.51,0,4.55-2.04,4.55-4.55v-14.58c0-2.51-2.04-4.55-4.55-4.55H6.63Z"/>
  <rect class="cls-1" x="5.7" y="21.52" width="16.98" height="16.98" rx="3.07" ry="3.07"/>
  <rect class="cls-1" x="27.05" y="26.58" width="16.97" height="1.59" rx=".63" ry=".63"/>
  <rect class="cls-1" x="27.05" y="31.85" width="23.46" height="1.59" rx=".63" ry=".63"/>
  <path class="cls-1" d="m68.37,29.12c.69.4.69,1.39,0,1.79l-2.74,1.58-2.74,1.58c-.69.4-1.55-.1-1.55-.89v-6.34c0-.79.86-1.29,1.55-.89l2.74,1.58,2.74,1.58Z"/>
  <rect class="cls-3" x="26.74" y="57.4" width="71.92" height="25.18" rx="5.3" ry="5.3"/>
  <path class="cls-1" d="m91.18,79.33H29.86c-3.34,0-6.05-2.71-6.05-6.05v-14.58c0-3.34,2.71-6.05,6.05-6.05h61.32c3.34,0,6.05,2.71,6.05,6.05v14.58c0,3.34-2.71,6.05-6.05,6.05Zm-61.32-25.18c-2.51,0-4.55,2.04-4.55,4.55v14.58c0,2.51,2.04,4.55,4.55,4.55h61.32c2.51,0,4.55-2.04,4.55-4.55v-14.58c0-2.51-2.04-4.55-4.55-4.55H29.86Z"/>
  <rect class="cls-1" x="28.93" y="57.5" width="16.98" height="16.98" rx="3.07" ry="3.07"/>
  <rect class="cls-1" x="50.28" y="62.56" width="16.97" height="1.59" rx=".63" ry=".63"/>
  <rect class="cls-1" x="50.28" y="67.83" width="23.46" height="1.59" rx=".63" ry=".63"/>
  <path class="cls-1" d="m91.6,65.09c.69.4.69,1.39,0,1.79l-2.74,1.58-2.74,1.58c-.69.4-1.55-.1-1.55-.89v-6.34c0-.79.86-1.29,1.55-.89l2.74,1.58,2.74,1.58Z"/>
</svg>