Machine_웅_Note

// App.js import React, { useRef } from "react"; import Child from "./Child"; export default function App() { const childRef = useRef(); return ( { childRef.current.showAlert(); }} > 버튼 눌러 ); } // Child.js import React, { forwardRef, useImperativeHandle } from "react"; const Child = forwardRef((props, ref) => { useImperativeHandle(ref, () => ({ showAlert() { alert("hi"); } })); return 자식임; }); e..

1 ) 프로젝트 생성 npx react-native init MyApp --template react-native-template-typescript 2) 필요 모듈 추가 npm install -D typescript @types/jest @types/react @types/react-native @types/react-test-renderer 3) tsconfig.json 파일 생성 및 내용 추가 { "compilerOptions": { "allowJs": true, "allowSyntheticDefaultImports": true, "esModuleInterop": true, "isolatedModules": true, "jsx": "react", "lib": ["es6"], "moduleResolu..

aboutreact.com/react-native-calendar-picker/

import React, { Component } from 'react'; import { StyleSheet, Dimensions, View , Image, Text , Animated, Easing, TouchableOpacity} from "react-native"; const { width: WIDTH, height: HEIGHT } = Dimensions.get("window"); export default class App extends Component{ constructor(){ super() this.state = { is_showing : false, } this.animation = new Animated.Value(0), // 이동 this.animation2 = new Animat..

app.js import React, { Component, PureComponent } from 'react'; import { AppRegistry, StyleSheet, Dimensions, View ,Image, Text ,Animated} from "react-native"; import { GameEngine, GameLoop } from "react-native-game-engine"; import {Finger} from './src/Finger' import FastImage from 'react-native-fast-image' import Matter from 'matter-js' import Avalanche from './src/Avalanche' import Wall from '..

설치 필요 1) npm install @react-native-community/cameraroll --save 주소 : www.npmjs.com/package/@react-native-community/cameraroll @react-native-community/cameraroll React Native Camera Roll for iOS & Android www.npmjs.com 2) npm install react-native-unimodules 주소 : www.npmjs.com/package/react-native-unimodules react-native-unimodules This library contains the core unimodule infrastructure and a colle..

import React, { Component } from 'react'; import { View, TouchableOpacity, Text, StyleSheet, Image, Dimensions, Animated, Linking } from 'react-native'; import { ScrollView } from 'react-native-gesture-handler'; import Util_String from './Util_String' import AsyncStorage from '@react-native-async-storage/async-storage'; import API from './API' const height = (Dimensions.get('window').height) * 0..

import React, { Component } from 'react'; import { View, TouchableOpacity, Text, StyleSheet, Image, Dimensions, Animated, Linking } from 'react-native'; import { ScrollView } from 'react-native-gesture-handler'; import Util_String from '../Utils/Util_String' import AsyncStorage from '@react-native-async-storage/async-storage'; import API from '../Utils/API' const height = (Dimensions.get('window..

import { Platform, PixelRatio } from 'react-native'; fontSizeTest(){ const { width: screenWidth, height: screenHeight } = Dimensions.get('window'); const scale = screenWidth / 1440; // 기준 넓이 1440 const newSize = 52 * scale let result= 0 if (Platform.OS === 'ios') { result = Math.round(PixelRatio.roundToNearestPixel(newSize)) } else { result = Math.round(PixelRatio.roundToNearestPixel(newSize)) -..

React Native 앱 상태 체크 AppState 는 앱이 동작하거나 백그라운드에 있을 때, 상태가 변경 되는것을 알려준다. AppState는 의도와 적절한 행동을 결정하는데 종종 사용되어진다, 푸시 알람을 사용할 때. App States active: foreground에서 동작 background: background에서 동작 [ios] inactive Basic Usage AppState.currentState를 통해서 앱 상태를 알 수 있다. 브릿지를 통해서 추출 되기 전엔 currentState가 null이 될것이다. import React, { Component } from 'react'; import { AppState, Text } from 'react-native'; class App..