프로그래밍/React Native24 [React Native] SVG 파일 사용 시, 터치이벤트 이슈 react-native-svg를 이용하여 svg파일을 컴포넌트로 적용으로 성공하였으나 이벤트를 주려고 하니 문제가 발생하였다. iOS만;; command + d를 눌러 Show Inspector로 확인해보니 영역을 이상하게 잡고 있는 부분이 확인되었다 구글신에게 물어보니 2가지 해결책을 제시해 준다 1. pointerEvents="none" function SvgComponent() { return ( // Svg 컴포넌트 ) } 2. overflow: hidden function SvgComponent() { return ( // Svg 컴포넌트 ) } 속성에 대한 정보는 직접 찾아보기로 하고 일단 여기까지 끝. 2022. 4. 5. [React Native] 이미지를 .svg 파일로 적용하기 다양한 해상도의 기기들을 만족시키기 위해 여러 .png파일을 사용해도 되지만, .svg파일 하나로 대응해보고자 한다(안드로이드에 .svg파일을 적용한 경험을 살려서!) GitHub - react-native-svg/react-native-svg: SVG library for React Native, React Native Web, and plain React web projects. SVG library for React Native, React Native Web, and plain React web projects. - GitHub - react-native-svg/react-native-svg: SVG library for React Native, React Native Web, and plain .. 2022. 3. 20. [React Native] iOS Multiple commands produce... .ttf 또는 .otf 관련 에러 커스텀 폰트를 추가하려다 react-native link 명령어를 사용했더니... 두둥! 이런 에러를 Xcode에서 내뿜는다. 뿜뿜!! 확인해보니 react-native link 명령어로 인해 react-native-vector-icons에서 잠자고 있던 리소스들을 깨워(?) 중복이 발생하여 벌어지는 에러이다 위 이미지를 보면 react-native-vector-icons도 보이고 Zocial.ttf도 보인다 그래서 .ttf 관련 파일들의 참조를 없애주면 해결 가능하다 (추가로 android는 문제없었으며 iOS에서만 발생했다) 위 이미지와 관련된 에러를 Xcode에서 확인 시, Build Phases > Copy Bundle Resources에서 커스텀 폰트(.ttf나 .otf 파일)를 제외한 나머지 .. 2022. 3. 10. [React Native] android react-native-reanimated 에러 정상 작동하다가도 써드파티 라이브러리의 갑작스러운 에러는 이제 익숙하다(예견된 에러일지도...) 아래는 처음 프로젝트 생성시 추가되어 있던 dependencies의 react-native-reanimated 에러이다 attempt to invoke interface method boolean com.swmansion.reanimated.layoutReanimation.NativeMethodsHolder.isLayoutAnimationEnabled on a null object reference 일단 package.json의 상태를 확인해보자 react 17.0.2 react-native 0.65.1 react-native-reanimated 2.1.0 이렇게였고 github을 확인해보니 https://g.. 2022. 2. 1. [React Native] 명령어로 실행시, iOS Simulator 설정 간단하지만 몰라도 Xcode에서 직접 실행해도 된다 하지만 우리는 명령어로 실행시키고 싶기 때문에, 우선 Simulator의 종류를 찾아보자. Xcode를 실행 후 Window > Devices and Simulators를 선택하면 새로운 창이 뜨고 Simulators 탭을 클릭하면 여러 종류가 있는 것을 확인할 수 있다 명령어로 실행시키고 싶은 Simulator를 마음속으로 정한 후 package.json의 기본 설정에 보면 scripts에 ios부분이 있다 "scripts": { "android": "react-native run-android", "ios": "react-native run-ios --simulator \"iPhone 12\"", "start": "react-native start".. 2022. 2. 1. 이전 1 2 3 4 5 다음
