팁앱

화면 완성

개발환경

iOS 16.0 이상

목표

팁앱의 메인 UI를 구성해보자.

사용

Image Label

Search State Binding

완성 화면

** 미세한 차이가 있을 수 있어요 **

고민해봐요

Q : 서치바를 만드려면 코드를 어떻게 작성해야할까요?

SwiftUI의 뷰는 구조체라 값 변경을 가능하게 하려면 무엇을 사용해야 된다고 했더라..

앱 화면을 다시 그리기 위한 상태 @State

Q : 아이콘 대신에 내가 직접 가져온 이미지로 채우려면 어떻게 해야할까요?

Assets에 사진을 넣고.. 그다음에는..?

Q : 아이콘에 그라데이션 컬러를 주려면 어떻게 해야할까요?

linerGradient를 사용해보세요

코드 맛보기

  • 서치바 만들기
  • 이미지 가져오기
import SwiftUI

struct ContentView: View {

	  @State private var searchText = ""

    var body: some View {
		   NavigationStack {
            List {
                ZStack {
                    Image("bolt")
                        .resizable()
                        .frame(height: 200)
                        .scaledToFit()
                    Text("새로운 기능")
                        .bold()
                        .offset(x: -20, y: -80)
                        .font(.system(size: 23))
                }
	}
	.searchable(text: $searchText, placement: .navigationBarDrawer(displayMode: .always), prompt: "검색")
	}
    }
}

 

댓글

댓글 본문
버전 관리
개발자리
현재 버전
선택 버전
graphittie 자세히 보기