[React Native] Chat GPT로 개발하기 - 4일차

React Native에서 View 아래 버튼의 높이가 꽉차는데 내가 원하는 높이로 설정하려면 어떤 방법을 사용해야해?

당연하지만 height을 설정하면 문제가 없다고 한다. 

하지만 당연히 height은 50으로 값을 넣어줬는데 내 화면의 버튼은 전체 화면을 가득 채웠다. 

flex 속성을 주면 꽉차게 설정되는데 방법이 없을까?

왜 그럴까 고민을 하다가 flex라는 속성에 의심을 하기 시작했다. 

flex는 부모 컴포넌트 기준으로 화면을 채운다고 했는데 이녀석을 내가 Button에게 1을 줬다 

 

역시나 답변으로 flex 속성을 넣어서 그렇다고 한다. 

 

내가 flex에 1을 준 이유는 flexDirection과 align-item을 주기 위해서였는데 flex 값을 주지 않아도 

기본 display가 flex이기 때문에 바로바로 사용할 수 있었다. 

 

나는.... flex에 값을 줘야 flex 관련 속성을 사용할 수 있는줄....

Navigation에서 Header의 라벨이 name으로 설정되어 있는데 이걸 다른걸로 바꿀 수 있어?

React Native에서는 라우터에서 헤더를 지원해주는데 헤더의 텍스트가 경로로 되어있어서

상당하게 이쁘지 않았다. 

 

이것을 이쁘게 하기 위해서 수정이 가능한지 물어봤는데 options에서 변경이 가능하다는 답변을 받았다. 

React Native에서 폰트를 설정하려면 어떤 방법을 사용해야해?

 

헤더를 수정하고 보니 너무 못생겼었다. 

물론 디자인 자체가 못생기긴 했지만 그래도 이건 심했다.... 그래서 폰트를 설정하기로 했다. 

 

React Native에서는 Link 태그와 같은 것을 사용할 수 없으니 어떤식으로 가지고 오는지 궁금했다. 

그런데 생각보다 꽤 복잡한 과정이 있었는데 Google Fonts를 자동으로 가지고 오는 방법이 있다면 그게 더 

좋다고 생각하고 추가로 질문했다. 

구글 폰트에서의 link 등의 방법으로는 불가능해?

바로 가능하다는 답변을 받았고 라이브러리가 있다는 것을 알았다. 

그래서 나는 근본인 noto sans를 가지고 오기로 했다. 

fontFamily "Noto Sans KR" is not a system font and has not been loaded through Font.loadAsync. 이런 오류가 나는데?

폰트를 가지고 올 때 오류가 나서 확인해보니 expo에서는 폰트를 가지고 오는 방법이 따로 있었다....

 

근데 이 방법이 너무 최악이였다. 

폰트를 가지고 올 때 하나씩만 불러올 수 있는 것이다. 예를들어 Noto Sans Kr이 100, 300, 400, 500, 700, 900을 

사용한다면 이걸 한번에 호출해서 font-weight로 변경해줄 수 없는 것이다.

weight 700일때 bold를 자동으로 불러오고싶어

혹시 질문의 디테일 문제가 아닐까 싶어서 다른 방식으로 물어봤지만 결국 하나씩 호출하는 방법을 사용하라는 

답변을 받았다....

 

이건 어쩔 수 없이 불편함을 감수하고 작업을 진행하기로 했다. 

route의 헤더에는 폰트를 적용할 수 없어?

마지막으로 헤더에도 폰트를 적용하기 위해서 라우터 헤더에 적용시키는 방법을 물어봤다.