如何在react-native中渲染一个图像而不是另一个图像？

Question

1 [] 1：http://i.stack.imgur.com/h3qPR.jpg

我正在练习最近的反应。我想在动画期间一个图像总是在另一个图像上方。除了设置不透明度外我该怎么办？

Answer 1

react-native的最新版本允许您在图像标记内部进行渲染。因此，您可以为Image标记内的recordPlayer添加Image标记作为背景。尝试像

这样的东西

＆＃13;

＆＃13;

renderRecordPlayer = _ => (
 <Image style={styles.background}
   source={...} >
   <Image style={styles.recordPlayer}
     source={...} />
 </Image>
)

const styles = StyleSheet.create({
  background: {
    flex: 1,
    width: null,
    height: null,
    // center the recordPlayer in the background Image
    justifyContent: 'center',
    alignItems: 'center',
    resizeMode: 'cover', // make sure background covers all of screen
  },
  {
    width: ...,
    height: ...,
    resizeMode: 'contain',
  },
})

＆＃13;

＆＃13;

＆＃13;