Merge pull request #93 from componentskit/fix-button-image-color

set tint color for button's image

Author: mikhailChelbaev

Examples/DemosApp/DemosApp/Assets.xcassets/avatar_placeholder.imageset/Contents.json

@@ -17,5 +17,8 @@
   "info" : {
     "author" : "xcode",
     "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
   }
 }

Sources/ComponentsKit/Components/Avatar/Models/AvatarVM.swift

@@ -95,7 +95,7 @@ extension AvatarVM {
       self.placeholderBackgroundColor.setFill()
       UIBezierPath(rect: CGRect(origin: .zero, size: size)).fill()
 
-      icon?.withTintColor(self.placeholderForegroundColor, renderingMode: .alwaysOriginal).draw(in: CGRect(
+      icon?.withTintColor(self.placeholderForegroundColor).draw(in: CGRect(
         x: (size.width - iconSize.width) / 2,
         y: (size.height - iconSize.height) / 2,
         width: iconSize.width,

Sources/ComponentsKit/Components/Button/SUButton.swift

@@ -59,19 +59,31 @@ public struct SUButton: View {
       SULoading(model: self.model.preferredLoadingVM)
       Text(self.model.title)
     case (false, let uiImage?, .leading) where self.model.title.isEmpty:
-      ButtonImageView(image: uiImage)
-        .frame(width: self.model.imageSide, height: self.model.imageSide)
+      ButtonImageView(
+        image: uiImage,
+        tintColor: self.model.foregroundColor.uiColor
+      )
+      .frame(width: self.model.imageSide, height: self.model.imageSide)
     case (false, let uiImage?, .leading):
-      ButtonImageView(image: uiImage)
-        .frame(width: self.model.imageSide, height: self.model.imageSide)
+      ButtonImageView(
+        image: uiImage,
+        tintColor: self.model.foregroundColor.uiColor
+      )
+      .frame(width: self.model.imageSide, height: self.model.imageSide)
       Text(self.model.title)
     case (false, let uiImage?, .trailing) where self.model.title.isEmpty:
-      ButtonImageView(image: uiImage)
-        .frame(width: self.model.imageSide, height: self.model.imageSide)
+      ButtonImageView(
+        image: uiImage,
+        tintColor: self.model.foregroundColor.uiColor
+      )
+      .frame(width: self.model.imageSide, height: self.model.imageSide)
     case (false, let uiImage?, .trailing):
       Text(self.model.title)
-      ButtonImageView(image: uiImage)
-        .frame(width: self.model.imageSide, height: self.model.imageSide)
+      ButtonImageView(
+        image: uiImage,
+        tintColor: self.model.foregroundColor.uiColor
+      )
+      .frame(width: self.model.imageSide, height: self.model.imageSide)
     case (false, _, _):
       Text(self.model.title)
     }
@@ -88,16 +100,20 @@ private struct ButtonImageView: UIViewRepresentable {
   }
 
   let image: UIImage
+  let tintColor: UIColor
 
   func makeUIView(context: Context) -> UIImageView {
     let imageView = InternalImageView()
     imageView.image = self.image
+    imageView.tintColor = self.tintColor
     imageView.contentMode = .scaleAspectFit
+    imageView.isUserInteractionEnabled = true
     return imageView
   }
 
   func updateUIView(_ imageView: UIImageView, context: Context) {
     imageView.image = self.image
+    imageView.tintColor = self.tintColor
   }
 }
 

Sources/ComponentsKit/Components/Button/UKButton.swift

@@ -250,6 +250,8 @@ extension UKButton {
       imageView.image = model.image
       imageView.contentMode = .scaleAspectFit
       imageView.isHidden = model.isLoading || model.imageSrc.isNil
+      imageView.tintColor = model.foregroundColor.uiColor
+      imageView.isUserInteractionEnabled = true
     }
   }
 }