Skip to content

Instantly share code, notes, and snippets.

@CodeSlicing
Created February 9, 2022 21:44
Show Gist options
  • Save CodeSlicing/5500c4b695777f5402969c14862e94e7 to your computer and use it in GitHub Desktop.
Save CodeSlicing/5500c4b695777f5402969c14862e94e7 to your computer and use it in GitHub Desktop.
Source code for CodeSlicing episode on debouncing user input in a property wrapper
//
// DebounceStatePropertyWrapperDemo.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.
//
// Copyright © 2022 Adam Fordyce. All rights reserved.
//
import SwiftUI
import PureSwiftUI
import Combine
@propertyWrapper
private struct DebouncedState<Value>: DynamicProperty {
@StateObject private var backingState: BackingState
init(wrappedValue: Value, delay: Double = 0.3) {
self.init(initialValue: wrappedValue, delay: delay)
}
init(initialValue: Value, delay: Double = 0.3) {
_backingState = StateObject(wrappedValue: BackingState(initialValue: initialValue, delay: delay))
}
var wrappedValue: Value {
get {
backingState.debouncedValue
}
nonmutating set {
backingState.currentValue = newValue
}
}
var projectedValue: Binding<Value> {
$backingState.currentValue
}
private class BackingState: ObservableObject {
@Published var currentValue: Value
@Published var debouncedValue: Value
init(initialValue: Value, delay: Double) {
_currentValue = Published(initialValue: initialValue)
_debouncedValue = Published(initialValue: initialValue)
$currentValue
.debounce(for: .seconds(delay), scheduler: RunLoop.main)
.assign(to: &$debouncedValue)
}
}
}
struct DebounceStatePropertyWrapperDemo: View {
@DebouncedState(delay: 0.5) private var filterText = ""
@State private var counter = 0
var body: some View {
VStack(alignment: .leading) {
Text("Input text:")
TextEditor(text: $filterText)
.textEditorStyle()
Text("Debounced text:")
.padding(.top, 15)
Text(filterText)
.textOutputStyle()
ZStack {
Text("\(counter)")
.customFont(50, .light)
}
.frame(100)
.clipCircleWithStroke(.gray, lineWidth: 1, fill: .white)
.greedyWidth()
.yOffset(100)
}
.padding()
.onChange(of: filterText) { newValue in
counter += 1
}
}
}
private extension View {
func textEditorStyle() -> some View {
height(100)
.textBoxBorder()
}
func textOutputStyle() -> some View {
padding(5)
.height(100, .top)
.greedyWidth(.leading)
.background(.white)
.textBoxBorder()
}
func textBoxBorder() -> some View {
clipRoundedRectangleWithStroke(5, .gray, lineWidth: 1)
}
}
struct DebounceStatePropertyWrapperDemo_Previews: PreviewProvider {
struct DebounceStatePropertyWrapperDemo_Harness: View {
var body: some View {
DebounceStatePropertyWrapperDemo()
.greedyFrame()
.background(LinearGradient([.white(0.8), .white(0.5)], to: .bottomTrailing))
.ignoresSafeArea()
}
}
static var previews: some View {
DebounceStatePropertyWrapperDemo_Harness()
.previewDevice(.iPhone_13_Pro_Max)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment