Swift/SwiftUI

안녕하세요. 린다입니다. 오늘은 2번째 글에 이어서 제가 offset과 position을 처음 접할 때 헷갈렸던 부분을 정리한것을 작성해보려고 합니다. 바로 대체 (0, 0)의 기준은 어디이며, 어떻게 위치되는 것이지? 가 항상 헷갈렸는데요.. 이를 올바르게 이해하기 위해서는 (https://sy-catbutler.tistory.com/67) (https://sy-catbutler.tistory.com/68) 를 먼저 보고오시는 걸 추천드립니다. 1. Offset - 뷰를 오프셋 매개변수에 지정된 수평 및 수직 양으로 계산한다.(배치한다) offset의 위치가 200, 200인데 어디를 기준으로 200, 200이고 position과는 왜 다를까? 이유를 알기 위해서는 레이아웃 프로세스를 알아야함! 지금 ..

안녕하세요. 린다입니다. 저번 WWDC 영상을 보면서 혼자 이것저것 레이아웃 프로세스에 대해서 공부했던? 확인했던..? 예제들을 정리해보려고 합니다. SwiftUI의 레이아웃 프로세스에 관한 글을 안 읽어보셨다면 (https://sy-catbutler.tistory.com/67) 읽고오시는걸 추천드립니다 !! 그리고 추가적으로 해당 글에서는 offset과 position에 대해서도 다뤄보려고 해요. 두개의 차이점이 무엇인지도 정리해보려고 합니다. 1. offset 공식문서에 있는 Offset의 설명을 보면 Offset this view by the horizontal and vertical amount specified in the offset parameter. 이 보기를 오프셋 매개변수에 지정된 수평..

안녕하세요. 린다입니다. 요즘 Animation을 공부하면서 WWDC를 잘 활용하고 있는데요. DragGesture에서 Position, Alignment까지 보고 있습니다.. 정말 기초적인 정보가 잘 담겨져 있는 영상인것 같아서 가볍게 정리한 내용인데 블로깅하려고 가져왔어요! Building Custom Views with SwiftUI - WWDC19 - Videos - Apple Developer Building Custom Views with SwiftUI - WWDC19 - Videos - Apple Developer Learn how to build custom views and controls in SwiftUI with advanced composition, layout, graphics,..

안녕하세요. 린다입니다. SwiftUI에는 TextEditor에 배경색을 넣거나 다양한 UI로써 보이도록 하고 싶다면, 커스텀을 해야하는데요. 이번 SYM을 배포하면서 구현했던 TextEditor를 공유해보려고 합니다. 저희의 TextEditor 조건은 2가지였어요. 1. 글자수 200 미만만 입력 가능한 TextEditor 2. Placeholder가 있는 TextEditor 코드 공유 struct CustomTextEditorStyle: ViewModifier { let placeholder: String @Binding var text: String func body(content: Content) -> some View { content .padding(15) .background(alignmen..

안녕하세요. 린다입니다. 프로젝트를 하면서 피그마를 사용하면 디자이너들은 Line Height를 지정해주는데요.. SwiftUI에는 LineSpacing 이 있는데.. 막 적용했을 때 Line Height랑 다르게 보여지더라구요. 그래서 Line Height는 무엇인지, 그리고 어떻게 적용해야 하는지를 찾아보았습니다. 중간 글씨들의 Line Height는 20이라고 명시되어 있습니다. 그래서 SwiftUI의 Line spacing에 20을 적용하면 이상하게 나오는데요. 당연합니다. 왜냐면 Linespacing은... *Linespacing 이란? (from. docs) 뷰의 텍스트 요소에 대해 한 줄의 아래쪽에서 다른 줄의 위쪽까지의 간격을 설정하는 값 즉, 한줄부터 다음줄 사이의 거리를 의미합니다. (..

안녕하세요. 린다입니다. 오늘은 TextField에 입력받는걸 제한하는 방법을 블로깅 하려고 해요. 사실 별거 아닌줄 알았는데 단순하게 char의 정규표현식으로만 하니까 안 돼서 .. 은근히 고생을 해가지구 빠르게 블로깅하고 가려고 합니다. 방법은 TextField의 onchange를 통해서 입력값을 판별해주면 돼요. 현재 입력값인 newValue를 koreaLangCheck이라는 함수를 통해서 판별을 하고, 조건에 따라서 규칙를 판별해주고 있는 코드입니다. TextField("닉네임을 입력해주세요", text: $nickname) .customTF(type: .normal) // 커스텀 조건 .onChange(of: nickname) { newValue in if koreaLangCheck(newVal..