Show panel on top of map in Android bug

Bug Reports
1

Hi

I have several problems when displaying a panel on top of a map in Android (working ok in iOS + local)

I guess it’s something related to the GraphicsView as when i remove it more or less it works :slight_smile:

here you have a sample minimal code that is not working (i have other samples where the map freezes when the popup is shown)

code:

   <App>
	<JavaScript>

		var Observable 	= require("FuseJS/Observable");

		var uxMapPageMapMarkers = Observable();
		var uxMapPageLat = Observable(40.9908991);
		var uxMapPageLng = Observable(0.9236690999999837);
		var uxMapPageZoom = Observable(12);
		var inPanelVisibility = Observable();

		var itemList = Observable();


		mapMarkers = new Array();

		mapMarkers.push({
			name: "my place",
			lat: 40.9908991,
			lng: 0.9236690999999837
		});

		uxMapPageMapMarkers.replaceAll(mapMarkers);

		function myFunction() {
			inPanelVisibility.value = "Visible";


			itemList.clear();
			itemList.add(new CustomSquare());
		}

		function uxMapOnMapMarkerTapped(args) {
			inPanelVisibility.value = "Visible";
		}

		function CustomSquare() {
			this.value = 1
		}

		module.exports = {

    		uxMapPageMapMarkers: uxMapPageMapMarkers,
    		uxMapOnMapMarkerTapped: uxMapOnMapMarkerTapped,

    		uxMapPageZoom: uxMapPageZoom,

    		uxMapPageLat: 				uxMapPageLat,
    		uxMapPageLng: 				uxMapPageLng,
    		inPanelVisibility: inPanelVisibility,

    		myFunction: myFunction,


			itemList: itemList
		}


	</JavaScript>

	<Panel>

		<DockPanel>

			<Panel Dock="Top" Background="#ff0000" Height="80" HitTestMode="LocalVisualAndChildren">
				<Clicked>
					<Callback Handler="{myFunction}"/>
				</Clicked>

			</Panel>

			<Panel Background="#00ff00">
				<NativeViewHost ux:Name="NativeView">
					
					<Panel ux:Name="inPanel" Visibility="Collapsed">
                		<GraphicsView>
							<Panel  Background="#00ff00" Height="300" HitTestMode="LocalVisualAndChildren" Alignment="VerticalCenter">

								<!--Each Items="{itemList}">
									<CustomSquare/>
								</Each-->

								<Clicked>
									<Set inPanel.Visibility="Collapsed"/>
								</Clicked>
							</Panel>
							<DataBinding Target="inPanel.Visibility" Key="inPanelVisibility" />

						
						</GraphicsView>
					</Panel>

	            	<MapView Latitude="{uxMapPageLat}" Longitude="{uxMapPageLng}" ShowMyLocation="true" Zoom="{uxMapPageZoom}" MarkerTapped="{uxMapOnMapMarkerTapped}" ShowMyLocationButton="true"> 
	                	<Each Items="{uxMapPageMapMarkers}">
	                    	<MapMarker Latitude="{lat}" Longitude="{lng}" Label="{name}"/> 
	                	</Each>
	            	</MapView>
	        	</NativeViewHost>
			</Panel>

		</DockPanel>

		<Panel ux:Class="CustomSquare" Height="50%" Background="#0000ff">
		</Panel>

	</Panel>
</App>

Fuse version: 1.8.1
Mac OS
Android (both 6.0.1. and 7.0)