Custom Google Maps marker info view on Xamarin.iOS - ios

The IMapViewDelegate apparently isn't a complete C# implementation of MapViewDelegate from objC. That inhibits the access to markerInfoContents delegate method.
I'd like to do something like this allowing me to custom the contentView layout and the tap action
got from: http://www.raywenderlich.com/81103/introduction-google-maps-ios-sdk-swift

I think i can explan its from scratch to add a Custom MarkerInfo Window on the Tap of a Marker. Iam using Xamarin.Google.iOS.Maps package from Official Nuget Library for adding Google Map on my Xamarin MVVM Cross Touch Project.
private void SetupMap()
{
if (_mapView != null)
_mapView.RemoveFromSuperview ();
//Init Map wiht Camera
var camera = new CameraPosition(new CLLocationCoordinate2D(36.069082, -94.155976), 15, 30, 0);
_mapView = MapView.FromCamera(RectangleF.Empty, camera);
_mapView.MyLocationEnabled = true;
//Add button to zoom to location
_mapView.Settings.MyLocationButton = true;
_mapView.MyLocationEnabled = true;
_mapView.Settings.SetAllGesturesEnabled(true);
var xamMarker = new Marker () {
Title = "Sample",
Snippet = "Sample Location",
Position = new CLLocationCoordinate2D (36.069082, -94.155976),
Map = _mapView
};
var xamMarker1 = new Marker () {
Title = "Sample1",
Snippet = "Sample Location2",
Position = new CLLocationCoordinate2D (35.069082, -94.155976),
Map = _mapView
};
_mapView.TappedMarker = (map, marker) => {
Console.WriteLine("Marker tapped:"+ map +"::"+marker);
_mapView.MarkerInfoWindow = new GMSInfoFor(markerInfoWindow);
return false;
};
_mapView.Frame = this.contentViewOutlet.Bounds;
this.contentViewOutlet.AddSubview (_mapView);
_mapView.InfoTapped += (object sender, GMSMarkerEventEventArgs e) => {
Console.WriteLine ("Marker Info tapped:"+e+"::"+sender);
UIAlertView alert = new UIAlertView () {
Title = "Alert", Message = sampleLongandLat
};
alert.AddButton("OK");
alert.Show ();
};
}
you can call this SetupMap() method from where ever you want. for example in ViewDidLoad or from any where you have to add the google map.
On click or Tap of the marker we are creating a custom marker window
_mapView.TappedMarker = (map, marker) => {
Console.WriteLine("Marker tapped:"+ map +"::"+marker);
_mapView.MarkerInfoWindow = new GMSInfoFor(markerInfoWindow);
return false;
};
the above code is included in the SetupMap method.
mapView.MarkerInfoWindow = new GMSInfoFor(markerInfoWindow); these above line of code will allow us to load a custom Marker Window instead of the default one
UIView markerInfoWindow(UIView view, Marker marker)
{
// use this method to return the custom view u have already created to load as a subview in Google Map as Custom Marker Info Windo
UIView v;
v = MarkerInfoView.Create(marker);
sampleLongandLat = MarkerInfoView.markerInfoString;
sampleLongandLat = MarkerInfoView.locationIDString;
return v;
}
for adding an custom UIView you can follow the example provided in the xamarin web site loading an xib or UIView in another ViewController as a sub view
_mapView.InfoTapped += (object sender, GMSMarkerEventEventArgs e) => {
Console.WriteLine ("Marker Info tapped:"+e+"::"+sender);
UIAlertView alert = new UIAlertView () {
Title = "Alert", Message = sampleLongandLat
};
alert.AddButton("OK");
alert.Show ();
};
the above code snippet you can use for detecting tap on the Marker Info Window

Related

iOS - Google Maps Places onclick conflicts with map onclick

