Framework/SwiftUI9

• 

  SwiftUI - MVVM 패턴을 사용해 만들어보는 알림 페이지 MVVM이란? MVVM (Model-View-ViewModel) 패턴은 소프트웨어 개발에 있어서 사용자 인터페이스를 구현하기 위한 아키텍처 패턴 중 하나다. 이 패턴은 주로 UI 애플리케이션에서 사용되며, MVC (Model-View-Controller) 패턴을 발전시킨 형태로 볼 수 있다. MVVM은 아래 세 부분으로 구성된다. Model 애플리케이션의 데이터와 비즈니스 로직을 담당. 데이터베이스, 유효성 검사, 객체 등이 여기에 해당된다. View 사용자에게 보여지는 UI 부분으로 사용자의 입력을 받고, 표현하는 역할을 한다. ViewModel View를 표현하기 위한 데이터와 명령을 가지고 있으며, Model과 View 사이의 중재자 역할을 한다. View에 바인딩하여 데이터의 변화를 자동으로 .. Framework/SwiftUI 2024. 3. 14.

• 

  [웹개발자의 IOS 탐방기] 8. SwiftUI 웹앱에 FCM Push 알림 구현하기 서론 Firebase Cloud Messaging (FCM)은 Google에서 제공하는 클라우드 기반의 메시징 솔루션이다. 이를 통해 개발자들은 Android, iOS, 웹 애플리케이션에 대한 푸시 알림을 보낼 수 있게 되었다. 본 포스팅에서는 간략하게 FCM에 대해 알아보고, IOS 앱에서 FCM Push 알림을 구현해보자. FCM(Firebase Cloud Messaging) 기능 FCM은 앱 사용자와의 실시간 상호 작용을 가능하게 하여, 사용자 참여도를 높이고 중요한 정보를 신속하게 전달하는 데 효과적인 도구로 활용된다. 아래에 간략하게 FCM의 지원 기능 및 장점에 대해 요약해보았다. 크로스 플랫폼 메시징: FCM은 Android, iOS, 웹 애플리케이션에 대한 푸시 알림을 지원하여, 하나의 서.. Framework/SwiftUI 2023. 11. 24.

• 

  [웹개발자의 IOS 탐방기] 7. UserDefaults를 사용한 로컬기기에 알림 권한설정 값 저장하기 서론 UserDefaults는 간단한 데이터, 설정, 환경설정 등을 로컬에 저장할 때 사용되는 인터페이스다. UserDefaults에 저장하는 데이터는 키-값(key-value) 쌍으로 관리된다. 예를 들어, 여러 곳에서 사용되는 UserDefaults의 키를 하드코딩하면 오타가 발생할 위험이 있고, 키 관리가 어려워질 수 있기 때문에 이를 방지하기 위해 UserDefaultsKeys를 사용하면 각 키에 대한 참조를 한 곳에서 관리할 수 있으며, 이후 코드에서는 이러한 참조를 재사용함으로써 안전성과 유지보수성을 높일 수 있다. 본 포스팅에서는 UserDefaultsKeys를 사용하여 디바이스 로컬 기기에 설정한 값들을 저장 및 불러와서 기계가 꺼져도 설정 내용이 변하지 않게 SettingView.Swfi.. Framework/SwiftUI 2023. 11. 8.

• 

  [웹개발자의 IOS 탐방기] 6. UserNotifications을 사용한 알림 설정 구현 서론 UserNotifications은 Swift에서 iOS와 macOS 운영 체제를 위한 로컬 및 원격 알림을 관리하고 처리하는 프레임워크로써, 이 프레임워크를 사용하면 앱이 백그라운드에서 실행되는 동안이나 전혀 실행되지 않을 때도 사용자에게 알림을 보낼 수 있다. 우리는 이 UserNotifications을 활용하여 알림 설정을 구현할 것이다. NotificationManager.swift 파일 생성 아래 코드는 UserNotifications 프레임워크를 사용하여 알림 권한을 관리하고, 앱의 알림 설정 상태를 확인하는 역할을 하는 NotificationManager라는 클래스를 정의하고 있다. 코드의 각 부분을 단계별로 나누어 설명하자면 필요한 모듈을 가져오기: Foundation: 기본적인 시스템.. Framework/SwiftUI 2023. 11. 8.

