Font as common GraphicsElement

Author: swhitty

Examples/Basic.xcodeproj/project.pbxproj

@@ -8,6 +8,8 @@
 
 /* Begin PBXBuildFile section */
 		01BA4DA826820DE8001FF7B5 /* gradient-gratification-p3.svg in Resources */ = {isa = PBXBuildFile; fileRef = 01BA4DA726820DE8001FF7B5 /* gradient-gratification-p3.svg */; };
+		01F290A027D7839900743E2F /* transform-path.svg in Resources */ = {isa = PBXBuildFile; fileRef = 01F2909E27D7839800743E2F /* transform-path.svg */; };
+		01F290A127D7839900743E2F /* symbol-test.svg in Resources */ = {isa = PBXBuildFile; fileRef = 01F2909F27D7839900743E2F /* symbol-test.svg */; };
 		D90523452217927F00B3B94F /* mystery.svg in Resources */ = {isa = PBXBuildFile; fileRef = D90523442217927F00B3B94F /* mystery.svg */; };
 		D9126F0E24A6C19300859CC5 /* gradient-apple.svg in Resources */ = {isa = PBXBuildFile; fileRef = D9126F0D24A6C19200859CC5 /* gradient-apple.svg */; };
 		D918D26D22122A7300097C9A /* arc2.svg in Resources */ = {isa = PBXBuildFile; fileRef = D918D26C22122A7300097C9A /* arc2.svg */; };
@@ -60,6 +62,8 @@
 
 /* Begin PBXFileReference section */
 		01BA4DA726820DE8001FF7B5 /* gradient-gratification-p3.svg */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xml; path = "gradient-gratification-p3.svg"; sourceTree = "<group>"; };
+		01F2909E27D7839800743E2F /* transform-path.svg */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xml; path = "transform-path.svg"; sourceTree = "<group>"; };
+		01F2909F27D7839900743E2F /* symbol-test.svg */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xml; path = "symbol-test.svg"; sourceTree = "<group>"; };
 		D90523442217927F00B3B94F /* mystery.svg */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xml; path = mystery.svg; sourceTree = "<group>"; };
 		D9126F0D24A6C19200859CC5 /* gradient-apple.svg */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = "gradient-apple.svg"; sourceTree = "<group>"; };
 		D918D26C22122A7300097C9A /* arc2.svg */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xml; path = arc2.svg; sourceTree = "<group>"; };
