본문 바로가기

728x90

🍎 iOS138

[iOS/UI] 특정 부분만 투명하게 만들기 (feat. fillRule, evenOdd) 안녕하세요 Foma 입니다! 오늘은 프로젝트 진행 중에 특정 부분만 투명하게 해서 그 부분만 보이게 하는 기능을 만드는 법에 대해 정리해 보려고 합니다. 바로 시작할게요~ Preview Add a label 배경에 레이블을 하나 넣어 투명한지 아닌지 확인하기 쉽게 만들어 주겠습니다. let label = UILabel(frame: CGRect(x: view.center.x - 100, y: view.center.y - 100, width: 200, height: 200)) label.backgroundColor = .systemBlue label.textColor = .white label.font = UIFont.boldSystemFont(ofSize: 20) label.text = "Fomagran".. 2022. 7. 31.

[WWDC 2022] Swift로 프로토콜 인터페이스 설계하기 (Design protocol interface in Swift) 안녕하세요 Foma 입니다! 오늘은 저번 글인 Embrace Swift Generics에서 계속 언급하던 Design protocol interface in Swift 세션에 대해서 다뤄보려고 합니다! (저번 글과 많이 연관되어 있으니 안보신 분들은 꼭 여기 에서 보고 와주세요!) 바로 시작할게요~ Understand type erasure 가장 먼저 타입 이레이져에 대해서 알아보도록 하겠습니다. (erasure를 정확히 어떻게 해석해야 할지 모르겠네요.. 삭제? 지움?) 가장 먼저 동물 프로토콜을 살펴보도록 하겠습니다. 동물 프로토콜은 associatedtype으로 먹이타입과 생산품타입이 있고, 메서드로 먹이타입을 파라미터로 받는 eat, 생산품 타입을 반환하는 produce 메서드가 있습니다. pro.. 2022. 7. 11.

[WWDC 2022] 제너릭과 프로토콜을 사용해 코드 추상화하기 (feat. some,any) (Embrace Swift generics) 안녕하세요 Foma 입니다! 오늘은 WWDC 2022에서 제너릭과 프로토콜을 사용하여 정석(?)으로 코드를 추상화하는 방법에 대해 다룬 Embrace Swift generics 세션에 대해 정리해 보려고 합니다. 바로 시작할게요~ (제 방식대로 해석하여 정리하는 것이니 틀린 점이나 궁금한 점이 있다면 언제든 댓글로 알려주세요!) Model with concrete types 가장 먼저 어떠한 것도 추상화나 제너릭을 사용하지 않고 있는 그대로 즉, 구체적인 타입을 이용해서 농장 시스템을 구현해 보겠습니다. 농장에 소가 있다고 가정하고, 그 소는 건초(Hay)를 먹는 struct를 생성해 주겠습니다. struct Cow { func eat(_ food:Hay) {...} } 이제 소가 먹는 건초는 자라면 알.. 2022. 7. 10.

[WWDC 2022] 기존 UIKit 앱에 SwiftUI 적용하기 (Use SwiftUI with UIKit) 안녕하세요 Foma 입니다! 예전부터 WWDC 내용을 정리하고 싶었는데 드디어 오늘 WWDC에 대해 글을 작성하게 되네요. WWDC 2022에서 가장 관심을 끌었던 세션은 UIKit 앱에 SwiftUI를 적용하는 세션이었는데요. 해당 세션을 직접 구현해 보고 정리해 보도록 하겠습니다. 바로 시작할게요~ (Xcode 14 Beta로 진행되기 때문에 혹시 미리 경험하고 싶은 분들은 여기 에서 다운로드 받아서 진행해 주세요~) Preview UIHostingController UIHostingController는 SwiftUI 뷰를 포함한 UIViewController입니다. UIHostingController를 이용하여 UIViewController에서 SwiftUI 뷰를 팝업 형식으로 띄워보도록 하겠습니다.. 2022. 7. 9.

