본문 바로가기

View2

[SwiftUI] 말풍선 구현하기: View 만들기, CustomTriangle, SpeechBubble 프로젝트를 진행하면서 말풍선을 구현해야 할 일이 생겨, 말풍선을 구현하고 그 과정을 게시물에 담으려고 합니다.  일반적으로 말풍선은 다음과 같은 요소로 구성됩니다.말풍선 배경 및 외곽선말풍선 내부 텍스트말풍선 꼬리의 배경 및 외곽선 새로운 프로젝트를 생성한 후, 위 세 가지 요소를 고려하여 말풍선을 디자인하고, 사용자가 말풍선을 커스터마이징할 수 있도록 뷰(View)를 만들어보겠습니다.   1. 말풍선 UI 만들기 1.1 말풍선 배경 및 외곽선 만들기 + 말풍선에 들어가는 텍스트 추가 ( 말풍선 몸통 만들기 )modifier를 사용하여 HStack 내부에 배경색을 추가하고, 외곽선을 적용했습니다.또한, Color를 HEX 코드로 사용하기 위해 별도의 extension을 추가하여 활용했습니다.HStack(.. 2025. 3. 11.
[SwiftUI] TextEditor / placeholder, 외곽선, 정렬 Swiftui에서 TextField가 주어진 width 크기를 초과하면 자동으로 줄이 바뀌지 않고 horizontal로 스크롤되어 ui는 텍스트 크기와 상관 없이 한 줄로 유지됩니다.struct AddDiaryView: View { @State var text: String = "" var body: some View { VStack(content: { TextField( "aaaa", text: $text ) .lineLimit(12) .autocorrectionDisabled(true) }) }} 제가 필요한 것은 Textfield의 width 크기를 초과했을 때 vertical 방향으로 텍스트가 추가되는 것을 원하기 때문에.. 2024. 5. 12.