https://docs.expo.dev/develop/user-interface/fonts/
Fonts
Learn how to integrate custom fonts in your app using local files or Google Font packages
docs.expo.dev
여기 참고해서 바꿨다.
npx expo install expo-font
다운로드 받는다.

넣는다.
const BOLD = 'Pretendard-Bold';
const MEDIUM = 'Pretendard-Medium';
const REGULAR = 'Pretendard-Regular';
const fontStyles = {
letterSpacing: 0,
Heading: {
H1: {
B_130: {
fontFamily: BOLD,
fontSize: 28,
lineHeight: Math.round(28 * 1.3),
},
B_100: {
fontFamily: BOLD,
fontSize: 28,
lineHeight: 28,
},
이런식으로 넣고 Import 해서 불러왔더니 잘 해결되었다! 굳굳
그 다음으로 할 것은 이제 디자인을 넣을 준비 준비를 마쳤기 때문에 이제 디자인을 넣어볼거다.
할일 2
캘린더 컴포넌트에 디자인 붙이기

완성!
두번째로 할 일
confirm UI 변경
이건 사실 디자인 붙이는 게 어렵다기보다는....
컴포넌트를 다양하게 썼는데, 섬세하게 수정하지 못해서 힘들었다.

디자인을 넣어주긴헀는데, 아쉬운점은 버튼이 좀 ... 폰트가 커스텀이 좀 어려웠다.
그래서 Layout 으로 만들까 했는데, 프론트짱님이 바꿀 수 있는지 확인해주신다고 해서 기다리고 있다.
일단 여기서 마치는 걸로 해보려고 한다.
3. loading component 제작
로딩 컴포넌트 만들어야한다.
그래서 만들었다.

앗 잘 안보이지만.. 여튼 넣었다.
UI Kitten 에서 사용한 걸 넣었는데.. 흠.. 고민중이다.
react 는 예쁜 거 많던데, RN은 마음에 드는게 사실상 없었다.
색상 변경도 쉽지 않고..
이제 보고서 작성해야지...
'소프트웨어 마에스트로 > FrontEnd' 카테고리의 다른 글
[RN] 설정 페이지 만들기 (3) | 2024.11.14 |
---|---|
[RN] 버튼 클릭하면 로딩 컴포넌트 나오기 (2) | 2024.11.13 |
[React Native] 모듈 버그 제거하기 (1) | 2024.11.01 |
[React Native] 짱짱한 시간 모듈 만들기 (1) | 2024.10.29 |
[FE] 구글 플레이스토어 배포기 (2) | 2024.09.02 |