[React-Native] 스크롤 기능

Frontend/React-Native

IagreeBUT 2021. 6. 1. 01:57

728x90

화면 스크롤 기능을 구현해보도록 합시다.

저번강의 코드를 가져와서 사용했습니다.

[React-Native]Touch event, Button

개발환경 시작하기 이제 개발환경 시작하기는 생략하도록 하겠습니다 react_native_01이라는 새로운 프로젝트를 생성하여 진행하였습니다. react-native init react_native_02 에뮬레이터까지 틀어주도록 합

iagreebut.tistory.com

먼저 스크롤 기능을 사용해보기 위해 Add Number버튼을 많이 눌러 숫자를 늘려보았습니다.

모두에게 익숙한 스크롤 기능을 구현해보도록 합니다.

ScrollView IMPORT

스크롤 기능을 사용하기 위해서는 ScrollView를 임포트해주어야 합니다.

import { ScrollView } from 'react-native';

적용하기

원하는 범위를 지정하여 그 부분을 스크롤뷰 태그로 감싸줍니다.

일단은 숫자 부분만 적용시켜보면, 다음과 같습니다.

728x90