꿈꾸는리버리

이번에는 modifier 코드를 줄이는 방법을 알아볼거다 ! 요즘 NC1 이후 코드 정리를 하는데에 아쉬움이 남았던 부분들을 공부하는 중인데 하나 둘 포스팅을 하려 한다 ! View를 다른 모습으로 modify 해주는 이 노란 칭구들이 modifier ! 이 버튼 3개를 만들기 위해서 사용한 modifier들을 줄여보자 ! 여기 하단의 코드를 보면 struct ViewModifierView: View { var body: some View { VStack{ Text("button1") .font(.title3) .foregroundColor(.white) .padding() .frame(width: UIScreen.main.bounds.width-30, alignment: .center) .backgro..

오늘은 body 안의 코드를 줄이는 방법에 대해 알아볼 거다 ! 요즘 NC1 이후 코드 정리를 하는데에 아쉬움이 남았던 부분들을 공부하는 중인데 하나 둘 포스팅을 하려 한다 ! 이렇게 3개의 둥근 사각형 View가 있다. 아래 코드를 보면 알겠지만, 안에 들어가는 값이 달라지며, 3번 반복이 된다. struct ExtractSubView: View { var body: some View { ZStack{ VStack{ VStack{ Text("1") Text("Apple") } .padding() .frame(width: 100) .background(Color.red) .cornerRadius(10) VStack{ Text("4") Text("Peach") } .padding() .frame(width..

VStack : A view that arranges its children in a vertical line. : y축을 기준으로 Top to Bottom으로 정렬하는 View 위에 있는 그림의 코드이다. Vstack의 alignment를 .center로, spacing을 0으로 두었다! 이렇게 하면 Vstack 내부의 View들(여기서는 Rectangle)의 정렬 기준(alignment)과 해당 View들의 사이의 spacing 값이 조절된다 Text("VStack") VStack(alignment: .center, spacing: 0){ Rectangle() .fill(Color.green) .frame(width: 100, height: 30 ) Rectangle() .fill(Color.oran..

frame과 관련해서 모르는 게 많아서 이참에 정리를 해보기로 했다! 최종적으로 만들고자 하는 화면은 다음과 같다 ! frame, 왜 필요할까 ? 좌측의 기본 화면을 우측의 화면처럼 만들고 싶다 !! 어떤 코드가 떠오르는 가? 나는 다음과 같은 코드가 떠올랐다..! HStack { Text("Hello, World!") Spacer() } 그럼 이런 화면은 ? 나는 .. 이런 코드가 떠올랐다 ! VStack{ HStack { Text("Hello, World!") Spacer() } HStack { Spacer() Text("Hello, World!") } } ..! 근데 위 코드들이 가독성이 좋은 가..? NOOO !! 바로 위에서 봤던 예시는 spacer 없이 frame을 이용해서 간단하게 나타낼 수..

개발을 하다보면 이런식으로 Color 설정을 위해 긴 코드를 작성하기도 한다. 하지만 해당 색깔이 어떤 컬러인지 직관적으로 확인하기도 어렵고, 여러 컴포넌트에서 사용이 된다면 재사용성 또한 떨어진다. 게다가 만약에 dark mode와 light mode color를 구분해서 개발하고 싶다면...? 본 포스팅은 이를 위한 내용이다 ! 1) Asset에서 색을 좌) light mode , 우) dark mode 로 설정합니다. +) 이 색은 “CustomColor”라고 이름 지었습니다. 2) Asset에 추가했던 color를 불러올 수 있습니다 ! But,, 이렇게 "CustomColor"처럼 String으로 넣었을 때는 오타 발생가능성이 있을 수도 있겠죠..? 3) Color을 extension해서 cus..

나도 dark mode 를 반영한 앱을 만들어보고 싶었고 그래서 preview에서 dark mode 색을 확인해야 했다 ! Dark mode HIG 1) 기존 lightmode에서 보이는 View 2) inspector를 사용하여 Darkmode를 설정할 수 있습니다. 이렇게 darkmode를 설정하자, 좀 더 어두운 green 컬러로 좀 더 어두워지신 게 느껴지시나요 ? ( 초록색 컬러는 custom color 포스팅에서 light 모드와 dark 모드 두가지 color로 설정해놨습니다 ! ) inspector에서 설정한 대로 프리뷰 코드에서도 다크모드가 보이도록 코드가 추가된 것을 확인할 수 있습니다. 4) 추가로 프리뷰를 lightmode와 darkmode 같이 보고싶다면, 이렇게 lightmode..

백준 풀다가 두개 개념이 다른가 ? 싶어서 찾아봤다 ! 공통점 두 method 모두 collection의 마지막 element를 제거하고 반환하는 method이다. 차이점 - popLast()는 반환값이 optional이다 ! var nums = [1, 2, 3] nums.removeLast() // 3 nums.removeLast() // 2 nums.removeLast() // 1 nums.popLast() // nil nums.removeLast() // 에러 ! 이렇게 배열의 값이 비었을 때 popLast()를 하면 nil 값이, removeLast()를 했을 때는 에러가 뜬다 ! 뭘 쓸까 ? 우선은 배열의 값이 무조건 있다고 확신하는 경우에는 removeValue() 메소드를 써도 되지만, 빈 ..

➯ Black 컬러는 공식 문서에 적혀있는 것을 해석해서 적은 것이고 Gray 컬러는 저의 개인적인 생각을 추가로 작성한 것입니다 :) 보라색은 잘 모르겠거나 이야기 나눠보고 싶은 point들 입니다 1) iOS Design Theme 앱 스토어 상단에 있는 앱을 만들기 위해서는 앱의 품질과 기능에 대한 기대를 충족시켜야 한다. iOS에는 다른 플랫폼과 구별되는 세 가지 theme 이 있다. theme : 대 주제 💡 Clarity text는 모든 크기에서 쉽게 읽혀야 한다. -> font 13 이렇게 하는 것보다 .title 처럼 coding을 해서 사용자가 시스템에서 폰트 크기를 바꿨을때 같이 변경이 되어야 한다..? icon은 명확하게 표현되고 이해하기 쉬워야 한다. -> 프로필 "추가"를 나타내는..