I have a project created with ionic. In here I have a Google Map with a places search box.
I have included the Google Map library like so:
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=SOMEKEY&libraries=places" defer></script>
Now in my TypeScript code I have the following
// init the google map
initMap() {
var centerOfMap;
var draggableMarker = false;
this.mapHasBeenInitialized = true;
this.isStaticLocation = false;
centerOfMap = new google.maps.LatLng(this.locationService.gpsLat, this.locationService.gpsLong);
draggableMarker = true;
var options = {
center: centerOfMap,
zoom: 11,
fullscreenControl: false,
disableDefaultUI: true, // dont allow default zoom/sattelite/street view
gestureHandline: 'cooperative' // disable moving map with one finger
};
this.map = new google.maps.Map(this.googleMap.nativeElement, options);
this.marker = new google.maps.Marker({
position: centerOfMap,
map: this.map,
draggable: draggableMarker
});
if(!this.isStaticLocation) {
var searchBox = new google.maps.places.SearchBox(this.googleInput.nativeElement);
// add the searchbar to the google map
this.map.controls[google.maps.ControlPosition.TOP_LEFT].push(this.googleInput.nativeElement);
// Bias the SearchBox results towards current map's viewport
this.map.addListener('bounds-changed', () => {
searchBox.setBounds(this.map.getBounds());
});
searchBox.addListener('places_changed', () => {
var places = searchBox.getPlaces();
if(places.length == 0) {
return;
}
var bounds = new google.maps.LatLngBounds();
places.forEach(place => {
if(!place.geometry) {
console.log("returned place contains no geometry");
return;
}
this.setMarkerLocation(place);
if(place.geometry.viewport) {
bounds.union(place.geometry.viewport);
} else {
bounds.extends(place.geometry.location);
}
});
this.map.fitBounds(bounds);
});
}
if(draggableMarker) {
google.maps.event.addListener(this.marker, 'dragend', (event)=>{
this.getMarkerLocation();
});
}
google.maps.event.addListener(this.map, 'click', (event: any)=> {
var clickedLocation = event.latLng;
this.marker.setPosition(clickedLocation);
this.getMarkerLocation();
});
// neccessary for reload. Made async to trick loading process
setTimeout(()=> {
google.maps.event.trigger(this.googleMap.nativeElement, 'resize');
this.map.setCenter(centerOfMap);
}, 100);
}
// function to set the location marker on a different spot
setMarkerLocation(place: any) {
this.marker.setMap(null);
this.marker = new google.maps.Marker({
position: place.geometry.location,
map: this.map,
draggable: true
});
this.getMarkerLocation();
}
getMarkerLocation() {
var currLoc = this.marker.getPosition();
this.locationService.setGoogleMapsLocation(currLoc.lat(), currLoc.lng());
this.locationChanged = true;
}
And this code works like a charm in the browser and on Android. Basically what the code does is whenever someone taps on the map, the marker position changes to their tap location.
When a person searches for a Place, the places dropdown will show over the map. On android, when you tap a place in this dropdown, the marker will go to the selected place (f.e. australia).
On iOS however, the marker will position itself on the location where the person tapped and will totally ignore the tap on the place dropdown.
So when I'm in Europe and I type in 'Australia' and select 'Australia' from my dropdown, on Android I'll go to australia but on iOS I'll stay somewhere in Europe wherever the dropdown was positioned.

how to create small task bar in uitableviewcell ios xamarin

how to create small task bar (Reply, Copy, Forword and Delete) in uitableviewcell like whatsapp when the message on press?
"UIMenuController" with "menuItems:" will be useful for your custom Actions.
Apple Documentation Link : https://developer.apple.com/reference/uikit/uimenucontroller
thank Ios Developer for your direction.. i already use "UIMenuController", but this menu is not shown.
my code:
[Export("LongPressMethod:")]
public void LongPressMethod(UILongPressGestureRecognizer gestureRecognizer)
{
if (gestureRecognizer.State == UIGestureRecognizerState.Began)
{
var menuController = UIMenuController.SharedMenuController;
var copyMenuItem = new UIMenuItem("copy", new ObjCRuntime.Selector("CopyRow"));
var pasteMenuItem = new UIMenuItem("paste", new ObjCRuntime.Selector("PasteRow"));
var location = gestureRecognizer.LocationInView(bc);
bc.BecomeFirstResponder();
menuController.MenuItems = new[] { copyMenuItem, pasteMenuItem };
menuController.SetTargetRect(new CGRect(location.X, location.Y, 100, 100), bc);
menuController.SetMenuVisible(true, true);
}
}
[Export("CopyRow:")]
void Row(UIMenuController controller)
{
// do something
}
[Export("PasteRow:")]
void PasteRow(UIMenuController controller)
{
// do something
}

Windows 10 Universal App custom map

I want to create an app for airplane navigation. Since for pilots the Bing maps are useless I need to create my own map a texture of an aeronautical map.
I couldn't find any clue how to start on this. Is there an SDK for Bing maps where I can create my own texture/overlay?
Do I need to start from rock bottom and create a picture and change its position so the relevant part is in the visible area of the device?
I need the following features:
Show current position on the map.
Add some custom POIs via coordinates
After quite some research I figured it out myself.
Here is most of the code needed if you have the same scenario
Uri format:
"https://webserver/tiles/{zoomlevel}/{x}/{y}.png";
private void InitMap()
{
_gps = new Geolocator();
pointBuffer = cologne;
image = RandomAccessStreamReference.CreateFromUri(new Uri("ms-appx:///Assets/images/airplane.png"));
MyMap.Style = MapStyle.None;
//Setup Icao Layer
_icaoTileSource = new MapTileSource();
var _tileLayer = new HttpMapTileDataSource();
_tileLayer.UriFormatString = IcaoUri;
_icaoTileSource.DataSource = _tileLayer;
MyMap.TileSources.Add(_icaoTileSource);
//Setup VFR Layer
_vfrTileSource = new MapTileSource();
var _vfrtileLayer = new HttpMapTileDataSource();
_vfrtileLayer.UriFormatString = VfrUri;
_vfrTileSource.DataSource = _vfrtileLayer;
//Setup Low Level Layer
_lowlvlTileSource = new MapTileSource();
var _lowlvltileLayer = new HttpMapTileDataSource();
_lowlvltileLayer.UriFormatString = LowLvlUri;
_lowlvlTileSource.DataSource = _lowlvltileLayer;
airplane = new MapIcon()
{
Title = "My Position",
Image = image,
Visible = true,
Location = cologne,
NormalizedAnchorPoint = new Point(0.5, 0.5)
};
_tileLayer.AllowCaching = true;
MyMap.MapElements.Add(airplane);
systemSetCenter = true;
MyMap.Center = cologne;
MyMap.ZoomLevel = 10;
_vm.ZoomLevel = MyMap.ZoomLevel;
MyMap.ZoomLevelChanged += (s, e) =>
{
if(s.ZoomLevel > maxZoomLevel)
{
s.ZoomLevel = maxZoomLevel;
}
_vm.ZoomLevel = s.ZoomLevel;
};
}

C# VS WP8 Linking a created tile to a Uri Scheme

First i create a tile with this code:
private void btnIconicTile_Click(object sender, RoutedEventArgs e)
{
IconicTileData oIcontile = new IconicTileData();
oIcontile.Title = "Hello Iconic Tile!!";
oIcontile.Count = 7;
oIcontile.IconImage = new Uri("Assets/Tiles/Iconic/202x202.png", UriKind.Relative);
oIcontile.SmallIconImage = new Uri("Assets/Tiles/Iconic/110x110.png", UriKind.Relative);
oIcontile.WideContent1 = "windows phone 8 Live tile";
oIcontile.WideContent2 = "Icon tile";
oIcontile.WideContent3 = "All about Live tiles By WmDev";
oIcontile.BackgroundColor = System.Windows.Media.Colors.Black;
// find the tile object for the application tile that using "Iconic" contains string in it.
ShellTile TileToFind = ShellTile.ActiveTiles.FirstOrDefault(x => x.NavigationUri.ToString().Contains("Iconic".ToString()));
if (TileToFind != null && TileToFind.NavigationUri.ToString().Contains("Iconic"))
{
TileToFind.Delete();
ShellTile.Create(new Uri("/MainPage.xaml?id=Iconic", UriKind.Relative), oIcontile, true);
}
else
{
ShellTile.Create(new Uri("/MainPage.xaml?id=Iconic", UriKind.Relative), oIcontile, true);//
}
}
Now i want that the created tile in the homescreen links to an app (Uri Scheme?) like this on for ex:
await Windows.System.Launcher.LaunchUriAsync(new System.Uri("whatsapp:"));
How i can modify the "link" of that recently created tile?
Yes i need too.
Windows.System.Launcher.LaunchUriAsync(new System.Uri("whatsapp:"))
homescreen

