Я бы программно (на PHP) экспортировал содержимое SWF-файла в формат SVG.Итак, я сначала попытался экспортировать каждую фигуру, составляющую мой файл, чтобы потом создать статические спрайты.Для этого я использую библиотеку IO_SWF для чтения содержимого файла swf.
FillStyles:
[1] solid fill: #d9d2c5(ff)
[2] solid fill: #8e7e66(ff)
[3] solid fill: #b9ae9a(ff)
[4] solid fill: #716044(ff)
LineStyles:
(none)
ShapeRecords:
ChangeStyle: MoveTo: (6.95, -10) FillStyle: 0|2 LineStyle: 0
StraightEdge: MoveTo: (7, -9.95)
StraightEdge: MoveTo: (7.2, -9.65)
StraightEdge: MoveTo: (7.1, -9.45)
StraightEdge: MoveTo: (6.85, -9)
ChangeStyle: MoveTo: (6.85, -9) FillStyle: 0|3 LineStyle: 0
CurvedEdge: MoveTo: Control(6.8, -7.95) Anchor(6.9, -7.15)
StraightEdge: MoveTo: (6.95, -6.25)
StraightEdge: MoveTo: (6.95, -6.15)
StraightEdge: MoveTo: (7, -6.15)
ChangeStyle: MoveTo: (7, -6.15) FillStyle: 0|1 LineStyle: 0
StraightEdge: MoveTo: (6.95, -5.85)
ChangeStyle: MoveTo: (6.95, -5.85) FillStyle: 0|2 LineStyle: 0
StraightEdge: MoveTo: (6.5, -5.2)
StraightEdge: MoveTo: (4.15, -2.3)
StraightEdge: MoveTo: (3.55, -2.15)
ChangeStyle: MoveTo: (3.55, -2.15) FillStyle: 0|4 LineStyle: 0
CurvedEdge: MoveTo: Control(3.7, -3.9) Anchor(5.35, -8.85)
StraightEdge: MoveTo: (6.45, -10.85)
CurvedEdge: MoveTo: Control(6.55, -10.45) Anchor(6.95, -10)
ChangeStyle: MoveTo: (6.95, -10) FillStyle: 2|4 LineStyle: 0
StraightEdge: MoveTo: (6.2, -8.9)
ChangeStyle: MoveTo: (6.2, -8.9) FillStyle: 2|3 LineStyle: 0
StraightEdge: MoveTo: (6.85, -9)
ChangeStyle: MoveTo: (6.2, -8.9) FillStyle: 3|4 LineStyle: 0
StraightEdge: MoveTo: (6.15, -7.85)
StraightEdge: MoveTo: (6.15, -7.7)
StraightEdge: MoveTo: (6.2, -7.55)
StraightEdge: MoveTo: (6.2, -6.9)
StraightEdge: MoveTo: (6.25, -6.75)
ChangeStyle: MoveTo: (6.25, -6.75) FillStyle: 3|1 LineStyle: 0
StraightEdge: MoveTo: (6.35, -6.2)
CurvedEdge: MoveTo: Control(6.4, -6) Anchor(6.7, -5.95)
StraightEdge: MoveTo: (7, -6.15)
ChangeStyle: MoveTo: (4.4, -3.2) FillStyle: 2|4 LineStyle: 0
StraightEdge: MoveTo: (4.15, -2.95)
StraightEdge: MoveTo: (3.55, -2.15)
ChangeStyle: MoveTo: (6.95, -5.85) FillStyle: 2|1 LineStyle: 0
StraightEdge: MoveTo: (6.95, -5.9)
StraightEdge: MoveTo: (6.8, -5.95)
StraightEdge: MoveTo: (6.7, -5.95)
StraightEdge: MoveTo: (6.5, -5.9)
StraightEdge: MoveTo: (6.3, -5.8)
StraightEdge: MoveTo: (4.4, -3.2)
ChangeStyle: MoveTo: (4.4, -3.2) FillStyle: 4|1 LineStyle: 0
StraightEdge: MoveTo: (6.15, -5.85)
StraightEdge: MoveTo: (6.25, -6.75)
ChangeStyle: MoveTo: (0, 0) FillStyle: 0|0 LineStyle: 0
После некоторых исследований я понял, как создать SVG (составленный из тегов пути) изэти данные.
ChangeStyle => start a new path => M x,y
StraightEdge => line => L x,y
CurvedEdge => curve => Q cx,cy,ax,ay
И для каждого пути:
FillStyle: {FillStyle0} | {FillStyle1} (0 => no fill style)
The index is related to the FillStyles array
LineStyle: {LineStyle} (0 => line style)
The index is related to the LineStyles array
Но это не правильный способ просмотра структуры.Используя JPEXS Decompiler , чтобы вручную экспортировать предыдущий образец формы, я получаю идеально прослеженный SVG.Вот сравнительный пример:
Мой результат против ожидаемого
Мой результат:
<path fill="rgba(185, 174, 154, 1)" fill-rule="evenodd" stroke="none" d="M 6.95 -10 L 7 -9.95 L 7.2 -9.65 L 7.1 -9.45 L 6.85 -9 L 6.95 -10" />
<path fill="rgba(217, 210, 197, 1)" fill-rule="evenodd" stroke="none" d="M 6.85 -9 Q 6.8 -7.95 6.9 -7.15 L 6.95 -6.25 L 6.95 -6.15 L 7 -6.15 L 6.85 -9" />
<path fill="rgba(142, 126, 102, 1)" fill-rule="evenodd" stroke="none" d="M 7 -6.15 L 6.95 -5.85 L 7 -6.15" />
<path fill="rgba(113, 96, 68, 1)" fill-rule="evenodd" stroke="none" d="M 6.95 -5.85 L 6.5 -5.2 L 4.15 -2.3 L 3.55 -2.15 L 6.95 -5.85" />
<path fill="rgba(142, 126, 102, 1)" fill-rule="evenodd" stroke="none" d="M 3.55 -2.15 Q 3.7 -3.9 5.35 -8.85 L 6.45 -10.85 Q 6.55 -10.45 6.95 -10 L 3.55 -2.15" />
<path fill="rgba(142, 126, 102, 1)" fill-rule="evenodd" stroke="none" d="M 6.95 -10 L 6.2 -8.9 L 6.95 -10" />
<path fill="rgba(185, 174, 154, 1)" fill-rule="evenodd" stroke="none" d="M 6.2 -8.9 L 6.85 -9 L 6.2 -8.9" />
<path fill="rgba(185, 174, 154, 1)" fill-rule="evenodd" stroke="none" d="M 6.2 -8.9 L 6.15 -7.85 L 6.15 -7.7 L 6.2 -7.55 L 6.2 -6.9 L 6.25 -6.75 L 6.2 -8.9" />
<path fill="rgba(142, 126, 102, 1)" fill-rule="evenodd" stroke="none" d="M 6.25 -6.75 L 6.35 -6.2 Q 6.4 -6 6.7 -5.95 L 7 -6.15 L 6.25 -6.75" />
<path fill="rgba(142, 126, 102, 1)" fill-rule="evenodd" stroke="none" d="M 4.4 -3.2 L 4.15 -2.95 L 3.55 -2.15 L 4.4 -3.2" />
<path fill="rgba(113, 96, 68, 1)" fill-rule="evenodd" stroke="none" d="M 6.95 -5.85 L 6.95 -5.9 L 6.8 -5.95 L 6.7 -5.95 L 6.5 -5.9 L 6.3 -5.8 L 4.4 -3.2 L 6.95 -5.85" />
И результат JPEXS:
<path d="M7.0 -6.15 L6.95 -5.85 6.95 -5.9 6.8 -5.95 6.7 -5.95 6.5 -5.9 6.3 -5.8 4.4 -3.2 6.15 -5.85 6.25 -6.75 6.35 -6.2 Q6.4 -6.0 6.7 -5.95 L7.0 -6.15" fill="#d9d2c5" fill-rule="evenodd" stroke="none" />
<path d="M6.95 -10.0 L7.0 -9.95 7.2 -9.65 7.1 -9.45 6.85 -9.0 6.2 -8.9 6.95 -10.0 M6.95 -5.85 L6.5 -5.2 4.15 -2.3 3.55 -2.15 4.15 -2.95 4.4 -3.2 6.3 -5.8 6.5 -5.9 6.7 -5.95 6.8 -5.95 6.95 -5.9 6.95 -5.85" fill="#8e7e66" fill-rule="evenodd" stroke="none" />
<path d="M6.85 -9.0 Q6.8 -7.95 6.9 -7.15 L6.95 -6.25 6.95 -6.15 7.0 -6.15 6.7 -5.95 Q6.4 -6.0 6.35 -6.2 L6.25 -6.75 6.2 -6.9 6.2 -7.55 6.15 -7.7 6.15 -7.85 6.2 -8.9 6.85 -9.0" fill="#b9ae9a" fill-rule="evenodd" stroke="none" />
<path d="M3.55 -2.15 Q3.7 -3.9 5.35 -8.85 L6.45 -10.85 Q6.55 -10.45 6.95 -10.0 L6.2 -8.9 6.15 -7.85 6.15 -7.7 6.2 -7.55 6.2 -6.9 6.25 -6.75 6.15 -5.85 4.4 -3.2 4.15 -2.95 3.55 -2.15" fill="#716044" fill-rule="evenodd" stroke="none" />
В общем, как я могу получить тот же правильно сформированный SVG из моей структуры данных?Я почти уверен, что есть подпрограмма с FillStyle0 и FillStyle1, но какая?
Спасибо за вашу помощь.