google-maps-sdk-ios - markerInfoWindow デリゲート メソッドによって返されるビューにボタンを追加します。

Question

現在、delegate を self に設定し、次のコードを使用して、google maps ios SDK でカスタム ビューを作成して返しています。

#pragma mark - GMSMapViewDelegate
-(UIView*)mapView:(GMSMapView *)mapView markerInfoWindow:(id<GMSMarker>)marker {
    int popupWidth = 200;
    int contentWidth = 180;
    int contentPad = 10;
    int popupHeight = 140;
    int popupBottomPadding = 16;
    int popupContentHeight = popupHeight - popupBottomPadding;
    int buttonHeight = 30;

    UIView *outerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, popupWidth, popupHeight)];

    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, popupWidth, popupContentHeight)];
    [view setBackgroundColor:[UIColor whiteColor]];

    UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(contentPad, 0, contentWidth, 22)];
    [titleLabel setFont:[UIFont systemFontOfSize:17.0]];
    titleLabel.text = [marker title];

    UILabel *descriptionLabel = [[UILabel alloc] initWithFrame:CGRectMake(contentPad, 24, contentWidth, 20)];
    [descriptionLabel setFont:[UIFont systemFontOfSize:11.0]];
    descriptionLabel.text = [marker snippet];

    [view addSubview:titleLabel];
    [view addSubview:descriptionLabel];

    UIButton *directionButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    directionButton.frame = CGRectMake(contentPad, 45, contentWidth, buttonHeight);
    [directionButton setTitle:@"Directions" forState:UIControlStateNormal];
    [directionButton addTarget:self action:@selector(directionsPressed) forControlEvents:UIControlEventTouchDown];

    UIButton *viewLocationButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    [viewLocationButton addTarget:self action:@selector(viewLocationPressed) forControlEvents:UIControlEventTouchUpInside];
    [viewLocationButton setTitle:@"View Location" forState:UIControlStateNormal];
    viewLocationButton.frame = CGRectMake(contentPad, 80, contentWidth, buttonHeight);

    // handle bottom dealio
    UIImage *bottomImage = [UIImage imageNamed:@"map-pointer-bottom"];
    UIImageView *bottomView = [[UIImageView alloc] initWithFrame:CGRectMake((popupWidth / 2) - (bottomImage.size.width / 2), (popupContentHeight), bottomImage.size.width, bottomImage.size.height)];
    [bottomView setImage:bottomImage];

    [outerView addSubview:view];
    [outerView addSubview:bottomView];
    [outerView addSubview:directionButton];
    [outerView addSubview:viewLocationButton];

    ListItem *li = (ListItem*)[marker userData];
    self.currentItem = li;
    NSLog(@"List Item %@ - %@", li.type, li.typeid);

    return outerView;
}

-(void)directionsPressed {
    NSLog(@"Directions Pressed");
}

-(void)viewLocationPressed {
    NSLog(@"Location View Pressed");
}

- (void)mapView:(GMSMapView *)mapView didTapInfoWindowOfMarker:(id<GMSMarker>)marker {
    NSLog(@"Tap Captured");
}

カスタム ビューをタップすると didTapWindowOfMarker が起動されますが、ボタンのターゲット メソッドはどちらも起動されません。

これがなぜなのかについてのアイデアはありますか？

Answer 1

おそらく、Google Maps Android API のドキュメントで公式に述べられているように、情報ウィンドウに関する以下の制限は、Google Maps iOS SDK にも適用されます。

情報ウィンドウはライブ ビューではなく、ビューはマップ上に画像としてレンダリングされます。その結果、ビューに設定したリスナーは無視され、ビューのさまざまな部分のクリック イベントを区別できなくなります。ボタン、チェックボックス、テキスト入力などのインタラクティブなコンポーネントをカスタム情報ウィンドウ内に配置しないことをお勧めします。

