自定义按钮类从'react'导入React，{Component};从“react-native”导入{平台、样式表、文本、视图、按钮、可触摸不透明度};

导出默认类FlatButton扩展组件{ state={ backgroundColor：'#f01d71'，背景颜色2：'#f01d71'，已按下：false、};
如果您的状态是“按下”，请选择“按下”。true，背景颜色：'rgb（60，32，140）'，背景颜色2：'#f01d71'}）中的值;} else { this.setState（{按下：false，背景颜色：'#f01d71'，背景颜色2：'#f01d71'}）中的值;} } render（）{ return（〈查看样式={{

justifyContent: 'center',
      alignItems: 'center',
     
      }}>
      <TouchableOpacity
    style={{
    backgroundColor:this.state.backgroundColor, 
    borderRadius: 10,
    padding: 10,
    shadowColor: '#000000',
    shadowOffset: {
      width: 0,
      height: 3
    },
    shadowRadius: 5,
    shadowOpacity: 1.0
    }}
          onPress={()=>this.changeColor()}
            >
        <Text style={styles.buttonText}>{this.props.text}</Text>
      </TouchableOpacity>
  </View>
);

（）}}
创建（{文本：{颜色：'白色' }，按钮文本：{颜色：'白色'，字体粗细：'粗体'，字体大小：16、辩护内容：'居中'、}、}）;

我正在呈现的第二个组件从“react”导入React，{useState，useEffect};从“react-native”导入{文本、视图、样式表、按钮、维度};从'../shared/FlatButton'常量导入平面按钮自定义视图=（）=〉{ return（

</View>
        <View style= {styles.btnflex}>
             <FlatButton text="Crop" />
            <FlatButton text="Crop" />
            <FlatButton text="Crop" />
        </View>
       
    </View>
);

};
const styles=样式表。创建（{容器：{ flex：1，//边框宽度：5、//边框颜色：'black'，填充水平：10,

},
btnflex : {
     flexDirection :'row',
     marginTop: 5,
       padding : 5,
     justifyContent : 'space-between',
     borderWidth : 5,
    borderColor : 'red'
},

}）;
导出默认自定义视图;

输出为out put is this