React Native 之 Modal介绍与使用

本文详细介绍了React Native中的Modal组件,包括其基本属性如animationType、透明度和可见性设置,以及如何创建带有指示器的模态。还提供了资源链接供读者深入学习。文章鼓励读者在遇到Modal组件不能满足需求时尝试自定义实现。
摘要由CSDN通过智能技术生成

前言


  • 遗漏的常用组件,刚发现官方有提供,这边也来介绍一下。
  • 如本文有错或理解偏差欢迎联系我,会尽快改正更新!
  • 如有什么问题,也可直接通过邮箱 277511806@qq.com 联系我。

本章涉及资源下载:

链接: https://pan.baidu.com/s/1o84o6JS 密码: htx6

属性


  • animationType(动画类型) PropTypes.oneOf([‘none’, ‘slide’, ‘fade’])

    • none:没有动画
    • slide:从底部滑入
    • fade:淡入视野
  • onRequestClose(被销毁时会调用此函数)Platform.OS ===’android’?PropTypes.func.isRequired:PropTypes.func

    • 在 ‘Android’ 平台,必需使用此函数
  • onShow(模态显示的时候被调用)function

  • transparent (透明度) bool

    • true时,使用透明背景渲染模态。
  • visible(可见性) bool

    • 决定模态是否可见
  • onOrientationChange(方向改变时调用)PropTypes.func

    • 在模态方向变化时调用,提供的方向只是 ” 或 ”。在初始化渲染的时候也会调用,但是不考虑当前方向。
  • supportedOrientations(允许模态旋转到任何指定取向)PropTypes.arrayOf(PropTypes.oneOf([‘portrait’, ‘portrait-upside-down’, ‘landscape’,’landscape-left’,’landscape-right’]))

    • 在iOS上,模态仍然受 info.plist 中的 UISupportedInterfaceOrientations字段中指定的限制。

  • modal的使用很广泛,这边我们来看看怎么让视图以模态的形式展示:

        export default class One 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值