0๊ณผ 1 ์ฌ์ด์์ ๋ณ๊ฒฝ๋๋ Animated.Value๋ฅผ ์ฌ์ฉํ์ฌ ํ ๋๋ฆฌ ์์์ ์ ๋๋ฉ์ด์ ์ ์ ์ฉํ๋ ค๋ ์ ๋ณด๊ธฐ๊ฐ ์์ต๋๋ค. https://facebook.github.io/react-native/docs/animated ์ ๊ฐ์ด๋๋ฅผ
borderColor: this.state.active.interpolate({
inputRange: [0, 1],
outputRange: ['rgba(0, 0, 0, 0)', 'rgba(0, 0, 0, 1)']
})
๊ทธ๋ฌ๋ฉด ์ฑ(Android)์ ๊ฒฝ๊ณ ๊ฐ ์์ฑ๋ฉ๋๋ค.
index.android.bundle:29278Warning: Failed propType: Invalid prop `borderColor` supplied to `View`: [object Object]
Valid color formats are
- '#f0f' (#rgb)
- '#f0fc' (#rgba)
- '#ff00ff' (#rrggbb)
- '#ff00ff00' (#rrggbbaa)
- 'rgb(255, 255, 255)'
- 'rgba(255, 255, 255, 1.0)'
- 'hsl(360, 100%, 100%)'
- 'hsla(360, 100%, 100%, 1.0)'
- 'transparent'
- 'red'
- 0xff00ff00 (0xrrggbbaa)
Bad object: {
"borderWidth": 2,
"justifyContent": "center",
"alignItems": "center",
"width": 200,
"height": 200,
"borderRadius": 100,
"borderColor": "rgba(0, 0, 0, 0)"
} Check the render method of `Circle`.
์์ ๊ฒฝ๊ณ ์์ borderColor๊ฐ ์ฌ๋ฐ๋ฅธ ๊ฒ ๊ฐ์ต๋๋ค. ๊ทธ๋ฌ๋ ๊ทธ๊ฒ์ ์ฌ์ ํ โโ๊ฒฝ๊ณ ๋ฅผ์ฃผ์์ต๋๋ค.
์ฌ์ฉํ์ฌ ๊ณ ์ <Animated.View>
๋์ <View>
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
์ฌ์ฉํ์ฌ ๊ณ ์
<Animated.View>
๋์<View>