Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Demonstrates the use of offsetToPosition modifier
//
// OffsetToPositionDemo.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 15/01/2020.
// Copyright © 2020 Adam Fordyce. All rights reserved.
//
import SwiftUI
import PureSwiftUI
struct OffsetToPositionDemo: View {
@State private var phoneButtonPosition: CGPoint = .zero
@State private var showingDialer = true
var body: some View {
ZStack {
VStack(spacing: 20) {
ForEach(0..<3) { row in
HStack(spacing: 20) {
ForEach(0..<3) { column in
self.createDialerButton(row: row, column: column)
}
}
}
self.createDialerButton(row: 3, column: 0)
}
VStack(alignment: .center) {
TitleText("Conditionally off-setting dialer numbers to absolute position of phone button")
.align(.center)
Spacer()
HStack {
self.createPhoneButton()
.zIndex(1)
Spacer()
}
}
.padding()
}
}
func createPhoneButton() -> some View {
Button(action: {
self.showingDialer.toggle()
}) {
SFSymbol(.phone_down)
.dialerButtonStyle()
.rotateIfNot(showingDialer, -130.degrees)
.geometryReader { (geo: GeometryProxy) in
self.phoneButtonPosition = geo.globalCenter
}
.animation(Animation.easeInOut(duration: 1.5))
}
}
func createDialerButton(row: Int, column: Int) -> some View {
let index = row * 3 + column
return Text("\(index == 9 ? 0 : index + 1)")
.dialerButtonStyle()
.opacityIfNot(showingDialer, 0)
.rotateIfNot(showingDialer, 360.degrees)
.offsetToPositionIfNot(showingDialer, phoneButtonPosition)
.animation(Animation.easeInOut(duration: 0.75).delay(0.08 * index))
}
}
private struct DialerButtonViewModifier: ViewModifier {
public func body(content: Content) -> some View {
content
.font(Font.custom("Helvetica Neue", size: 50).weight(.thin))
.foregroundColor(.black)
.frame(80)
.clipCircleWithStroke(.black, lineWidth: 2, fill: Color.white)
.shadow(4)
}
}
private extension View {
func dialerButtonStyle() -> some View {
modifier(DialerButtonViewModifier())
}
}
struct OffsetToPositionDemo_Previews: PreviewProvider {
struct OffsetToPositionDemo_Harness: View {
var body: some View {
OffsetToPositionDemo()
}
}
static var previews: some View {
OffsetToPositionDemo_Harness()
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment