SwiftUI stick dragging with two states

TwoStateStickyDrag.swift

//
//  TwoStateStickyDrag.swift
//
//  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 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.
//
//  Created by Adam Fordyce on 10/01/2020.
//  Copyright © 2020 Adam Fordyce. All rights reserved.
//

import SwiftUI
import PureSwiftUI

struct TwoStateStickyDrag: View {
    
    var body: some View {
        GeometryReader { (geo: GeometryProxy) in
            HStack {
                TwoStateStickyShape(color: .red, size: geo.widthScaled(0.3), stickyThreshold: geo.heightScaled(0.3))
                TwoStateStickyShape(color: .green, size: geo.widthScaled(0.3), stickyThreshold: geo.heightScaled(0.3))
                TwoStateStickyShape(color: .blue, size: geo.widthScaled(0.3), stickyThreshold: geo.heightScaled(0.3))
            }
            .greedyFrame()
            .vPadding()
        }
    }
}

struct TwoStateStickyShape: View {
    
    let color: Color
    let size: CGFloat
    let stickyThreshold: CGFloat
    
    @State private var stuck = true
    @State private var top = true
    @State private var translation: CGSize = .zero
    
    var scaleForTranslation: CGFloat {
        if self.stuck {
            return 1 + abs(translation.y) / size
        } else {
            return 1
        }
    }
    
    var offsetForTranslation: CGFloat {
        if self.stuck {
            return translation.y / 2
        } else {
            return translation.y
        }
    }
    
    var body: some View {
        GeometryReader { (geo: GeometryProxy) in
            VStack {
                Frame(self.size, self.color)
                    .shadow(5)
                    .yScale(self.scaleForTranslation)
                    .yOffsetIfNot(self.top, geo.height - self.size)
                    .yOffset(self.offsetForTranslation)
                    .gesture(DragGesture(minimumDistance: 0)
                        .onChanged(self.onChanged)
                        .onEnded { gesture in
                            self.onEnded(gesture, geo: geo)
                        }
                )
                    .animation(.spring(response: 0.2, dampingFraction: 0.4, blendDuration: 1))
                Spacer()
            }
        }
        .width(size)
    }
    
    func onChanged(_ gesture: DragGesture.Value) {
        if self.translation == .zero {
            self.stuck = true
        } else if self.stuck {
            self.stuck = abs(self.translation.y) < stickyThreshold
        }
        self.translation = gesture.translation
    }
    
    func onEnded(_ gesture: DragGesture.Value, geo: GeometryProxy) {
        self.translation = .zero
        self.top = gesture.location.y <= geo.heightScaled(0.5)
    }
}

struct TwoStateStickyDrag_Previews: PreviewProvider {
    struct TwoStateStickyDrag_Harness: View {
        
        var body: some View {
            TwoStateStickyDrag().previewDevice(.iPhone_8)
        }
    }
    
    static var previews: some View {
        TwoStateStickyDrag_Harness()
    }
}