したがって、基本的に情報ウィンドウの任意の部分をクリックすると、「didTapWindowOfMarker」のみがトリガーされます

Answer 2

Swift 3.0 ソリューション

 //empty the default infowindow
        func mapView(_ mapView: GMSMapView, markerInfoWindow marker: GMSMarker) -> UIView? {
            return UIView()
        }

        // reset custom infowindow whenever marker is tapped
        func mapView(_ mapView: GMSMapView, didTap marker: GMSMarker) -> Bool {

            customInfoView.removeFromSuperview()
        //    customInfoView.button.addTarget(self, action: #selector(buttonTapped(_:)), for: .touchUpInside)
            self.view.addSubview(customInfoView)

            // Remember to return false
            // so marker event is still handled by delegate
            return false
        }

        // let the custom infowindow follows the camera
        func mapView(_ mapView: GMSMapView, didChange position: GMSCameraPosition) {
            if (locationMarker != nil){
                let location = locationMarker.position
                customInfoView.center = mapView.projection.point(for: location)
            }
        }

        // take care of the close event
        func mapView(_ mapView: GMSMapView, didTapAt coordinate: CLLocationCoordinate2D) {
            customInfoView.removeFromSuperview()
        }

そして、mapViewを持つ同じコントローラーでこのビュー（customInfoWindow）のアウトレットを作成します。

この開発者のカスタムでインタラクティブな googlemaps(IOS SDK) infowindowのおかげで、このリンクからアイデアを得ました。

Answer 3

UView があり、デリゲートをビューに追加して、UIButton がセレクターを呼び出すようにしています。Google マップの場合、電話しても何もしません

- (void) mapView:(GMSMapView *)mapView didTapInfoWindowOfMarker:(GMSMarker *)marker;

ただし、infowindow (カスタム ビュー) デリゲートを自分自身に設定し、セレクターにリンクされているボタンを押すと、すべてのアクションを呼び出します。

Answer 4

アップデート：

これは、infoWindows に追加されたボタンのタップを検出するために使用するコードです。2 つの偽のボタン (アクションをトリガーしないため、実際には画像に置き換えることができます) を持つカスタム infoWindow を作成し、infoWindow の上に 2 つの本物のボタンを持つ完全に透明なオーバーレイを追加します。これらのボタンは、アクションをトリガーします。

また、infoWindow 自体が移動されたときにオーバーレイを移動するために、いくつかのデリゲート メソッドまたは KVC を使用します。

