728x90

React Native 4

[React Native] CLI 환경에서 linear-gradient 설치하기

그라데이션 배경을 설정하기 위해 React Native에서 linear-gradient를 사용하려고 했다.Andorid와 Web 두 가지 OS를 동시에 개발하는 상황에서 linear-gradient 패키지를 설치하니 버전 충돌이 발생했다.그에 따라서 버전 충돌로 인한 현재 설치된 React 및 React DOM을 제거하고, 호환되는 버전을 설치하니 해결되었다.방법은 아래와 같다. 1. 버전 충돌로 인한 현재 설치된 React 및 React DOM 제거npm uninstall react react-dom// 종속성 충돌로 제거가 불가능 할 경우 충돌 무시하고 제거npm uninstall react react-dom --legacy-peer-deps 2. 호환되는 버전 설치npm install react@1..

React Native 2024.09.07

[React Native] missing-asset-registry-path could not be found within the project or in these directories: node_modules 에러 해결

BUNDLE  ./index.android.js error: Error: Unable to resolve module missing-asset-registry-path from C:\Users\pineone\Desktop\workSpace\RoundNoteCli\node_modules\@react-navigation\elements\lib\commonjs\assets\back-icon-mask.png: missing-asset-registry-path could not be found within the project or in these directories:   node_modules > 1 | �PNG   2 |    3 |   4 | IHDR2���gAMA��                     ..

카테고리 없음 2024.08.30

[React Native] Android OS에서 녹음 기능 구현하기 (Expo)

Android OS에서 녹음 기능 구현하기Expo 라이브러리의 여러 모듈을 활용하여 녹음 및 파일 저장 기능을 구현할 수 있다.우선 공식 문서를 읽어볼 것을 권한다.https://docs.expo.dev/versions/latest/sdk/audio/ AudioA library that provides an API to implement audio playback and recording in apps.docs.expo.dev   1. 권한 요청 및 패키지 설치expo install expo-avexpo install expo-media-library // 미디어 파일 관리expo install expo-file-system // 파일 시스템에 접근하여 파일 생성, 읽기, 쓰기, 이동, 삭제  useE..

React Native 2024.08.28

[React Native] Animated.View를 사용해서 Pulse 애니메이션 구현하기 (Expo)

React Native에서 녹음 버튼의 애니메이션을 적용해보도록 하자 React Native1. 상태와 값 설정하기const animatedValue = useState(new Animated.Value(1))[0];animatedValue의 값 1은 애니메이션에서 시작 시의 기본 상태를 나타난다. 이 값은 아래에 나오는 Animated.timing 메소드에서 toValue를 어떻게 설정하느냐에 따라 달라진다.예를 들어서, animatedValue가 0에서 3 사이의 값일 때 해당 범위로 매핑된다. 2. Pulse 애니메이션 시작하기 const startPulseAnimation = () => { console.log('Pulse animation started.'); Animated..

React Native 2024.08.22
728x90
LIST