Unable to create Google Maps custom infoWindow on iOS
This code works on Android to create a custom infoWindow using the @nativescript/google-maps plugin:
export function onMarkerInfoWindow(args) {
const marker = args.marker;
const info = new StackLayout();
info.width = 200;
info.height = 100;
info.backgroundColor = 'white';
const text = new Label();
text.text = marker.title;
info.addChild(text);
args.view = info;
}
On iOS, however, the default infoWindow is displayed.
Here's the code in index.ios.ts that raises the MarkerInfoWindow event.
The problem is that event.view.ios is null, and that causes the default infoWindow to be used. The native view needs to be created for the Stackayout returned by onMarkerInfoWindow.
This issue is also discussed in this Discord thread.
I have created a GitHub repo to demo the problem. I modified the code here to catch the markerInfoContents event rather than markerInfoWindow, as this retains the pointer at the bottom of the infoWindow.
Using the new 1.7.1 version of @nativescript/google-maps, I can now at least see a small infoWindow on iOS, but it contains no data. See the screen shots, below...
Fixed in @nativescript/google-maps 1.7.5