TouchableOpacity не работает в абсолютном представлении Android React Native - PullRequest
0 голосов
/ 28 апреля 2020

Я пытался решить эту проблему в течение последних 2 часов, и я не могу заставить ее работать. Я сделал свою собственную клавиатуру в React Native, и она отлично работает на моем iOS. Однако на Android я не могу нажать TouchableOpacity. Все, что я нажимаю, проходит через клавиатуру.

Я пытался заменить TouchableOpacity на TouchableNativeFeedback, и это дает по крайней мере эффект ряби. Однако код OnPress никогда не выполняется. Я пытался вложить свой компонент в <View>, но тоже не сработал. Не знаю, как это решить. Это мой код:

const styles = StyleSheet.create({
  keyboardContainer: {
    position: "absolute",
    bottom: 0,
    zIndex: 1000,
    height: width * 0.8,
    width: width,
    backgroundColor: "rgb(1,80,185)",
    flexDirection: "row",
    flexWrap: "wrap",
    shadowColor: "#000",
    shadowOffset: {
      width: 0,
      height: 7,
    },
    shadowOpacity: 0.43,
    shadowRadius: 9.51,
    elevation: 1000,
  },
  buttonNum: {
    borderColor: "white",
    width: width * 0.25,
    height: width * 0.2,
    justifyContent: "center",
    alignItems: "center",
  },
  numText: {
    fontSize: 25,
    color: "white",
  },
});

class Keyboard extends Component {
  static contextType = KeyboardContext;

  render() {
    if (this.context.keyboard)
      return (
        <View style={styles.keyboardContainer}>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("1")}
          >
            <Text style={styles.numText}>1</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("2")}
          >
            <Text style={styles.numText}>2</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("3")}
          >
            <Text style={styles.numText}>3</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.setContext({ keyboard: false })}
          >
            <Icon name="keyboard-close" style={styles.numText} />
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("4")}
          >
            <Text style={styles.numText}>4</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("5")}
          >
            <Text style={styles.numText}>5</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("6")}
          >
            <Text style={styles.numText}>6</Text>
          </TouchableOpacity>
          <TouchableOpacity style={styles.buttonNum} onPress={this.removeText}>
            <Icon name="plus-circle" style={styles.numText} />
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("7")}
          >
            <Text style={styles.numText}>7</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("8")}
          >
            <Text style={styles.numText}>8</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("9")}
          >
            <Text style={styles.numText}>9</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("-")}
          >
            <Icon name="minus-circle" style={styles.numText} />
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText(".")}
          >
            <Text style={styles.numText}>.</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={() => this.context.handleText("0")}
          >
            <Text style={styles.numText}>0</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={this.context.removeText}
          >
            <Feather name="delete" style={styles.numText} />
          </TouchableOpacity>
          <TouchableOpacity
            style={styles.buttonNum}
            onPress={this.context.clearText}
          >
            <Text style={[styles.numText, { fontSize: 18 }]}>CLEAR</Text>
          </TouchableOpacity>
        </View>
      );
    return null;
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...