3

React Native Maps でカスタム マーカーを使用しています。最初の読み込みでマーカーに触れると、マーカーのコールアウト (タイトルと説明) が表示されます。ただし、マップを新しい地域にドラッグした後は、マーカーに触れることができなくなります。領域を変更した後にマーカーのタイトルと説明を表示するには、ユーザーはマーカー座標を正確にタップする必要があります。

マップをドラッグしている間、マーカー イメージが点滅します。これは、彼らが触れられなくなったことと関係があるのではないかと思います。どうすればこれを防ぐことができますか?

<MapView
  style={styles.homeMapView}
  region={this.state.currentLocation}
  onRegionChange={this.onRegionChange}
  showsUserLocation={true}
  onPress={(evt) => console.log(evt.nativeEvent.coordinate)}
>
  {this.state.nearbyLocations.map((marker, key) => (
    <MapView.Marker
      key={marker.id}
      coordinate={marker.coordinate}
      title={marker.title}
      description={marker.description}
      onPress={(evt) => console.log('pressed ', evt)}
      image={require('../Public/existingPins.png')}
      centerOffset={{x: 0, y: -20}}
    />
  ))}
</MapView>

編集

マップ領域が変更された後も、マークは実際にはまだタッチ可能のようです。マーカーのonPress機能は、マップ領域が変更された場合でも、マーカーがタッチされるたびにコンソール ログに記録されます。React Native Mapsのドキュメントをもう少し読んでshowCalloutみると、タッチで起動できる部分だけ縮んでいるように見えます。このタッチ可能な領域は、カスタム マーカーが使用されている場合にのみ縮小されます。

4

1 に答える 1