MonoTouch, ZXing: Redirect to another ViewController after scan

I'm using the ZXing MobileScanner lib with my xamarin project for iOS (MonoTouch).
I set up the scanning, it is working fine, reading my QRCode and having the correct result.
After reading the QRCode I want to show another ViewController. I set a property in the second Controller with the result from scanning and then want to show the controller.
The second view is not shown on screen. No errors, no feedback, simply not shown.
I guess, the MobileScanner builds up its own View (which can be seen in the source of the lib) and adds this to the NavigationController - and that this causes my Controller to stay "behind". Testing with simply redirecting to my controller on button clicks is working fine.
I also tried to "dispose" the view by calling scanner.Cancel(), but this results in
Warning: Attempt to dismiss from view controller <UINavigationController: 0x19a0c60> while a presentation or dismiss is in progress!
Here is my code, any help on how to display my view is appreciated.
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
// Perform any additional setup after loading the view, typically from a nib.
scanner = new MobileBarcodeScanner(this.NavigationController);
this.btnScan.TouchUpInside += (sender, e) => {
//Tell our scanner to use the default overlay
scanner.UseCustomOverlay = false;
//We can customize the top and bottom text of the default overlay
scanner.TopText = "Ticket vor den Scanner halten";
scanner.BottomText = "Code wird automatisch eingelesen";
//Start scanning
scanner.Scan ().ContinueWith((t) =>
{
//Our scanning finished callback
if (t.Status == System.Threading.Tasks.TaskStatus.RanToCompletion){
string msg = "";
ZXing.Result result = t.Result;
if (result != null && !string.IsNullOrEmpty (result.Text)) {
scanner.Cancel();
if(this.ticketScreen == null) {
this.ticketScreen = new TicketScreen();
}
this.ticketScreen.ticketUrl = result.Text;
this.NavigationController.PushViewController(this.ticketScreen, true);
} else {
msg = "Code nicht erkannt!";
this.InvokeOnMainThread(() => {
var av = new UIAlertView("Fehler!", msg, null, "OK", null);
av.Show();
});
}
}
});
};
}
I use this.InvokeOnMainThread(() and it works fine in my code.
The solution for you is:
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
// Perform any additional setup after loading the view, typically from a nib.
scanner = new MobileBarcodeScanner(this.NavigationController);
this.btnScan.TouchUpInside += (sender, e) => {
//Tell our scanner to use the default overlay
scanner.UseCustomOverlay = false;
//We can customize the top and bottom text of the default overlay
scanner.TopText = "Ticket vor den Scanner halten";
scanner.BottomText = "Code wird automatisch eingelesen";
//Start scanning
scanner.Scan ().ContinueWith((t) =>
{
//Our scanning finished callback
if (t.Status == System.Threading.Tasks.TaskStatus.RanToCompletion){
string msg = "";
ZXing.Result result = t.Result;
if (result != null && !string.IsNullOrEmpty (result.Text)) {
scanner.Cancel();
this.InvokeOnMainThread(() =>
{
if(this.ticketScreen == null) {
this.ticketScreen = new TicketScreen();
}
this.ticketScreen.ticketUrl = result.Text;
this.NavigationController.PushViewController(this.ticketScreen, true);
});
} else {
msg = "Code nicht erkannt!";
this.InvokeOnMainThread(() => {
var av = new UIAlertView("Fehler!", msg, null, "OK", null);
av.Show();
});
}
}
});
};
}

Resources