全文を表示するにはネイティブボタンを反応させる方法

Question

すべての例を試しましたが、わかりません。私はこれを使用していますhttps://github.com/xinthink/react-native-material-kit

サイズを幅として使用すると、ボタンの幅が画面から外れます。可能であれば、ロゴを最上部に、フォームとボタンをボタンの上に置くことをお勧めします。これはアンドロイド専用です。

const btnStyle = { 
    btn: { 
     flex: 1, 
     flexDirection:'row' 
     //resizeMode: 'cover' 
    } 
}; 
const ColoredRaisedButton = MKButton.coloredButton() 
    .withStyle(btnStyle.btn) 
    .build(); 

     <ScrollView style={styles.scrollView}> 
      <View style={styles.container}> 
       {/* Here the magic happens*/} 
       <View style={styles.cardStyle}> 
        <Image source={require('./../img/logo_login.jpg')} style={styles.cardImageStyle}/> 
        <View style={styles.cardContentStyle}> 
          <Form 
           ref="form" 
           type={User} 
           onChange={this.onChange.bind(this)} 
           value={this.state.value} 
           options={options} 
          /> 
        </View> 
        <View style={styles.cardActionStyle}> 
         <ColoredRaisedButton> 
          <Text pointerEvents="none" style={styles.buttonText}>BUTTON</Text> 
         </ColoredRaisedButton> 
        </View> 
       </View> 
      </View> 
     </ScrollView> 

    const styles = { 
    cardStyle: { 
     flex: 1, 
     backgroundColor: '#ffffff', 
     borderRadius: 2, 
     borderColor: '#ffffff', 
     borderWidth: 1, 
     shadowColor: 'rgba(0,0,0,.12)', 
     shadowOpacity: 0.8, 
     shadowRadius: 2, 
     alignItems: 'center', 
     flexDirection:'column', 
     justifyContent:'center', 
     shadowOffset: { 
      height: 1, 
      width: 2 
     } 
    }, 
    cardImageStyle: { 
     flex: 1, 
     height: 170, 
     flexDirection:'row', 
     resizeMode: 'cover' 
    }, 
    cardContentStyle: { 
     padding: 15 //, 
     // bottom:0, 
     // position:'absolute', 
     //justifyContent: 'flex-end' 
    }, 
    cardActionStyle: { 
     flex: 1, 
     borderStyle: 'solid', 
     borderTopColor: 'rgba(0,0,0,.1)', 
     borderTopWidth: 1, 
     padding: 15, 
     alignItems: 'center', 
     flexDirection:'column', 
     justifyContent:'center' 
    }, 
    scrollView: { 
     flex: 1 
    }, 
    container: { 
     flex: 1, 
     alignItems: 'stretch', 
     backgroundColor: '#eae9e9', 
     padding: 20 //, 
     //position:'absolute' 
    }, 
    buttonText: { 
     fontSize: 14, 
     fontWeight: 'bold', 
     color: 'white' 
    } 
}; 

Answer 1

あなたは、あなたは全幅ボタンを取得する必要があり、両方cardStyle & cardActionStyleからalignItems: 'center'を削除する必要があります。