iOS 🍎/SwiftUI

Definition @resultBuilder struct ViewBuilder 클로저에서 뷰를 구성하는 사용자 지정 파라미터 속성 func contextMenu( @ViewBuilder menuItems: () -> MenuItems ) -> some View 클로저 파라미터를 통해 child view를 생성하고자 할 때 ViewBuilder를 사용할 수 있다. 위와 같이 파라미터로 ViewBuilder를 사용해 클로저로 child view를 포함하는 뷰를 생성할 수 있다. myView.contextMenu { Text("Cut") Text("Copy") Text("Paste") if isSymbol { Text("Jump to Definition") } } contextMenu의 menuItems 클..

폰트는 프리텐다드 사용함 (사이트링크) Pretendard Pretendard 프리텐다드 Pretendard 프리텐다드 글꼴 다운로드 일본어 버전 다운로드 GitHub에서 보기 system-ui를 대체하는 글꼴 Apple의 system-ui가 익숙한 나로서는 San Francisco와 Apple SD 산돌고딕 Neo가 없는 cactus.tistory.com 글꼴 다운로드를 눌러서 맥에 저장 피그마에서 사용하기 위해 각 항목을 더블 클릭해서 설치 Figma 텍스트를 추가한 후 폰트, 폰트의 굵기, 자간, 행간을 지정 그 후 Text 옆에 점 네개 아이콘 클릭 텍스트 스타일 메뉴가 나오면 + 버튼을 눌러 새로운 텍스트 스타일을 등록 새로운 텍스트 스타일의 이름을 지정한 뒤 create style을 눌러 저장..

Attributed 텍스트나 별다른 코드 없이 밑줄, 하이퍼링크 이동을 작성할 수 있습니다. struct LinkView: View { var body: some View { Link("네이버로 이동", destination: URL(string: "https://naver.com")!) } } Link라는 뷰를 이용하면 화면에 보일 텍스트와 이동할 웹사이트 주소를 쉽게 작성할 수 있습니다. Link("네이버로 이동", destination: URL(string: "https://naver.com")!) .fontWeight(.heavy) .foregroundStyle(.green) 폰트의 변경도 쉽습니다. 만약 사용자에게 이것이 단순 텍스트가 아닌 하이퍼링크 이동이라는 것을 인지 시켜 주고 싶은 경우 ..

bottom card view, botton sheet 등 용어가 많은데 modifier의 이름은 sheet입니다 @State private var isShowingSheet: Bool = false 화면에 sheet으로 띄울 view를 보여줄지 여부를 위해 State를 하나 선언해 줍니다. false이면 화면에 보이지 않게 되고, true이면 하단에 sheet 형태로 view가 보이게 됩니다. Button { isShowingSheet.toggle() print(isShowingSheet) } label: { Text("바텀시트 띄우기") } isShowingSheet 값을 바꾸기 위한 Button을 하나 만듭니다. 버튼을 누르면 isShowingSheet 을 토글해 줍니다. .sheet(isPrese..

UIKit에서 AVKit의 AVPlayer를 사용해서 동영상을 보여 줄 수 있었습니다. SwiftUI에서 동영상을 화면에 보여주고 컨트롤 하기 위해서는 UIViewControllerRepresentable을 사용해야 합니다. UIKit의 UIViewController를 SwiftUI의 View로 사용하기 위해 UIViewControllerRepresentable을 채택하는 struct를 생성해야 합니다. View가 화면에 보이면 자동으로 동영상이 실행되는 간단한 예제입니다. import SwiftUI import AVKit struct VideoPlayerView: UIViewControllerRepresentable { /// 외부에서 AVPlayer의 상태를 변경하거나 액세스할 수 있음 @Bindin..

previews란? 코드가 변경되면 캔버스에 디자인과 레이아웃이 실시간으로 변경되는 것을 확인 할 수 있다. 이 미리보기 기능을 제공 캔버스에서 인터렉션을 지원함. 버튼 클릭시 print문을 사용해서 콘솔에 로그를 찍는 것도 가능 다양한 디바이스 타입 지원 다크 모드 확인 가능 뷰 사이즈에 맞도록 조절해서 뷰의 모양을 확인 할 수 있음 static var previews: some View { HikeCustomButtonView() .previewLayout(.sizeThatFits) .padding() } 캔버스에서 마우스 커서 모양을 눌러주면 프레임(베젤)이 제거된 미리보기 화면이 캔버스에 나타납니다.

@inlinable public func foregroundStyle(_ style: S) -> some View where S : ShapeStyle foregroundStyle을 사용해서 Color, ShapeStyle을 지정할 수 있음 @frozen public struct LinearGradient : ShapeStyle, View LinearGradient는 ShapeStyle로서 그래디언트의 방향과 색상을 지정할 수 있다. ex) .foregroundStyle( LinearGradient(colors: [.pink, .purple, .blue], startPoint: .topLeading, endPoint: .bottomTrailing) ) colors에는 색상을 지정해 주면 되며 인덱스 0번..

참고 사이트 및 출처 https://www.youtube.com/watch?v=ZQXzZ1hxQwo 위 원본 영상을 참고 하시면 더 자세히 알 수 있습니다! 위 영상이 있어 해당 포스팅은 공부하다 알게된 점만 적어 놓았습니다. NavigationLink NavigationLink를 사용하면 네비게이션 스택을 쌓을 수 있음 NavigationView { VStack { NavigationLink(value: , label: View#>) } .padding() } value 는 이동 시키기 위해 링크를 걸 뷰, label은 스택으로 쌓을 뷰를 클로저로 전달 NavigationView { VStack { NavigationLink { Text("두 번째 뷰") } label: { Text("첫 번째 뷰") ..