- (UIView *)mapView:(GMSMapView *)mapView markerInfoWindow:(GMSMarker *)marker {
    [self.actionOverlayCalloutView removeFromSuperview];
    UIView *calloutView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, infoWindowWidth, infoWindowHeight)];

    float offset = anchorSize * M_SQRT2;
    CGAffineTransform rotateBy45Degrees = CGAffineTransformMakeRotation(M_PI_4);
    UIView *arrow = [[UIView alloc] initWithFrame:CGRectMake((infoWindowWidth - anchorSize)/2.0, infoWindowHeight - offset, anchorSize, anchorSize)];
    arrow.transform = rotateBy45Degrees;
    arrow.backgroundColor = [UIColor lightGrayColor];
    [calloutView addSubview:arrow];

    UIView *contentView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, infoWindowWidth, infoWindowHeight - offset/2)];
    [contentView setBackgroundColor:[UIColor whiteColor]];

    contentView.layer.cornerRadius = 5;
    contentView.layer.masksToBounds = YES;

    contentView.layer.borderColor = [UIColor lightGrayColor].CGColor;
    contentView.layer.borderWidth = 1.0f;

    self.actionOverlayCalloutView =
    [NSKeyedUnarchiver unarchiveObjectWithData:[NSKeyedArchiver archivedDataWithRootObject:contentView]]; //hack to copy a view...
    self.actionOverlayCalloutView.backgroundColor = [UIColor lightGrayColorWithAlpha:0.5];
    self.actionOverlayCalloutView.layer.cornerRadius = 5;
    NSMutableArray *falseButtons = [NSMutableArray array];
    NSMutableArray *actionButtons = [NSMutableArray array];
    PointMapItem *pointAnnotation = marker.userData;
    if ([pointAnnotation canPerformSend]) {
        UIButton *button = [[UIButton alloc] init];
        [button setImage:[UIImage imageNamed:@"imageButton1.png"] forState:UIControlStateNormal];
        [falseButtons addObject:button];
        UIButton *activableButton = [[UIButton alloc] init];
        [activableButton addTarget:self action:@selector(onButton1Clicked) forControlEvents:UIControlEventTouchUpInside];
        [actionButtons addObject:activableButton];
    }
    if ([pointAnnotation canPerformShowDetails]) {
        UIButton *button = [[UIButton alloc] init];
        [button setImage:[UIImage imageNamed:@"imageButton1.png"] forState:UIControlStateNormal];
        [falseButtons addObject:button];
        UIButton *activableButton = [[UIButton alloc] init];
        [activableButton addTarget:self action:@selector(onButton2Clicked) forControlEvents:UIControlEventTouchUpInside];
        [actionButtons addObject:activableButton];
    }
    int buttonWidth = contentView.frame.size.width / [falseButtons count];
    int currentOffset = 0;
    for (int i=0; i<falseButtons.count; i++) {
        UIButton *falseButton = [falseButtons objectAtIndex:i];
        UIButton *activableButton = [actionButtons objectAtIndex:i];
        [falseButton setFrame:CGRectMake(currentOffset, 0, buttonWidth, contentView.frame.size.height)];
        currentOffset += buttonWidth;
        activableButton.frame = falseButton.frame;
        [activableButton setTitle:@"" forState:UIControlStateNormal];
        [self.actionOverlayCalloutView addSubview:activableButton];
        [contentView addSubview:falseButton];
    }
    [calloutView addSubview:contentView];

    CLLocationCoordinate2D anchor = [self.mapView.selectedMarker position];
    CGPoint point = [self.mapView.projection pointForCoordinate:anchor];
    point.y -= self.mapView.selectedMarker.icon.size.height + offset/2 + (infoWindowHeight - offset/2)/2;
    self.actionOverlayCalloutView.center = point;

    [self.mapView addSubview:self.actionOverlayCalloutView];
    return calloutView;
}

- (void)mapView:(GMSMapView *)pMapView didChangeCameraPosition:(GMSCameraPosition *)position {
    if (pMapView.selectedMarker != nil && self.actionOverlayCalloutView.superview) {
        CLLocationCoordinate2D anchor = [self.mapView.selectedMarker position];
        CGPoint point = [self.mapView.projection pointForCoordinate:anchor];
        float offset = anchorSize * M_SQRT2;
        point.y -= self.mapView.selectedMarker.icon.size.height + offset/2 + (infoWindowHeight - offset/2)/2;
        self.actionOverlayCalloutView.center = point;
    } else {
        [self.actionOverlayCalloutView removeFromSuperview];
    }
}

- (void)mapView:(GMSMapView *)mapView didTapAtCoordinate:(CLLocationCoordinate2D)coordinate {
    [self.actionOverlayCalloutView removeFromSuperview];
}

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context {
    if ([keyPath isEqualToString:@"mapView.selectedMarker"]) {
        if (!self.mapView.selectedMarker) {
            [self.actionOverlayCalloutView removeFromSuperview];
        }
    }
}

- (void)onButton2Clicked {
    //your code
    self.mapView.selectedMarker = nil;
}

- (void)onButton1Clicked {
    // your code;
    self.mapView.selectedMarker = nil;
}

以前の投稿:

このスレッド、特に #9 をご覧ください。参考になるはずです https://code.google.com/p/gmaps-api-issues/issues/detail?id=4961