[iOS/UI] UIBezierPath 쉽게 사용하기 (feat. EasierPath) 안녕하세요 Foma 💻 입니다! 오늘은 직접 원하는 모양을 그릴 수 있는 UIBezierPath를 더욱 쉽게 사용할 수 있는 EasierPath에 대해서 알아 보겠습니다. 바로 시작할게요~! UIBezierPath 평소에 원하는 모양을 직접 커스텀해서 그릴 때 UIBezierPath를 자주 사용 했었는데요. 먼저 UIBezierPath를 이용해서 항아리 모양을 그리는 코드를 작성해 보겠습니다. 1. UIBezierPath 인스턴스를 생성해 그려준다. let bezierPath:UIBezierPath = UIBezierPath() bezierPath.move(to: CGPoint(x: 100, y: 100)) bezierPath.addLine(to: CGPoint(x: 200, y: 100)) bezier.. 2022. 5. 30.

[iOS/UI] UIBezierPath 안을 Gradient 컬러로 채우기 (Fill a UIBezierPath with Gradient Color) 안녕하세요 Foma💻 입니다! 오늘은 UIBezierPath 안을 Gradient 컬러로 채우는 방법에 대해서 알아보도록 하겠습니다. 바로 시작할게요~ TestView 뷰를 아래와 같이 초기화 해줍니다. class TestView: UIView { override init(frame: CGRect) { super.init(frame: frame) } required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") } override func draw(_ rect: CGRect) { } } UIBezierPath 이제 UIBezierPath를 draw 메서드 안에 그려보겠습니다. 타원형 경로를 아래와 같이 생성해 줍니다.. 2022. 5. 2.

[SwiftUI] GeometryReader란? (feat. GeometryProxy,CoordinateSpace) 안녕하세요 Foma 💻 입니다! 오늘은 SwitUI를 이용해서 Layout을 잡을 때 아주 유용하게 사용되는 GeometryReader에 대해서 알아보려고 합니다. 바로 시작할게요~ GeometryReader란? 이름을 직역하면 Geometry는 기하학을 나타내니깐, 기하학적인 무언가를 읽는 것이라고 해석할 수 있는데요. 공식 문서에도 이름을 직역한 것과 비슷하게 "컨텐츠의 크기와 위치를 함수로 나타내는 컨테이너 뷰야!" 라고 소개합니다. GeometryReader를 초기화 하는 방법은 아래와 같이 컨텐츠를 만드는데 GeometryProxy를 이용해서 만듭니다. GeometryProxy란? 그렇다면 GeometryProxy는 무엇일까요? 우선 Proxy의 뜻은 무엇인가를 대신 한다는 의미를 나타냅니다. .. 2022. 4. 4.

[SwiftUI] 자연스러운 화면전환 애니메이션 구현하기 (feat. matchedGeometryEffect,Namespace) 안녕하세요 Foma 💻 입니다! 평소에 AppStore를 보면 화면 간 전환할 때 자연스러운 애니메이션이 많이 보았는데, '이건 어떻게 구현했을까' 라는 생각이 많이 들어 글을 정리하게 되었습니다. 바로 시작할게요~ Preview @Namespace 화면 전환 애니메이션을 구현하기 위해선 @Namespace 프로퍼티 래퍼가 필요합니다. @Namespace는 공식 문서엔 아래와 같이 소개합니다. 속성을 포함하는 개체(예: view)의 영구 ID로 정의된 네임스페이스에 대한 액세스를 허용하는 동적 속성 유형입니다. 간단하게 말하면 객체의 정보를 ID와 함께 기억하고 있는 래퍼입니다. 이 ID를 통해서 정보를 다른 뷰와 공유할 수 있으며, 이것을 통해 지오메트리 애니메이션이 가능해 집니다. 선언하는 방식은 아.. 2022. 3. 28.

[iOS/UI] UIBezierPath의 거의 모든 것 (feat. 모양,곡선,직선 그리기) 안녕하세요 Foma 💻 입니다! 오늘은 원하는 모양을 직접 그릴 수 있는 UIBezierPath에 대해서 알아보려고 합니다. 예전부터 다루고 싶은 주제였는데 드디어 정리하게 되네요..! 바로 시작할게요~ UIBezierPath란? UIBezierPath는 UIKit에서 그리기(Drawing)에 속해있는 클래스입니다. 그러므로 어떤 것을 그리기 위한 기능들이 속해있겠죠? 애플 공식 문서에는 아래와 같이 정의하고 있습니다. A path that consists of straight and curved line segments that you can render in your custom views. 해석하면 view에서 렌더링 할 수 있는 직선과 곡선으로 구성된 경로라고 하네요. Initializer Bez.. 2022. 3. 21.

[iOS/UI] CALayer란? (feat. 애니메이션 원리) 안녕하세요 Foma 💻 입니다! 저번 시간에 Core Animation에 대한 글을 작성했는데요. Core Animation을 공부하다 보니 Layer가 거의 전부라고 해도 되겠더라구요.. 그래서 따로 Layer에 대해 정리하는 글을 작성하게 되었습니다. (혹시 Core Animation에 대해 잘 모르시는 분들으 여기 에서 확인해주세요!) 바로 시작할게요~ CALayer란? Layer의 사전적 의미는 겹,막,층,단계를 뜻합니다. 사전적 의미와 같이 iOS에서도 아래와 같이 계층으로 사용되는 되는데요. 정확하게는 이미지 기반 컨텐츠를 관리하고 해당 컨텐츠에서 애니메이션을 수행할 수 있도록 하는 개체입니다. 즉, 배경색,테두리 및 그림자와 같이 설정할 수 있는 화면에 표시할 수 있는 시각적 속성을 관리하는.. 2022. 3. 17.

[iOS/UI] Core Animation이란? (feat. CALayer) 안녕하세요 Foma 💻 입니다! 오늘은 애니메이션이 작동되는 원리에 대해 더 깊게 이해하기 위해서 iOS에서 애니메이션 시스템을 담당하는 Core Animation에 대해서 알아보려고 합니다. 바로 시작할게요~ Core Animation이란? 뷰 및 기타 시각적 요소에 애니메이션을 적용하기 위한 범용 시스템 그래픽 렌더링 및 애니메이션 인프라 뷰와 통합되어 콘텐츠 애니메이션을 위한 더 나은 성능과 지원을 제공하는 기술 아래와 같이 UIKit 및 AppKit의 근간이 되는 기술로 iOS 및 OS X를 앱을 개발하고 있다면 무조건 Core Animation을 사용하는 것입니다. Core Animation을 직접 사용할 필요는 없지만 사용할 때 Core Animation이 어떠한 원리로 수행되는지 이해할 필요.. 2022. 3. 16.

[SwiftUI] TabView에 대해 알아보기 (feat. UITabBar) 안녕하세요 Foma 💻 입니다! 오늘은 SwiftUI에서 탭뷰를 만드는 방법에 대해서 알아보려고 합니다. (UIKit에선 UITabBar를 뜻합니다.) 바로 시작할게요~ TabView Contents SwiftUI에서 탭뷰를 적용하는 방법은 너무 너무 간단합니다. 아래와 같이 TabView로 감싸고 탭뷰 안에 들어갈 뷰들을 넣으면 됩니다. TabView { View1() View2() View3() ... } TabView Item 하지만 아래와 같이 설정하면 아직 탭뷰가 존재하지 않는 것처럼 보이는데요. TabView { LoginView() HelloView() SettingView() } 이유는 이미 탭뷰가 존재하지만 탭뷰를 나타내는 아이템을 세팅해주지 않았기 때문입니다. 고로 다음과 같이 탭아이템.. 2022. 3. 10.

이전 1 2 3 4 ··· 12 다음

728x90

티스토리툴바