| 346 | } |
| 347 | |
| 348 | renderFrontface() { |
| 349 | if (this.state.baseLayout) { |
| 350 | const { height, width, y, x } = this.state.baseLayout; |
| 351 | const faceStyle = { |
| 352 | height, |
| 353 | width, |
| 354 | top: y, |
| 355 | left: x, |
| 356 | ...Platform.select({ |
| 357 | ios: { |
| 358 | zIndex: 0, |
| 359 | }, |
| 360 | }), |
| 361 | }; |
| 362 | |
| 363 | const pointerEvents = this.props.expanded ? 'box-none' : 'auto'; |
| 364 | |
| 365 | return ( |
| 366 | <Animated.View |
| 367 | ref={this.setFrontFaceRef} |
| 368 | style={[styles.face, faceStyle]} |
| 369 | pointerEvents={pointerEvents} |
| 370 | > |
| 371 | { |
| 372 | this.props.renderFrontface() |
| 373 | } |
| 374 | </Animated.View> |
| 375 | ); |
| 376 | } |
| 377 | |
| 378 | return null; |
| 379 | } |
| 380 | |
| 381 | renderBackface() { |
| 382 | if (this.state.baseLayout) { |