@@ -147,6 +151,8 @@
 		D9ACD782220FDDE0009717CF /* Samples */ = {
 			isa = PBXGroup;
 			children = (
+				01F2909F27D7839900743E2F /* symbol-test.svg */,
+				01F2909E27D7839800743E2F /* transform-path.svg */,
 				D9C6E95827D4859C008194E5 /* symbol.refresh.svg */,
 				D9ACD78D220FDDE0009717CF /* arc.svg */,
 				D918D26C22122A7300097C9A /* arc2.svg */,
@@ -254,6 +260,7 @@
 			isa = PBXResourcesBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				01F290A127D7839900743E2F /* symbol-test.svg in Resources */,
 				D9ACD79E220FDDE0009717CF /* invalid.svg in Resources */,
 				D9126F0E24A6C19300859CC5 /* gradient-apple.svg in Resources */,
 				D98375B622500FCC00974D71 /* mask-composite.svg in Resources */,
@@ -275,6 +282,7 @@
 				D918D26D22122A7300097C9A /* arc2.svg in Resources */,
 				D9ACD79B220FDDE0009717CF /* arc.svg in Resources */,
 				D92A71FE27818B860001630A /* simple.svg in Resources */,
+				01F290A027D7839900743E2F /* transform-path.svg in Resources */,
 				D961846D220FDD1200C59D9B /* Assets.xcassets in Resources */,
 				D938A203268307670051E18B /* pattern-rotate.svg in Resources */,
 				D9ACD79D220FDDE0009717CF /* display.svg in Resources */,

Examples/Sources/ViewController.swift

@@ -65,7 +65,7 @@ class ViewController: UIViewController {
 
     override func loadView() {
         let imageView = UIImageView(frame: UIScreen.main.bounds)
-        imageView.image = Image(named: "symbol.refresh.svg")?.rasterize()
+        imageView.image = Image(named: "symbol-test.svg")?.rasterize()
         imageView.contentMode = .scaleAspectFit
         imageView.backgroundColor = .white
         self.view = imageView

SwiftDraw/DOM.Element.swift

@@ -49,7 +49,10 @@ protocol PresentationAttributes {
   var fill: DOM.Fill?  { get set }
   var fillOpacity: DOM.Float?  { get set }
   var fillRule: DOM.FillRule?  { get set }
-  
+
+  var fontFamily: String?  { get set }
+  var fontSize: Float?  { get set }
+
   var transform: [DOM.Transform]?  { get set }
   var clipPath: DOM.URL?  { get set }
   var mask: DOM.URL?  { get set }
@@ -75,7 +78,10 @@ extension DOM {
     var fill: DOM.Fill?
     var fillOpacity: DOM.Float?
     var fillRule: DOM.FillRule?
-    
+
+    var fontFamily: String?
+    var fontSize: Float?
+
     var transform: [DOM.Transform]?
     var clipPath: URL?
     var mask: URL?

SwiftDraw/DOM.Text.swift

@@ -35,13 +35,7 @@ extension DOM {
     var x: Coordinate?
     var y: Coordinate?
     var value: String
-    
-    var fontFamily: String?
-    var fontSize: Float?
-    
-    // var textLength: Coordinate
-    // var text: [TSpan] child nodes
-    
+
     init(x: Coordinate? = nil, y: Coordinate? = nil, value: String) {
       self.x = x
       self.y = y

SwiftDraw/LayerTree.Builder.swift

@@ -186,7 +186,12 @@ extension LayerTree.Builder {
   }
 
   static func makeTextAttributes(with state: State) -> LayerTree.TextAttributes {
-    return .normal
+      let fill = LayerTree.Color.create(from: state.fill.makeColor()).withAlpha(state.fillOpacity).maybeNone()
+      return LayerTree.TextAttributes(
+        color: fill,
+        fontName: state.fontFamily,
+        size: state.fontSize
+      )
   }
 
   func makePattern(for element: DOM.Pattern) -> LayerTree.Pattern {
@@ -249,6 +254,9 @@ extension LayerTree.Builder {
     var fillOpacity: DOM.Float
     var fillRule: DOM.FillRule
 
+    var fontFamily: String
+    var fontSize: DOM.Float
+
     init() {
       //default root SVG element state
       opacity = 1.0
@@ -265,6 +273,9 @@ extension LayerTree.Builder {
       fill = .color(.keyword(.black))
       fillOpacity = 1.0
       fillRule = .evenodd
+
+      fontFamily = "Helvetica"
+      fontSize = 12.0
     }
   }
 
@@ -285,6 +296,9 @@ extension LayerTree.Builder {
     state.fillOpacity = attributes.fillOpacity ?? existing.fillOpacity
     state.fillRule = attributes.fillRule ?? existing.fillRule
 
+    state.fontFamily = attributes.fontFamily ?? existing.fontFamily
+      state.fontSize = attributes.fontSize ?? existing.fontSize
+
     return state
   }
 }

SwiftDraw/LayerTree.Layer.swift

@@ -118,9 +118,5 @@ extension LayerTree {
     var color: Color
     var fontName: String
     var size: Float
-    
-    static var normal: TextAttributes {
-      return TextAttributes(color: .black, fontName: "Helvetica", size: 12.0)
-    }
   }
 }

SwiftDraw/Parser.XML.Element.swift

@@ -237,11 +237,13 @@ extension XMLParser {
     } catch {
       print(error)
     }
-    
-    
+
     el.fillOpacity = try att.parsePercentage("fill-opacity")
     el.fillRule = try att.parseRaw("fill-rule")
-    
+
+    el.fontFamily = (try att.parseString("font-family"))?.trimmingCharacters(in: .whitespacesAndNewlines)
+    el.fontSize = try att.parseFloat("font-size")
+
     if let val = try? att.parseString("transform") {
       el.transform = try parseTransform(val)
     }
@@ -269,6 +271,8 @@ extension PresentationAttributes {
     fill = attributes.fill
     fillOpacity = attributes.fillOpacity
     fillRule = attributes.fillRule
+    fontFamily = attributes.fontFamily
+    fontSize = attributes.fontSize
     transform = attributes.transform
     clipPath = attributes.clipPath
     mask = attributes.mask

SwiftDrawTests/LayerTree.LayerTests.swift

@@ -94,5 +94,14 @@ private extension LayerTree.Layer.Contents {
     let image = LayerTree.Image(mimeType: "image/png", data: Data(base64Encoded: "f00d")!)!
     return .image(image)
   }
+}
 
+extension LayerTree.TextAttributes {
+    static var normal: Self {
+        LayerTree.TextAttributes(
+            color: .black,
+            fontName: "Helvetica",
+            size: 12.0
+        )
+    }
 }