[RN][유용한 툴] React Native 화면 켜진 상태로 유지하는 방법

# react-native-keep-awake 라이브러리를 활용한 화면 켜짐 유지하기

- 앱을 개발하다 보면, 앱 사용 중에 화면이 자동으로 꺼지지 않게 막아야 하는 경우가 있다. 본 포스팅에서는 이런 경우 사용할 수 있는 라이브러리를 소개하려고 한다

 

 

# Github Repository

GitHub - sayem314/react-native-keep-awake: Keep the screen from going to sleep. iOS and Android.

 

# 사용법

- 언제나처럼 설치를 합니다.

yarn add @sayem314/react-native-keep-awake

- 사용법은 간단합니다. 만약 hooks를 사용하시는 경우에는 아래와 같이 useKeepAwake를 사용해 주시면 됩니다.

import { useKeepAwake } from '@sayem314/react-native-keep-awake';
import React from 'react';
import { Text, View } from 'react-native';

export default function KeepAwakeExample {
  useKeepAwake();

  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Text>Keep Awake</Text>
    </View>
  );
}

- 타이밍을 컨트롤하고 싶다면 아래와 같이

import { activateKeepAwake, deactivateKeepAwake} from "@sayem314/react-native-keep-awake";
import React from "react";
import { Button, View } from "react-native";

const KeepAwake = () => {
const _activate = () => {
  activateKeepAwake();
};
  const _deactivate = () => {
    deactivateKeepAwake();
  };

  return (
    <View>
      <Button onPress={_activate}>Activate</Button>
      <Button onPress={_deactivate}>Deactivate</Button>
    </View>
  );
}

- 참고로 expo를 사용하시는 경우에는 expo에서 제공하는 https://docs.expo.dev/versions/latest/sdk/keep-awake/를 사용하시는 것을 추천드립니다. 

---