Added custom padding

VDSSample/ViewControllers/TileContainerViewController.swift

@@ -35,7 +35,7 @@ class TileContainerViewController: BaseViewController<TileContainer> {
     lazy var paddingPickerSelectorView = {
         PickerSelectorView(title: "16",
                            picker: self.picker,
-                           items: TileContainer.Padding.allCases)
+                           items: Padding.allCases)
     }()
     
     lazy var scalingTypePickerSelectorView = {
@@ -138,6 +138,7 @@ class TileContainerViewController: BaseViewController<TileContainer> {
     
     var gradientColorsFormStackView = FormSection().with { $0.isHidden = true }
     var backgroundColor: BackgroundColor = .secondary
+    var padding: Padding = .padding4X
     var clickableSwitch = Toggle()
     var showBackgroundImageSwitch = Toggle()
     var showBorderSwitch = Toggle()
@@ -147,12 +148,19 @@ class TileContainerViewController: BaseViewController<TileContainer> {
     var colorPickerType: ColorPickerType = .backgroundColor
     var backgroundImage = UIImage(named: "backgroundTest")!
     var selectedGradientColorView: UIView?
+    var customPaddingRowView: UIView?
+    var anyCancellable: AnyCancellable?
+    
     var contentAreaBackgroundColorButton = Button().with { instance in
         instance.size = .small
         instance.use = .secondary
         instance.text = "Select"
     }
-
+    
+    var paddingTextField = NumericField().with {
+        $0.placeholder = "Custom Padding"
+    }
+    
     var heightTextField = NumericField().with {
         $0.placeholder = "Minimum 100px else it will occupy full container"
     }
@@ -183,7 +191,9 @@ class TileContainerViewController: BaseViewController<TileContainer> {
         addFormRow(label: "Show Drop Shadow", view: showDropShadowSwitch)
         addFormRow(label: "Background Color", view: backgroundColorPickerSelectorView)
         addFormRow(label: "Padding", view: paddingPickerSelectorView)
-        let rowView = addFormRow(label: "Content area BG color(only for testing padding)", view: contentAreaBackgroundColorButton)
+        customPaddingRowView = addFormRow(label: "Custom Padding", view: paddingTextField)
+        customPaddingRowView?.isHidden = true
+        let rowView = addFormRow(label: "Content area BG color(only for padding validation)", view: contentAreaBackgroundColorButton)
         if let rowView = rowView as? UIStackView {
             rowView.alignment = .top
         }
@@ -195,6 +205,12 @@ class TileContainerViewController: BaseViewController<TileContainer> {
         gradientColorsFormStackView.addFormRow(label: "Gradient Color1", view: gradientColorView1)
         gradientColorsFormStackView.addFormRow(label: "Gradient Color2", view: gradientColorView2)
         append(section: gradientColorsFormStackView)
+        
+        anyCancellable = paddingTextField.textPublisher.receive(on: RunLoop.main).sink { [weak self] value in
+            if let value = Float(value) {
+                self?.component.padding = .custom(CGFloat(value))
+            }
+        }
 
         clickableSwitch.onChange = { [weak self] sender in
             guard let self else { return }
@@ -227,12 +243,14 @@ class TileContainerViewController: BaseViewController<TileContainer> {
             .numberPublisher
             .sink { [weak self] number in
                 self?.component.height = number?.cgFloatValue
+                self?.component.layoutIfNeeded()
             }.store(in: &subscribers)
 
         widthTextField
             .numberPublisher
             .sink { [weak self] number in
                 self?.component.width = number?.cgFloatValue
+                self?.component.layoutIfNeeded()
             }.store(in: &subscribers)
     }
     
@@ -240,7 +258,7 @@ class TileContainerViewController: BaseViewController<TileContainer> {
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
         backgroundColorPickerSelectorView.text = backgroundColor.rawValue
-        paddingPickerSelectorView.text = component.padding.rawValue
+        paddingPickerSelectorView.text = padding.rawValue
         scalingTypePickerSelectorView.text = component.aspectRatio.rawValue
         widthTextField.text = component.width != nil ? "\(component.width!)" : ""
         heightTextField.text = component.height != nil ? "\(component.height!)" : ""
@@ -285,7 +303,13 @@ class TileContainerViewController: BaseViewController<TileContainer> {
         }
         
         paddingPickerSelectorView.onPickerDidSelect = {  [weak self] item in
-            self?.component.padding = item
+            if let value = item.value {
+                self?.paddingTextField.text = ""
+                self?.component.padding = value
+                self?.customPaddingRowView?.isHidden = true
+            } else {
+                self?.customPaddingRowView?.isHidden = false
+            }
         }
         
         imageFallbackColorPickerSelectorView.onPickerDidSelect = {  [weak self] item in
@@ -401,4 +425,31 @@ extension TileContainerViewController {
     enum ColorPickerType {
         case backgroundColor, gradientColors, contentViewBackgroundColor
     }
+    
+    //Internal helper enum to map padding & pass custom padding values
+    public enum Padding: String, CaseIterable {
+        case padding2X
+        case padding4X
+        case padding6X
+        case padding8X
+        case padding12X
+        case custom
+        
+        public var value: TileContainer.Padding? {
+            return switch self {
+            case .padding2X:
+                    .padding2X
+            case .padding4X:
+                    .padding4X
+            case .padding6X:
+                    .padding6X
+            case .padding8X:
+                    .padding8X
+            case .padding12X:
+                    .padding12X
+            case .custom:
+                nil
+            }
+        }
+    }
 }