Мне нужно свойство тени Box, подобное этой кнопке, в React Native

Question

Я использую это свойство, но не могу работать

shadowColor: "#000",
    shadowOffset: {
        width: 0,
        height: 2,
    },
    shadowOpacity: 0.25,
    shadowRadius: 3.84,

    elevation: 5,

Answer 1

Компонент React-Native Button не имеет свойства style. Если вы хотите настроить стиль кнопки, вам нужно создать пользовательскую кнопку, используя TouchableOpacity или TouchableNativeFeedback.

import * as React from 'react';
import { Text, View, StyleSheet, TouchableOpacity } from 'react-native';

export default function App() {
  return (
    <View style={styles.container}>
      <TouchableOpacity style={styles.buttonStyle}>
        <Text style={styles.textStyle}>OK</Text>
      </TouchableOpacity>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  buttonStyle: {
    width: '80%',
    padding: 10,
    backgroundColor: '#E13C17',
    borderRadius: 10,
    shadowColor: '#000',
    shadowOffset: {
      width: 0,
      height: 2,
    },
    shadowOpacity: 0.25,
    shadowRadius: 3.84,
    elevation: 5,
  },
  textStyle: {
    textAlign: 'center',
    color: '#FFF',
    fontSize: 18,
  },
});

Надеюсь, это вам поможет. Не стесняйтесь сомневаться.