React Native 시간에 따라 배경화면(테마) 바꾸기

2021. 7. 4. 21:11coding

반응형

밤에는 밤 배경화면을, 낮에는 낮 배경화면으로 설정하는 방법 

render의 ImageBackground를 다음과 같이 설정하면 

새로고침 하는 시각을 기준으로 배경화면이 바뀐다 

Date.getHours()를 이용해 현재 시각을 받고, 대소관계 비교를 위해 이를 Int로 바꿔준다. 

 

// 오전 5시 ~ 오후 8시 59분까지는 day.png, 그 외의 시간에는 night.png를 배경화면으로 설정
<ImageBackground  style={styles.backgroundImage} source={parseInt(new Date().getHours()) >= 5 && parseInt(new Date().getHours()) <= 20 ? require('./day.png') : require('./night.png')} imageStyle={{resizeMode: 'cover' }}> 
반응형