Popups in ArcGIS Runtime SDK for .NET

10661
20
02-09-2017 08:29 AM
MichaelStruk
New Contributor II

Hi

Are popups available in the ArcGIS Runtime SDK for .NET 100.0?

If popups are available, how we can use them?

Thank you

Tags (1)
0 Kudos
20 Replies
AnttiKajanus1
Occasional Contributor III

I was just writing a simple popup today so here is what I did.

        <esri:MapView x:Name="MyMapView">
            <esri:MapView.Overlays>
                <esri:OverlayItemsControl>
                    <Grid x:Name="popup" 
                          esri:MapView.ViewOverlayAnchor="{Binding Geometry}" 
                          IsHitTestVisible="False" HorizontalAlignment="Right" VerticalAlignment="Top" MaxWidth="200">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*" />
                            <RowDefinition Height="20" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="20" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <Border Background="#CC000000" BorderThickness="1,1,1,0" Margin="0,0,0,-1" BorderBrush="White" Grid.ColumnSpan="2">
                            <StackPanel Margin="20">
                                <TextBlock FontWeight="Bold" Foreground="White">
                                    <Run Text="ObjectId = "></Run>
                                    <Run Text="{Binding Attributes[objectid]}"></Run>
                                </TextBlock>
                            </StackPanel>
                        </Border>
                        <Path StrokeThickness="1" Fill="#CC000000" Stroke="White" Stretch="Fill" HorizontalAlignment="Left" Data="M0,0 L0,1 1,0" Grid.Row="1" />
                        <Path StrokeThickness="1" Fill="#CC000000" Stroke="White" Stretch="Fill" VerticalAlignment="Top" Data="M0,0 L1,0" Grid.Row="1" Grid.Column="1" />
                    </Grid>
                </esri:OverlayItemsControl>
            </esri:MapView.Overlays>
        </esri:MapView>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

And in your code you can do following

        private ArcGISFeature _selectedFeature;

        private async void OnGeoviewTapped(object sender, GeoViewInputEventArgs e)
        {
            try
            {
                // Clear all selected features
                foreach (var featureLayer in MyMapView.Map.OperationalLayers.OfType<FeatureLayer>())
                {
                    featureLayer.ClearSelection();
                }

                // Identify all features
                var results = await MyMapView.IdentifyLayersAsync(e.Position, 2, false, 1);
                if (results.Any())
                {
                    // Get first result and get feature and layer from it
                    var result = results.First();
                    var feature = result.GeoElements.First() as ArcGISFeature;
                    await feature.LoadAsync(); // Load feature to get all attributes
                    var layer = result.LayerContent as FeatureLayer;

                    // Check if we already have clicked this feature 
                    // if yes, then close popup
                    // if no, show the popup
                    var objectIdField = (layer.FeatureTable as ArcGISFeatureTable).ObjectIdField;
                    if (_selectedFeature?.Attributes[objectIdField]?.ToString() == 
                        feature.Attributes[objectIdField]?.ToString())
                    {
                        popup.Visibility = Visibility.Collapsed;
                        popup.DataContext = null;
                        _selectedFeature = null;
                    }
                    else
                    {
                        // Select feature
                        layer.SelectFeature(feature);
                        // Set selected feature to the popups datacontext
                        popup.DataContext = feature;
                        popup.Visibility = Visibility.Visible;
                        _selectedFeature = feature;
                    }
                }
                else
                {
                    popup.Visibility = Visibility.Collapsed;
                    popup.DataContext = null;
                }
             
            }
            catch (Exception ex)
            {
                MessageBox.Show("An error occurred. " + ex.ToString(), "Sample error");
            }
        }
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Note that the implementation might differ depending what you want to do. In my case I want to show a callout when clicking a feature isn't currently selected. If the feature is currently selected, then I want to hide the callout and if nothing is located where I click, I want to reset the map.

Marcelo_Cesar_AugustoTorres
New Contributor II

This example works with Xamarin.Forms???

0 Kudos
JimFiddes
Occasional Contributor

Was a solution for Xamarin ever identified for creating a control? The MapView on the droid side only has an Overlay property where the windows side has a Overlays property and it is specific to ESRI.

0 Kudos
JimFiddes
Occasional Contributor

Hey Antti

Any input on how to do this within Xamarin? I've implemented this idea within our UWP and am now attempting the droid side and not sure how to proceed.

0 Kudos
AnttiKajanus1
Occasional Contributor III

It seems that this got answered in https://community.esri.com/thread/197650-popups-in-xamarin-android topic. 

MarkBennett
Occasional Contributor

Nice, will give a try!  Thanks for sharing!

Ming

0 Kudos
KayugaSolution
New Contributor

Could you post the entire solution?  If you have it for WPF, that would be great. Thanks!

0 Kudos
dotMorten_esri
Esri Notable Contributor

It might be worth mentioning that with v100.1, we greatly simplified this common workflow. The above method is great if you want full control of every pixel that's presented. If not, try the new callout api:

            mapView.ShowCalloutAt(
                new MapPoint(0, 0, SpatialReferences.Wgs84),
                new UI.CalloutDefinition("Center of the world"));

0 Kudos
JoeHershman
MVP Regular Contributor

mnielsen-esristaff‌ the new callout behavior of having the callout move if it goes out of the visible area (which we were not able to do) is really nice.  Also not needing the whole SetAnchorPoint.  The problem I am having is that there is the white edge of the default Callout around our custom Popup UI.  I would like to use this because of the move behavior, but the outline makes it a no-go.  Any way to get rid of that, I don't see any properties that would take care of it?

Thanks

-Joe

Callout with custom UI

Thanks,
-Joe