पृष्ठभूमि रंग

Question

प्रतिक्रिया मूल के साथ प्रतिक्रियात्मक सीमा त्रिज्या प्रतिक्रिया, borderRadius काम कर रहा है लेकिन बटन पर दिया गया पृष्ठभूमि रंग एक वर्ग रहता है। यहाँ क्या हो रहा है?

जे एस

<TouchableHighlight 
    style={styles.submit} 
    onPress={() => this.submitSuggestion(this.props)} 
    underlayColor='#fff'> 
    <Text style={[this.getFontSize(),styles.submitText]}>Submit</Text> 
</TouchableHighlight> 

शैली

... 
submit:{ 
    marginRight:40, 
    marginLeft:40, 
    marginTop:10, 
}, 
submitText:{ 
    paddingTop:20, 
    paddingBottom:20, 
    color:'#fff', 
    textAlign:'center', 
    backgroundColor:'#68a0cf', 
    borderRadius: 10, 
    borderWidth: 1, 
    borderColor: '#fff' 
}, 
... 

Answer 1

TouchableHighlight खुद के लिए बटन स्टाइल चलती का प्रयास करें:

शैलियाँ:

submit:{ 
    marginRight:40, 
    marginLeft:40, 
    marginTop:10, 
    paddingTop:20, 
    paddingBottom:20, 
    backgroundColor:'#68a0cf', 
    borderRadius:10, 
    borderWidth: 1, 
    borderColor: '#fff' 
    }, 
    submitText:{ 
     color:'#fff', 
     textAlign:'center', 
    } 

बटन (एक ही):

<TouchableHighlight 
    style={styles.submit} 
    onPress={() => this.submitSuggestion(this.props)} 
    underlayColor='#fff'> 
    <Text style={[this.getFontSize(),styles.submitText]}>Submit</Text> 
</TouchableHighlight> 

Answer 2

यदि आप react-native-button का उपयोग आप अपनी शैली को overflow: hidden जोड़ना चाहिए:

जे एस:

import Button from 'react-native-button'; 

<Button style={styles.submit}>Submit</Button> 

शैलियाँ:

submit { 
    backgroundColor: '#68a0cf'; 
    overflow: 'hidden'; 
}