Реагировать на собственные карты Пользовательский маркер, блокирующий маркер onPress - PullRequest
Новая
       10

Реагировать на собственные карты Пользовательский маркер, блокирующий маркер onPress

0 голосов
/ 09 ноября 2019

У меня есть пользовательские маркеры, которые отображаются на моей карте, и делаю это так, как я хочу. Я использую Custom Marker, который представляет собой View, Image, а затем текст, относящийся к событию поверх изображения.

По некоторым причинам использование пользовательского представления маркера блокирует onPress на компоненте Marker.

Я проверил событие onPress, аналогичное приведенному ниже для тестирования:

<Marker onPress={() => {console.log('Pressed')}}> ..., но регистрирует сообщение прессы только тогда, когда я удаляю свое пользовательское представление маркера внутри компонента Marker.

Есть ли причина, по которой пользовательский вид маркера будет останавливать onPress? Как мне обойти это и запустить событие onPress для пользовательского маркера?

Добавлен полный код ниже для лучшего вида. Сейчас это работает, но только потому, что я использую событие onSelect для iOS. onPress работает так же, как для Android, но не для iOS. 

<MapView 
    style={styles.map} 
    ref={ map => {this.map = map }}
    region={this.state.region}
    onRegionChangeComplete={this.onRegionChange}
    rotateEnabled={false}
    loadingEnabled={true}
>
    {matches.map((marker, index) => {
            return (
                <MapMarker 
                    key={index}
                    mapMarker={marker}
                    handlePress={() => {
                        this.map.animateToRegion({
                            latitude: marker.location.latlng.latitude,
                            longitude: marker.location.latlng.longitude
                        }, 100)
                    }}
                />
            )
    })} 
</MapView>

MapMarker.js

render() {
        const { mapMarker } = this.props;

        return (
            <Marker
                ref={(ref) => {this.markerRef = ref; }}
                coordinate={mapMarker.location.latlng}
                title={mapMarker.location.streetName}
                stopPropagation={true}
                pointerEvents='auto'
                onPress={() => console.log('pressed')}
                onSelect={() => {
                    this.props.handlePress();
                }}
            >

                <CustomMapMarker 
                    gameType={mapMarker.matchType} 
                    isSanctioned={mapMarker.isSanctioned}
                    startDate={mapMarker.startAt}
                />

                <Callout style={styles.customCallout}>
                    <CustomMarkerCallout markerInfo={mapMarker} /> 
                </Callout>
            </Marker>
        );
    }

1 Ответ

0 голосов
/ 15 ноября 2019

Исправлена ​​проблема с добавлением onSelect, которая специфична для iOS. onPress работал только для Android, поэтому не знаю, правильный ли это ответ, но работает для меня на данный момент.

...