react native 仿modal关闭弹窗遗留背景颜色

##背景: 最近开发查看大图功能,本来使用RN自带的modal弹窗。但是无奈需要在modal里面弹出toast提示语。modal层级太高，不能显示处理啊。没有解决方案，就写一个仿modal的背景View替代modal使用、但是在关闭时候会留下黑色的背景色； 关闭modal底部时候,留有黑色背景

仿modal的实现思路就是用绝对定位显示一个屏幕宽高的VIEW：

//简易版仿modal
render(){
   <View style={{
                width: Dimens.fill_width,
                height: Dimens.fill_height,
                position: "absolute",
                top: 0,
            }}>
            //这边为modal中显示的内容.随便加的一个标签
            <Image/>
  </View>
}

##解决办法： (1)在View标签上加上一个zIndex层级标签:

   <View style={{
                ...//原有样式
                zIndex:10 +添加一个层级属性
            }}>
               ....
  </View>

(2)使用Animated动画让modal视图慢慢淡出: 放置了一些关键代码--思路可以参考:初始化一个动画参数。1到0 在关闭的时候将透明度变成0 用动画进行过度

...
this.state = {
   fadeInOpacity: new Animated.Value(1)
}

render(){
   <Animated.View style={{
                width: Dimens.fill_width,
                height: Dimens.fill_height,
                position: "absolute",
                top: 0,
                opacity: fadeInOpacity
            }}>
            //这边为modal中显示的内容
            <Image onPress={()=>{
                  Animated.timing(this.state.fadeInOpacity,  // 动画中的变量值
                     { toValue: 0, // 透明度最终变为1，即完全不透明
                       duration: 200 // 让动画持续一段时间
                      }).start(() =>  this.state.fadeInOpacity.setValue(1))
              }}/>

  </Animated.View>
}
...

##实现效果： 因为gif图卡顿的原因，显示有阴影。实际情况当然是好的~ 哈哈

这边记录一下遇到的问题。