React本机按钮绝对位置不适用于真正的iOS特定设备

我在WebView上的绝对位置放置了一个按钮。
此按钮适用于任何模拟器和我的iPhone 5s real设备，但不适用于iPhone Plus real设备。
轻敲按钮时会有反应，但按下按钮时不会启动。当将位置设置为相对位置时，它工作。
所有模拟器和设备都是相同的iOS版本（12.2）

有人知道这个问题吗

环境
反应本机0.56
iOS 12.2

import React，{Component}来自'React'；
从“react native”导入{ActivityIndicator、BackHandler、键盘、NetInfo、平台、ScrollView、状态栏、样式表、文本、TouchableOpacity、视图、WebView}；
从“反应本机元素”导入{按钮，图标}
导出默认类标志Screen扩展React.Component{
建造师（道具）{
超级（道具）
}
车把压力机{
this.refs['WEBVIEW\u REF'].goBack（）
返回真值
}
render（）{
返回(
);
}
}
const styles=StyleSheet.create({
纽扣背：{
宽度：45，
身高：45，
位置：'绝对'，
左:10,，
底数：60，
背景颜色：“#bfbf”，
不透明度：0.9
},
容器：{
弹性：1，
paddingTop:25，
背景颜色：“#fff”
},
});

在按钮上使用

填充

，它会解决问题。

在这种情况下，您需要使用

维度

。例如，在您的案例中，您可以这样使用它：

buttonBack: {
  width: Dimensions.get('window').width/100*10,
  height: Dimensions.get('window').height/100*10,
  position: 'absolute',
  left: Dimensions.get('window').width/100*2,
  bottom: Dimensions.get('window').height/100*5,
  backgroundColor: '#bfbfbf',
  opacity: 0.9
},

尺寸。获取（“窗口”）。宽度/100*10表示设备总尺寸的10% 屏幕宽度和高度相同

---

尺寸与设备相关。因此，它将根据设备屏幕的高度和宽度采取相同的位置。

通过包装绝对位置视图固定

  render() {
            return (
                <View style={styles.container}>
                    <StatusBar backgroundColor="white" barStyle="dark-content" />
                    <WebView
                        ref="WEBVIEW_REF"
                        bounces={false}
                        source={{ uri: 'https://example.com' }}
                        style={styles.container}
                    />
                   <View style={styles.navContainer}>
                        <Button
                           onPress={this.handleBackPress.bind(this) }
                           buttonStyle={styles.buttonBack}
                           title=""
                           icon={{
                               name: 'chevron-left',
                               type: 'material-community',
                               iconStyle: { color: global.color.normal }
                           }}
                        />
                    </View>
                </View>
            );
        }
    }

    const styles = StyleSheet.create({
        buttonBack: {
            width: 45,
            height: 45,
            left: 10,
            backgroundColor: '#bfbfbf',
            opacity: 0.9
        },
        // moved from buttonBack style
        navContainer: {
            position: 'absolute',
            bottom: 60
        },
        //
        container: {
            flex: 1,
            paddingTop: 25,
            backgroundColor: '#fff'
        },
    });

render（）{
返回(
);
}
}
const styles=StyleSheet.create({
纽扣背：{
宽度：45，
身高：45，
左:10,，
背景颜色：“#bfbf”，
不透明度：0.9
},
//从纽扣背样式移动
导航集装箱：{
位置：'绝对'，
底数：60
},
//
容器：{
弹性：1，
paddingTop:25，
背景颜色：“#fff”
},
});

在某些情况下，绝对位置在ios上无法正常工作。你应该用一个：

<View style={{position:'absolute',...other styles}}>
<Button/> // without position style
<View>

//无职位风格

<View style={{position:'absolute',...other styles}}>
<Button/> // without position style
<View>