Consider implementing RCTModalHostView

[andrewwebber]

https://facebook.github.io/react-native/docs/modal.html

[quincycs]

is there a list of components implemented vs not implemented? maybe someplace inside the code to refer to (since documentation can be out of date).

when writing an RN app, it would be nice to know that i'm coding against a component that isn't supported for windows. like a grid listing components with checkmark for support.

[adisoftbn]

The list is here: https://github.com/ReactWindows/react-native-windows/blob/master/docs/CoreParityStatus.md

I also need the modal component and I will try to temporary simulate it with absolute positioning view somehow. I dont know if it will work.

[asteingass]

Hello, any updates on this? Has someone found a good workaround?
Thanks
Andreas

[kevinvangelder]

It is possible to do a pure JS implementation, which is what we're doing for now.

import React, { Component } from 'react'
import { View } from 'react-native'
import Styles from './Styles/ModalStyles'

export default class Modal extends Component {
  static propTypes = {
    visible: React.PropTypes.bool,
    children: React.PropTypes.object
  }

  render () {
    if (!this.props.visible) return (<View />)

    return (
      <View style={Styles.modal}>
        {this.props.children}
      </View>
    )
  }
}

[asteingass]

@kevinvangelder Thanks for the answere. So you just define then a "smaller" screen in the style, right?

[kevinvangelder]

Correct, and it has the added benefit that you get full control of the backdrop (the RN modal only lets you control transparency via Boolean). Just be sure to render it last thing or use a z-index.

[asteingass]

Do you have an example style? That would be awesome.
Thanks in advance

[kevinvangelder]

import { StyleSheet } from 'react-native'

export default StyleSheet.create({
  modal: {
    position: 'absolute',
    top: 0,
    right: 0,
    bottom: 0,
    left: 0,
    backgroundColor: 'rgba(0,0,0,0.5)',
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  }
})

[fatfatson]

need this

[acuntex]

It's pretty hard to use react-native-windows without RCTModalHostView because a lot of 3rd party components use Modal to position elements.

[rozele]

Closed by #1996