SwiftUI
-
MarqueeSwiftUI 2025. 3. 18. 19:00
안녕하세요. 그린입니다 🍏이번 포스팅에서는 Marquee에 대해 알아보고 간단히 SwiftUI로 구현해보려고 합니다. 🙋🏻 Marquee?Marquee는 텍스트가 좌우 혹은 상하 형태로 자동으로 이동하는 UI 요소입니다.일반적인 쓰임으로는 많이들 보셨듯, 공지사항이나 주식 시세와 같은 표시 등에서 많이 사용됩니다!어떤건지는 아래 실제 구현하면서 더 자세히 볼께요ㅎㅎUIKit에서는 UIView.animate를 활용해 Marquee 효과를 구현해볼 수 있죠.그런데 이번 포스팅은 SwiftUI에 초점이라 GeometryReader, Animation 등을 조합해 한번 Marquee 컴포넌트를 만들어볼까 합니다. 그럼 시작해볼까요?Marquee in SwiftUI코드부터 보시죠! struct Content..
-
DynamicTypeSize로 접근성 높이기 (feat. SwiftUI)SwiftUI 2025. 1. 24. 16:42
안녕하세요. 그린입니다 🍏이번 포스팅에서는 SwiftUI에서 DynamicTypeSize로 접근성을 높이는것에 대해 학습해보겠습니다 🙋🏻 우선 DynamicTypeSize이 뭔지 알아야겠죠? DynamicTypeSize로 접근성 높이기SwiftUI에서 제공하는 동적 텍스트 크기 조정 시스템이라고 볼 수 있어요.사용자의 접근성 설정에 따라 앱의 텍스트 크기를 자동으로 조절할 수 있게 해주죠. iOS 15.0 부터 사용이 가능하며, 정의는 아래와 같아요. enum DynamicTypeSize 열거 타입이며 케이스들로는 아래와 같이 type size와 accessibility type size로 구분할 수 있습니다. .xSmall // 가장 작은 크기.small // 작은 크기.m..
-
SwiftUI - ScrollBounceBehaviorSwiftUI 2025. 1. 20. 19:47
안녕하세요. 그린입니다 🍏이번 포스팅은 SwiftUI의 ScrollBounceBehavior에 대해 관련하여 알아보려 합니다 🙋🏻 생각보다 간단하지만 유용한 기능이니 가볍게 봐볼까요? ScrollBounceBehavior?iOS 16.4 이상에서부터 사용 가능한 타입으로, 스크롤 가능한 뷰가 컨텐츠 끝에 도달했을 때 튀어오르는 방식을 정의합니다. struct ScrollBounceBehavior 해당 구조체 타입에는 아래 세가지로 기본 정의가 되어 있어요. 1️⃣ automatic - 기본값으로 플랫폼과 상황에 따라서 적절한 바운스 동작을 자동으로 결정2️⃣ always - 컨텐츠 크기와 상관없이 항상 바운스 효과를 가짐3️⃣ basedOnSize - 컨텐츠 크기에 따라 바운스 효과가 결정 여기서 ..
-
SwiftUI 스크롤 뷰의 임계값 삽질하기SwiftUI 2025. 1. 16. 19:00
안녕하세요. 그린입니다 🍏이번 포스팅에서는 어떠한 학습 정보 전달보다는 그냥 삽질을 하는 과정과 그걸 기록해보는 포스팅입니다 🙋🏻 SwiftUI의 스크롤 뷰의 임계값 삽질하기우선, 아래 코드를 봐볼까요? import SwiftUIstruct ContentView: View { var body: some View { ScrollView { VStack(spacing: 50) { Rectangle() .fill(.red) .frame(height: 100) Rectangle() .fill(.green) .frame(height: 100) Rectangle()..
-
SwiftUI에서 UUID를 활용한 뷰 갱신 업데이트SwiftUI 2025. 1. 9. 18:53
안녕하세요. 그린입니다 🍏이번 포스팅에서는 SwiftUI에서 실제 많이 사용될 수 있는 UUID를 활용한 뷰 갱신 업데이트에 대해 알아보겠습니다 🙋🏻 무엇을 해보는걸까?SwiftUI로 만약 애니메이션을 구현하거나 할 때 가장 까다로울 수 있는 부분이 상태 변경 시 애니메이션을 새로 시작하는것이죠.특히, Lottie와 같은 서드파티 애니메이션 라이브러리를 사용할 때 이러한 문제가 더욱 두드러질 수 있습니다.그래서 이번에 UUID를 활용하여 해결해보고자 합니다. 문제 상황우선 간단한 로티를 사용한 코드를 볼께요. import Lottieimport SwiftUI// 첫 번째 화면struct FirstView: View { @State var isGrowUp: Bool = false var actio..
-
SwiftUI Text에 stroke 적용하기 (feat. UIKit)SwiftUI 2025. 1. 2. 18:49
안녕하세요. 그린입니다 🍏이번 포스팅에서는 SwiftUI Text에 stroke를 적용하는 두번째 방법에 대해 알아보겠습니다 🙋🏻 이전 첫번째 방법에 대해 기술한적이 있어요. SwiftUI의 Text에 stroke 적용하기안녕하세요. 그린입니다 🍏이번 포스팅에서는 SwiftUI의 Text에 테두리에 stroke를 넣는 방법에 대해 한번 구현해보겠습니다 🙋🏻 간단하기도 하고 제가 필요해서 한번 모디파이어로 빼보면서 만green1229.tistory.com 해당 방법에서는 SwiftUI Text 자체에 shadow를 적절히 주어 표현했었는데요.한계가 있었습니다.stroke 두께를 늘릴수록 shadow가 크게 적용되고 그에 따라 사실 상 aliasing, 계단 현상으로 디자인이 매끄럽지 못하게 나..
-
SwiftUI의 Custom Grid로 카테고리 뷰 구현하기SwiftUI 2024. 12. 23. 18:55
안녕하세요. 그린입니다 🍏이번 포스팅에서는 SwiftUI의 Custom Grid를 적절히 구현하여 우리가 많이 접할 수 있는 카테고리 뷰 시스템을 한번 만들어보려고 합니다 🙋🏻 오늘의 포스팅은 새로운 지식의 습득보다는 실제 많이 쓰일 수 있는 뷰 개발에 초점을 맞춰 코드가 많습니다 😃 SwiftUI의 Custom Grid로 카테고리 뷰 구현하기그럼 가장 먼저 오늘 어떤걸 구현해볼지 결과물부터 보고 가볼까요? 자 요런걸 만드려고 합니다! 일반적인 메인 카테고리와 그 메인 카테고리를 선택하면 나오는 서브 카테고리의 형태 구조입니다.물론, 카테고리 형태는 정말 다양하겠지만 이렇게 서브 카테고리에 대해서 그리드로 한번 작업해보려고 합니다.여기서 저는 예시로 우리가 많이 접할 수 있는 회원 정보를 입력하..
-
UIGestureRecognizerRepresentable 사용하기SwiftUI 2024. 12. 16. 18:55
안녕하세요. 그린입니다 🍏이번 포스팅에서는 SwiftUI의 UIGestureRecognizerRepresentable에 대해 학습해보겠습니다 🙋🏻 UIGestureRecognizerRepresentable?UIGestureRecognizerRepresentable는 이번 WWDC 2024에서 소개되었는데요.iOS 18이상에서 사용 가능합니다. UIGestureRecognizerRepresentable는 SwiftUI에서 UIKit의 제스처 인식기를 사용할 수 있게 해주는 프로토콜이에요.우리 UIViewRepresentable이 SwiftUI에서 UIKit의 뷰를 사용할 수 있게 도와주는 프로토콜이었던것과 같은 맥락이죠.해당 프로토콜을 통해서 우리는 SwiftUI 뷰에서 UIKit의 다양한 제스처 인..