diff --git a/Files/AnimatableCards.swift b/Files/AnimatableCards.swift new file mode 100644 index 0000000..406e17d --- /dev/null +++ b/Files/AnimatableCards.swift @@ -0,0 +1,122 @@ +// The MIT License (MIT) +// Copyright © 2019 Ivan Vorobei (hello@ivanvorobei.by) +// +// Permission is hereby granted, free of charge, to any person obtaining a copy +// of this software and associated documentation files (the "Software"), to deal +// in the Software without restriction, including without limitation the rights +// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +// copies of the Software, and to permit persons to whom the Software is +// furnished to do so, subject to the following conditions: +// +// The above copyright notice and this permission notice shall be included in all +// copies or substantial portions of the Software. +// +// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +// SOFTWARE. + +import SwiftUI + +struct ContentView: View { + + @GestureState var dragState = DragState.inactive + + var body: some View { + + let dragGester = DragGesture() + .updating($dragState) { (value, state, transaction) in + state = .dragging(translation: value.translation) + } + + return ZStack { + Card(title: "Third card") + .rotation3DEffect(Angle(degrees: dragState.isActive ? 0 : 60), axis: (x: 10.0, y: 10.0, z: 10.0)) + .blendMode(.hardLight) + .padding(dragState.isActive ? 32 : 64) + .padding(.bottom, dragState.isActive ? 32 : 64) + .animation(.spring()) + Card(title: "Second Card") + .rotation3DEffect(Angle(degrees: dragState.isActive ? 0 : 30), axis: (x: 10.0, y: 10.0, z: 10.0)) + .blendMode(.hardLight) + .padding(dragState.isActive ? 16 : 32) + .padding(.bottom, dragState.isActive ? 0 : 32) + .animation(.spring()) + MainCard(title: "Main Card") + .offset( + x: dragState.translation.width, + y: dragState.translation.height + ) + .rotationEffect(Angle(degrees: Double(dragState.translation.width / 10))) + .shadow(radius: dragState.isActive ? 8 : 0) + .animation(.spring()) + .gesture(dragGester) + } + + } + + enum DragState { + + case inactive + case dragging(translation: CGSize) + + var translation: CGSize { + switch self { + case .inactive: + return .zero + case .dragging(let translation): + return translation + } + } + + var isActive: Bool { + switch self { + case .inactive: + return false + case .dragging: + return true + } + } + } +} + +struct Card: View { + + var title: String + + var body: some View { + ZStack { + Rectangle() + .fill(Color(red: 68 / 255, green: 41 / 255, blue: 182 / 255)) + .frame(height: 230) + .cornerRadius(10) + .padding(16) + Text(title) + .color(.white) + .font(.title) + .bold() + } + } +} + +struct MainCard: View { + + var title: String + + var body: some View { + ZStack { + Rectangle() + .fill(Color.black) + .frame(height: 230) + .cornerRadius(10) + .padding(16) + Text(title) + .color(.white) + .font(.largeTitle) + .bold() + } + } +}