• 리액트 네이티브(React Native) 사용기 18편 - Tabbar 이미지 Dynamic하게 변경하기

    리액트 네이티브(React Native), Expo로 이전 글까지 구현한 부분에서 Tabbar에 내가 원하는 이미지를 넣어 볼 차례이다. 일단 최초 화면에서는 Tabbar의 사용자 쪽 아이콘은 기본아이콘이다. 이 부분을 사용자를 생성하면 사용자를 생성할 때 사용한 이미지로 바꾸는 작업을 할 것이다. 즉, 다이나믹(Dynamic)한 Tabbar 이미지의 변경이다. 시나리오 SQLite의 users 테이블을 지웠다가 current 필드를 추가한다. (current가...


  • 리액트 네이티브(React Native) 사용기 17편 - Navigator 조금 더 파헤치기

    리액트 네이티브(React Native), Expo로 이전 글까지 구현한 부분에서 이제 BottomTab을 숨겨볼 차례이다. 일단 최초 화면에서는 BottomTab이 있어도 괜찮지만 Navigator에서의 두 번째 스택 이후에는 tabBar가 사라지는 것을 구현하고 싶었다. 일단 Document를 참고한다. 아주 간단하다. const Navigator = createStackNavigator({ Home: { screen: HomeScreen }, User: { screen: CreateUserScreen }, Create: { screen:...


  • 리액트 네이티브(React Native) 사용기 16편 - 이미지 로테이션 하기

    리액트 네이티브(React Native), Expo로 이전 글까지 구현한 부분에서 아이콘의 회전이 필요하여 이미지 회전에 관련된 부분에 대해 작성해 본다. 목표 메시지 이미지를 인스타그램과 같은 형태로 꼬리부분이 왼쪽이 아닌 오른쪽으로 돌리기. 시나리오 Row가 그려지기 전에 메시지 이미지를 회전시킨 후, 그 회전시킨 이미지를 뿌린다. 일단 이미지 회전에 관한 지식이 전무하기 때문에… Document를 참고한다....


  • 리액트 네이티브(React Native) 사용기 15편 - BottomTab과 Navigation 함께 이용하기

    리액트 네이티브(React Native), Expo로 이전 글까지 구현한 부분에 이제 BottomTab을 넣어볼 차례이다. 일단 BottomTab에 관한 지식이 전무하기 때문에… 역시나.. Document를 참고한다. Document를 전부 읽지 않았다면… 방법을 전혀 몰랐을 것이지만! 맨 밑에 보면 A stack navigator for each tab라고 설명이 있다. 꼭 Document 메뉴라도 꼭 다 읽어보도록 하자. 그러면 아래와 같이...


  • 리액트 네이티브(React Native) 사용기 14편 - 함수만 존재하는 js파일 만들기

    리액트 네이티브(React Native), Expo로 이전 글까지 구현한 부분중에 Alert를 호출하는 부분이 있다. 이 부분의 공통점은 아래와 같다. 버튼이 3개이다. 디바이스가 iOS인지 Android인지 구분한다. 선택된 후 각각의 기능을 수행한다. 위와 같은 공통점을 가지고 있어 한번 묶어보기로 했다. 일단… Javascript 및 React Native에서 Helper나 Util 파일을 만드는 것에 대한 내용을 전혀 모르기...