본문 바로가기 메뉴 바로가기

Jonyo Programming

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

Jonyo Programming

검색하기 폼
  • 분류 전체보기 (170)
    • Lecture Note (15)
      • Computer Architecture (8)
      • 프로그래밍 언어론 (1)
      • 컴퓨터 통신 (6)
    • Node.js (16)
    • Javascript (6)
    • React (1)
    • ReactNative (2)
    • Nest.js (2)
    • Java (8)
    • Spring (5)
    • JPA (2)
    • 알고리즘 (2)
    • 알고리즘 풀이 (102)
      • BFS (22)
      • 스택&큐&덱 (2)
      • 재귀 (5)
      • 백트래킹 (7)
      • 시뮬레이션 (21)
      • 수학 (3)
      • 그리디 (7)
      • 동적계획법 (12)
      • 이분탐색 (2)
      • 트리 (5)
      • 그래프 (9)
    • troubleshooting (3)
    • ETC (2)
    • 낙서 (4)
  • 방명록

BottomTab (1)
[ReactNative] React Navigation BottomTab Modal 만들기 (유튜브 하단 탭 기능 구현하기)

우리가 자주 사용하는 Youtube 앱을 보면 하단 탭이 다음처럼 구성되어 있다. 여기서 가운데에 있는 + 아이콘을 누르면 다음과 같은 모달창이 나타난다. 이와 같은 기능을 React Navigation 을 통해 구현해보겠다. 준비사항 "@react-navigation/bottom-tabs": "^6.2.0", "@react-navigation/native": "^6.0.8", "@react-navigation/stack": "^6.2.1", "react-native-modal": "^13.0.1", 구현을 위해 위 라이브러리들이 필요하다 npm 혹은 yarn 을 이용해 설치하자. 결과물 먼저 완성된 결과물을 먼저 보자. 홈화면은 다음과 같이 이루어져있다. 이곳에서 하단의 등록 메뉴를 클릭하면 이런 모달..

ReactNative 2022. 4. 7. 13:51
이전 1 다음
이전 다음
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
  • 컴퓨터 통신
  • 컴퓨터 구조
  • 구현
  • BFS
  • 백준
  • node.js
  • 벨만포드
  • 동적계획법
  • 그리디
  • 자바스크립트
  • java
  • 알고리즘
  • 자바
  • 중앙대학교
  • Computer Architecture
  • 투포인터
  • 시뮬레이션
  • boj
  • 스레드
  • typeORM
  • 세그먼트 트리
  • nodeJS
  • nest.js
  • nestjs
  • dfs
  • ReactNative
  • 예외처리
  • 그래프
  • 재귀
  • 백트래킹
more
«   2025/05   »
일 월 화 수 목 금 토
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
글 보관함

Blog is powered by Tistory / Designed by Tistory

티스토리툴바