Question

我写了一个关于使用本机库响应本机的应用程序。当我尝试在按钮中放置边距时，它不会在按钮内显示文本。我该如何解决？当我删除边距时，它可以正常工作。但是当我把保证金放回去时它不起作用。我搜索了很多资源，但没有人显示任何解决方案。这是代码：

import React, { Component } from 'react';
import { Platform, StyleSheet, View, Image } from 'react-native';
import FloatLabelInput from './src/components/FloatLabelInput';
import {Button, Text} from 'native-base'

type Props = {};
export default class App extends Component<Props> {
 render() {
  return (
   <View style={styles.container}>
    <Image
     style={styles.background_Image}
     source={require('./media/free-blurry-background-1636594.jpg')}
    />
    <Image source={require('./media/Save-the-Children-Logo.png')} 
    style={{height: '10%', width: '100%'}}/>
    <FloatLabelInput name='Username' security='false'/>
    <FloatLabelInput name='Password' security='true'/>
    <Button block rounded danger
        onPress={() => console.log('my first app')}
        style = {styles.button_style}
        // accessibilityLabel="Learn more about this purple button"
    > 
      <Text >LOGIN</Text>
    </Button>
  </View>
);
 }
}

const styles = StyleSheet.create({
 container: {
  flex: 1,
  justifyContent: 'center',
  alignItems: 'center',
  backgroundColor: '#C0C0C0',
 },
 welcome: {
  fontSize: 20,
  textAlign: 'center',
  margin: 10,
 },
instructions: {
 textAlign: 'center',
 color: '#333333',
 marginBottom: 5,
},
background_Image: {
 backgroundColor: '#ccc',
 flex: 1,
 position: 'absolute',
 width: '100%',
 height: '100%',
 justifyContent: 'center',
},
 button_style: {
 margin: '5%'
 }
 });

Answer 1

我认为通过参考此问题https://github.com/facebook/react-native/issues/19164，这是与百分比相关的错误。对于其他解决方案，请尝试使用px

button_style: {
    margin: 5
}

具有样式裕度的本机基本按钮中没有文本

1 个答案: