Fixes and improvements (#5)

* EditActionColor removed Smooth animation added ZStack changed to HStack - Can be used with views with opacity background closed #4 Hide showed actions when other cell taped README updated
mroffmix · Oct 21, 2020 · 1d2b22b · 1d2b22b
1 parent 3d5137c
commit 1d2b22b
Show file tree

Hide file tree

Showing 11 changed files with 205 additions and 160 deletions.
diff --git a/README.md b/README.md
@@ -56,24 +56,29 @@ Added an example project, with **iOS** target: https://github.com/mroffmix/Swipe
 ### Create array of actions
 
 ```swift
-var leftActions = [
-        Action(title: "Note", iconName: "pencil", bgColor: .note, action: {}),
-        Action(title: "Edit doc", iconName: "doc.text", bgColor: .edit, action: {}),
-        Action(title: "New doc", iconName: "doc.text.fill", bgColor: .done, action: {})
-    ]   
-var rightActions = [Action(title: "Delete", iconName: "trash", bgColor: .delete, action: {})]
+let left = [
+    Action(title: "Note", iconName: "pencil", bgColor: .red, action: {}),
+    Action(title: "Edit doc", iconName: "doc.text", bgColor: .yellow, action: {}),
+    Action(title: "New doc", iconName: "doc.text.fill", bgColor: .green, action: {})
+]
+
+let right = [
+    Action(title: "Note", iconName: "pencil", bgColor: .blue, action: {}),
+    Action(title: "Edit doc", iconName: "doc.text", bgColor: .yellow, action: {})
+]
 ```
 ### Create SwipeableView
 ```swift
 SwipeableView(content: {
-
-  // your view content here
-
-  },
-  leftActions: Example.leftActions,
-  rightActions: Example.rightActions,
-  rounded: false)
-  .frame(height: 90)
+    GroupBox {
+        Text("View content")
+            .frame(maxWidth: .infinity, maxHeight: .infinity)
+    }
+},
+leftActions: left,
+rightActions: right,
+rounded: true
+).frame(height: 90)
 ```
 
 ![Swipeable View](https://github.com/mroffmix/SwipebleView/blob/main/Resources/IndependedView.gif)
@@ -94,7 +99,7 @@ leftActions: Example.leftActions,
 rightActions: Example.rightActions,
 rounded: true,
 container: container)
-.frame(height: 140)
+.frame(height: 100)
 ```
 Views behaviour in a container
 

diff --git a/Resources/IndependedView.gif b/Resources/IndependedView.gif
diff --git a/Resources/ViewsInAContainer.gif b/Resources/ViewsInAContainer.gif
diff --git a/Resources/WholeScreen.gif b/Resources/WholeScreen.gif
diff --git a/Resources/sample.gif b/Resources/sample.gif
diff --git a/Sources/SwipeableView/View/EditActions.swift b/Sources/SwipeableView/View/EditActions.swift
@@ -31,13 +31,17 @@ public struct EditActions: View {
                 .padding(.bottom, 8)
             #endif
             #if os(iOS)
-            Image(systemName: action.iconName)
-                .font(.system(size: 20))
-                .padding(.bottom, 8)
+            if getWidth() > 35 {
+                Image(systemName: action.iconName)
+                    .font(.system(size: 20))
+                    .padding(.bottom, 8)
+                    .opacity(getWidth() < 30 ? 0.1 : 1 )
+            }
+
             #endif
             if viewModel.actions.count < 4 && height > 50 {
 
-                Text(action.title)
+                Text(getWidth() > 70 ? action.title : "")
                     .font(.system(size: 10, weight: .semibold))
                     .multilineTextAlignment(.center)
                     .lineLimit(3)
@@ -46,17 +50,36 @@ public struct EditActions: View {
         }
         .padding()
         .frame(width: getWidth(), height: height)
-        .background(action.bgColor.value.saturation(0.8))
+        .background(action.bgColor.opacity(getWidth() < 30 ? 0.1 : 1 ))
         .cornerRadius(rounded ? 10 : 0)
 
     }
     private func getWidth() -> CGFloat {
-        let width = CGFloat(abs(offset.width) / CGFloat(viewModel.actions.count))
 
-        if width < 80  {
-            return 80
+        let width = CGFloat(offset.width / CGFloat(viewModel.actions.count))
+        // - left / + right
+        switch side {
+        case .left:
+            if width < 0 {
+                return addPaddingsIfNeeded(width: abs(width))
+            } else {
+                return 0
+            }
+        case .right:
+            if width > 0 {
+                return addPaddingsIfNeeded(width: abs(width))
+            } else {
+                return 0
+            }
+        }
+
+    }
+
+    private func addPaddingsIfNeeded(width:CGFloat) -> CGFloat {
+        if rounded {
+            return width - 5 > 0 ? width - 5 : 0
         } else {
-            return rounded ? width - 5 : width
+            return width
         }
     }
 
@@ -117,27 +140,27 @@ public struct EditActions: View {
 struct EditActions_Previews: PreviewProvider {
 
     static var actions = [
-        Action(title: "No interest", iconName: "trash", bgColor: .delete, action: {}),
-        Action(title: "Request offer", iconName: "doc.text", bgColor: .edit, action: {}),
-        Action(title: "Order", iconName: "doc.text.fill", bgColor: .delete, action: {}),
-        Action(title: "Order provided", iconName: "car", bgColor: .done, action: {}),
+        Action(title: "No interest", iconName: "trash", bgColor: .red, action: {}),
+        Action(title: "Request offer", iconName: "doc.text", bgColor: .yellow, action: {}),
+        Action(title: "Order", iconName: "doc.text.fill", bgColor: .red, action: {}),
+        Action(title: "Order provided", iconName: "car", bgColor: .green, action: {}),
     ]
     static var previews: some View {
         Group {
 
-            EditActions(viewModel: EditActionsVM(actions, maxActions: 4), offset: .constant(.zero), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .right, rounded: false)
+            EditActions(viewModel: EditActionsVM(actions, maxActions: 4), offset: .constant(CGSize.init(width: 300, height: 10)), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .right, rounded: false)
                 .previewLayout(.fixed(width: 450, height: 400))
 
-            EditActions(viewModel: EditActionsVM(actions, maxActions: 4), offset: .constant(.zero), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .left, rounded: false)
+            EditActions(viewModel: EditActionsVM(actions, maxActions: 4), offset: .constant(CGSize.init(width: -300, height: 10)), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .left, rounded: false)
                 .previewLayout(.fixed(width: 450, height: 100))
 
-            EditActions(viewModel: EditActionsVM(actions, maxActions: 2), offset: .constant(.zero), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .left, rounded: false)
+            EditActions(viewModel: EditActionsVM(actions, maxActions: 2), offset: .constant(CGSize.init(width: -300, height: 10)), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .left, rounded: false)
                 .previewLayout(.fixed(width: 450, height: 150))
 
-            EditActions(viewModel: EditActionsVM(actions, maxActions: 3), offset: .constant(.zero), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .right, rounded: true)
+            EditActions(viewModel: EditActionsVM(actions, maxActions: 3), offset: .constant(CGSize.init(width: 300, height: 10)), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .right, rounded: true)
                 .previewLayout(.fixed(width: 450, height: 100))
 
-            EditActions(viewModel: EditActionsVM(actions, maxActions: 4), offset: .constant(.zero), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .left, rounded: true)
+            EditActions(viewModel: EditActionsVM(actions, maxActions: 4), offset: .constant(CGSize.init(width: -300, height: 10)), state: .constant(.center), onChangeSwipe: .constant(.noChange), side: .left, rounded: true)
                 .previewLayout(.fixed(width: 550, height: 180))