• 

  [웹개발자의 IOS 탐방기] 5. ListView를 사용한 알림 화면 구현 서론 설정화면 우측 상단에 알림 아이콘을 넣고, 알림 아이콘을 클릭했을 때 알림 리스트들이 나오는 화면을 구현해보려 한다. 또한 각 아이템에 스와이프하여 삭제 기능까지 추가해보자. SettingView Hedaer 분리 기존 설정 화면에서 구현한 Header부분을 공용으로 사용하기 위해 HeaderView.Swift파일을 생성하여 공용 코드로 관리한다. 우측에 알림 아이콘을 넣어주고, 타이틀을 구분하기 위해 enum HeaderType을 지정해준다. 타입에 맞는 타이틀을 반환하는 함수도 함께 정의한다. enum HeaderType { case setting case notice } func headerTitle(for type: HeaderType) -> String { switch type { case.. Framework/SwiftUI 2023. 11. 8.

• 

  [웹개발자의 IOS 탐방기] 4. VStack HStack을사용하여설정창 UI 구현 서론 IOS의 NavigationView와 NavigationLink로 이동된 화면에서는 IOS 자체적으로 지원하는 뒤로가기 버튼이 표시된다. 하지만 우리는 좀 더 친숙한 UI를 구현하기 위해 뒤로 가기 버튼부터 시작하여 설정창에 필요한 기능들을 아래와 구현하려고 한다. SwiftUI에서 화면을 그릴때는 주로 VStack과 HStack을 사용한다. 오마주는 당근마켓 설정화면을 기준으로 하였다. VStack, HStack이란? VStack: 수직으로 뷰들을 쌓아 준다. 위에서 아래로 UI 요소들을 일렬로 배열하고 싶을 때 사용한다. HStack: 수평으로 뷰들을 쌓아 준다. 왼쪽에서 오른쪽으로 UI 요소들을 일렬로 배열하고 싶을 때 쓰면 된다. 간단하게 말하면, VStack은 세로로, HStack은 가로로.. Framework/SwiftUI 2023. 11. 8.

• 

  [웹개발자의 IOS 탐방기] 3. NavigationView 컨테이너뷰를 사용하여 설정창 띄우기 서론 NavigationView는 SwiftUI에서 네비게이션 기능을 제공하는 컨테이너 뷰로서, 주로 계층적 구조의 콘텐츠를 표시하거나 상세 정보를 보여줄 때 사용된다. 예를 들어, 목록에서 항목을 선택하면 해당 항목의 상세 정보 페이지로 이동하는 경우에 NavigationView와 함께 사용한다. 때문에 SwiftUI에서 제공하는 네비게이션 스택을 활용하여 화면 전환을 간편하게 구현할 수 있어서 NavigationView를 활용하여 설정창으로의 화면이동을 구현해보자. SettingView.swift 파일 생성 사용자 로그인/아웃 폼 부터 시작하여 푸쉬 알림 설정, 알림 내역 확인 등을 할 수 있는 Setting에 관련된 뷰 파일을 생성한다. 이 파일은 추후 목적에 맞게 디벨롭 해나갈 예정이다. // /.. Framework/SwiftUI 2023. 11. 8.

• 

  [웹개발자의 IOS 탐방기] 2. 웹앱에 CustomToolbar 붙이기 서론 [1.Swift UI로 웹앱 만들기] 에서 간단히 만들어본 SwiftUI기반의 웹앱에 본격적으로 SwiftUI 기반의 네이티브 기능들을 하나씩 붙여보려고 한다. 그중 제일 먼저 시작할 Custom Toolbar를 만들어 볼 예정이다. 가장 많이 필요한 "이전","다음","홈","설정" 4개의 버튼을 만들고 그 중 "설정"을 제외한 나머지 기능을 먼저 구현한다. Constants.Swift 파일 생성 나는 전역에서 사용할 상수 혹은 변수를 관리할 때에 Constants 라는 명명을 자주 사용한다. 때문에 여기서도 전역에서 사용할 값을을 다루는 Constants.swift 파일을 생성해줬다. 파일 Source의 경우 Swift File을 선택해준다. 지금 당장은 공통으로 사용할 값이 모바일 도메인 값밖.. Framework/SwiftUI 2023. 11. 8.

• 

  [웹개발자의 IOS 탐방기] 1. Swift UI로 웹앱 만들기 서론 아이폰의 운영체제(IPhone OS : 이하 IOS) 에서 동작하는 Application (이하 App)은 수만가지가 있다. 사람들이 가장 많이 사용하는 방식으로 SwiftUI를 활용하여 List View & Scroll View 등의 View단위로 구성된 Native App. Unitiy 및 SpriteKit, Unreal Engine 등의 게임 프레임워크 킷들을 사용하여 만드는 Game App 등이 여기에 해당된다. 그중에서 나는 모바일 웹을 앱에서 표현하는 통칭 웹앱에 네이티브 기능을 추가한 하이브리드 앱(Hybrid APP)을 만드려고 한다. SwiftUI를 사용한 웹앱 Project 만들기 웹앱을 만드는데 SwiftUI를 사용한다니 뭔가 어불성실이다. SwiftUI는 대부분 네이티브 앱에서.. Framework/SwiftUI 2023. 11. 8.