iOS WKWebView Done 버튼 얼마전에 개발을 하면서 아이폰 웹뷰에 Done 닫기 버튼이 기본적으로 활성화 된다는 사실을 알았습니다. 웹뷰의 보조적인 기능을 하는 버튼인데 사실상 뷰 영역을 더 작게 보이게 하며 특히 아이폰 미니의 경우 화면이 더 작아지더군요. 그래서 처음에는 웹에서 처리하는 건 줄 알았는데 iOS 네이티브에서 WebView를 상속받아서 처리해줘야 했습니다. 생각보다 간단하게 작업할 수 있습니다. ▼ 우선 웹킷의 WebView를 상속 받은 클래스를 하나 만들어줍니다. 저는 RichEditorWebView 라는 이름으로 만들었으나 다른 이름으로 만들어줘도 무방합니다. ▼ 이제 상속 받아서 쓰면 됩니다. WebView를 확장한 RichEditorWebView를 상속 받아서 사용하면 ..
아이폰 롱터치 방지 아이폰 개발을 하다보면 웹뷰를 사용할 때가 많습니다. 하이브리드 앱을 개발하다보면 WebKit의 특성을 발견하게 됩니다. 네이티브 앱으로 개발할 때는 텍스트를 길게 누르거나 선택을 할 수 없지만 보통 하이브리드 앱으로 개발된 iOS 웹 앱을 보면 텍스트가 보통 선택되기 마련입니다. ▼ 텍스트 선택 방지 코드로 웹뷰가 로드 된 뒤에 didFinish 이벤트에서 설정해주면 됩니다. Web CSS 공식 문서를 보면 iOS Safari 디스플레이의 callout 기능이 포함 되어 있는 것을 확인 할 수 있습니다. https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-touch-callout -webkit-touch-callout - CSS: C..
iOS 저전력 모드 iPhone 사용자가 저전력 모드(low-power mode)를 사용하게 되면 iOS 개발을 할 때 몇 가지 제약이 생깁니다. 특히나 절전모드 사용시 동영상 비디오 자동재생을 지원하지 않습니다 때문에 개발을 할 때 저전력인지 확인해야 하는 때가 있는데요. 오늘은 저전력 모드에서 Swift 코드로 저전력 모드를 판단하는 코드와 방법을 알아보겠습니다. 저전력 모드의 경우 iOS 9 부터 지원하고 있고 다음과 같은 제약이 있습니다. CPU 쓰롯틀링 (60% 성능제한) 백그라운드 앱 갱신 제한 웹뷰 비디오 자동 재생 제한 자동 다운로드 기능 제한 GPU 퍼포먼스 저하 화면 밝기 저하 우선 아이폰에서 저전력 절전 모드를 확인하기 위해서는 두 가지 방법이 있습니다. 첫 번째로 직접 속성에 값을 ..
Swift Date 객체 변환하기 Swift에서 날짜 객체를 수정하거나 바꾸기 위해서는 보통 Calendar 클래스를 사용합니다. 날짜를 다루는 일이 생각보다 복잡하고 어려울 때가 있는데 오늘은 단순히 날짜에 값을 더해서 반환하는 방법을 알아보겠습니다. 앱 개발을 하면서 갑자기 1일을 더해서 Date 객체를 사용해야 하면서 기억하기 쉽게 블로그에 글을 남깁니다. 우선 1일을 추가해서 데이트 객체를 만들려면 우선 기준이 되는 Date 객체를 하나 만들어 줍니다. ▼ 다음과 같이 today 변수에 오늘 날짜를 가리키는 새로운 Date 객체를 생성합니다. ▼ 이제 Calendar 클래스를 이용해 값을 추가해 줍니다. date 함수의 파라미터는 각각 다음의 파라미터를 인자로 받습니다. 저는 day로 설정해서 하..
Swift 오디오 재생 iOS 개발을 할 때 오디오를 플레이하려면 AVFoundation을 import 해야 합니다. 우선 간단한 beep 음을 재생하기 위해서 wav 파일을 준비했습니다. 총 3개의 파일이고 시작음과 종료(성공, 실패)음이 있습니다. 다음과 같이 정의 Beep 음 타입을 정하는 BeepType이라는 enum을 하나 정의합니다. 타입은 String타입으로 정의해서 해당 타입의 문자열은 파일이름과 매칭시켜 줍니다. 이제 재생을 할 클래스를 만들고 다음과 같이 AVFoundation을 임포트 해줍니다. 또한 soundEffect라는 AVAudioPlayer 객체를 선언합니다. 아직 객체를 할당하지는 않았지만 강제 옵셔날 언래핑(!) 해서 선언합니다. 다음 함수는 오디오 재생을 위한 함수입니다..
WKScriptMessageHandler 구현하기 자바스크립트에서 네이티브로 특정 메시지를 호출할때는 iOS 스위프트에서 WKScriptMessageHandler 프로토콜을 구현해줘야 합니다. 자바스크립트 메시지 핸들러를 구현하면 WKScriptMessage 타입의 message 객체를 파라미터로 전달 받을 수 있습니다. 해당 데이터는 body와 name으로 구현되어 있습니다. name은 보내는 쪽과 맞춰서 String 타입으로 구현되고 실제 사용될 데이터는 message.body에 담기게 됩니다. 하지만 약속된 데이터가 JSON일 경우 전달 받은 데이터를 디버깅해보면 문자열이 아닌 딕셔너리(NSFronzenDictionaryM) 타입이라는 것을 확인할 수 있습니다. 이 데이터를 파싱하기 위해서는 우선 ..
SwiftUI에서 UIKit을 사용해 화면을 표현할 수 있다는 것은 스위프트 UI 개발을 하시는 분이라면 대부분 알고 계실겁니다. 이 UIView 또는 ViewController를 프리뷰(Preview)를 이용해서 띄워보겠습니다. ▼ 다음과 같이 ViewController를 하나 생성합니다. 만약 PreviewProvider 프로토콜을 구현한 preivews 반환 값이 View 타입이 아니라면 보시다시피 에러가 납니다. UIKit의 뷰 컨트롤러를 반환하기 때문입니다. ▼ 이제 Preview 를 extension해서 UIViewControllerRepresentable 프로토콜을 구현합니다. 이때 필요한 함수가 makeUIController, updateUIViewController입니다. updateUI..
UIKit과 SwiftUI 통합하기 SwiftUI 이전에는 iOS 개발을 위해 UIKit을 사용하였습니다. SwiftUI로 화면을 개발한다고 해도 UIKit을 사용할 수 밖에 없는데요. SwiftUI 화면을 UIKit에서 사용하려면 UIHostingController를 사용해서 쉽게 사용할 수 있는 것처럼 SwiftUI에서는 UIViewRepresentable이라는 프로토콜을 구현함으로써 UIView를 쉽게 SwiftUI에 반영할 수 있습니다. ▼ UIViewRepresentable 프로토콜은 UIKit을 SwiftUI에서 사용하기 위해 SwiftUI 형태의 화면으로 만들기 위한 프로토콜입니다. 다음과 같이 일반 UIKit 화면을 UIViewRepresentable를 구현을 통해 SwiftUI 에서 손쉽..
▼ 스위프트 UI는 선언형 UI를 사용합니다. 예를 들면 다음과 같이 Color.red 에 .ignoresSafeArea() 라는 ViewModifier를 추가해서 화면에 SafeArea를 포함해서 전체화면을 빨간색으로 채울 수 있습니다. 마찬가지로 .frame을 이용해서 화면 사이즈를 변경할 수도 있습니다. ▼ 이번에는 ZStack을 사용해서 Color와 Text를 중첩해서 표현하겠습니다. ZStack의 alignment를 .bottomTrailing 옵션으로 Text를 우측 하단에 포함시킵니다. Text에도 역시 font, foregroundColor 와 같은 다양한 modifer가 추가되어있습니다. 때문에 코드가 복잡해지고 재사용하기 힘든 코드가 됩니다. ▼ ViewModifier를 확장한 Wate..
▼ 텍스트 필드를 만들기 위해서 다음과 같이 TextField 요소를 추가합니다. 첫 번째 파라미터는 Placeholder를 의미하며 두 번째 파라미터는 실제 입력 텍스트로 Binding 값이 들어갑니다. 때문에 @State 지시자를 통해서 새로운 변수를 추가합니다. @State는 내부적으로만 사용하기 때문에 private로 선언하는 것이 기본이며 값은 빈 문자열로 해줍니다. ▼ 텍스트를 입력하면 첫 글자가 대문자인 것을 알 수 있습니다. textInputAutocapitalization 를 .never로 설정하면 대문자가 아닌 소문자로 시작합니다. 그리고 틀린 문자에 대해 자동으로 수정해주는 기능이 있는데 사용자가 불편할 수 있습니다. .disableAutocorrection(true) 로 방지할 수 ..
Lottie Animation ▼ 모바일 개발시 많이 사용되는 Lottie 애니메이션을 SwiftUI에서 구현하는 방법을 알아보겠습니다. 우선 새로운 패키지를 추가하기 위해서 로티를 사용하기 위해서 다음 주소를 복사합니다. (Swift Package를 사용하지 않고 CocoaPods을 사용해도 됩니다.) https://github.com/airbnb/lottie-ios.git ▼ Xcode의 File -> Add Packages... 메뉴를 통해 새로운 패키지를 추가합니다. ▼ 우측 상단에 검색창에 복사한 주소를 넣고 엔터를 치면 lottie-ios 패키지를 찾을 수 있습니다. 우측 하단에 Add Package 버튼을 눌러 패키지를 추가합니다. ▼ 로티 애니메이션 이미지를 다운로드 받습니다. 해당 서비스..
randomColor 스위프트를 이용해 아이폰 개발을 하다보면 간혹 UIColor를 랜덤으로 사용해야할 경우가 있습니다. 다음과 같은 익스텐션을 만들고 쉽게 사용이 가능합니다. 원리는 간단합니다. CGFloat의 random함수를 이용해 0부터 1 사이의 값을 새로운 UIColor 객체를 만들 때 사용합니다. 우선 새로운 UIColor 익스텐션(extension)을 만듭니다. 그리고 randomColor 라는 함수를 만듭니다. randomAlpha 라는 Boolean 값이 있는데 이는 난수를 발생시킬때 Alpha 값에 대해서도 포함 할지를 나타냅니다. 기본값은 false 입니다. 다음과 같이 사용할 수 있습니다. vc.view.backgroundColor = UIColor.randomColor() // ..