Select to view content in your preferred language

Find and Formatting

2213
25
01-06-2011 11:18 AM
JayKappy
Frequent Contributor
I am trying to format a window after I run the FIND example from the API examples

http://help.arcgis.com/en/webapi/silverlight/samples/start.htm#Find

I have this working but I do not want a grid/scrollviewer to display my results...I want to display them in a more meaningful fashion...

ex
PID: field value
Address: field value

PID: field value
Address: field value

PID: field value
Address: field value

How can I do this...I am doign this but only for the Identify and that is only one record showing...
I cant figure out how to do this in respect to the FIND example and outside a grid...

Any thoughts....

Thanks
0 Kudos
25 Replies
DominiqueBroux
Esri Frequent Contributor
Instead of using a DataGrid you can use any ItemsControl.

Example with a basic ItemsControl:

<ItemsControl x:Name="MyItemsControls">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,10">
<TextBlock Text="{Binding Feature.Attributes[PID], StringFormat='PID: \{0\}'}" />
<TextBlock Text="{Binding Feature.Attributes[ADDRESS], StringFormat='Address: \{0\}'}" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
And you need to bind by code the ItemsSource property of your ItemsControl:
 
// Bind data grid to find results. Bind to the LastResult property which returns a list
// of FindResult instances. When LastResult is updated, the ItemsSource property on the 
// will update. 
Binding resultFeaturesBinding = new Binding("LastResult");
resultFeaturesBinding.Source = findTask;
MyItemsControls.SetBinding(ItemsControl.ItemsSourceProperty, resultFeaturesBinding);


Hope this help.
0 Kudos
JayKappy
Frequent Contributor
Thanks a ton man...worked great....Although I have some cleaning up to do to make a nicer looking results window....

One last question...I hope that you can stear me in the right direction...I would like to expand that one more level...
When the user hovers over that result in the window I want the feature in the map to highlight and visa versa.....hover over the feature in the map and the record in the window highlight...the later not that important

Can this be done with an ItemsControl?

In a datagrid you can do this I think
        <Grid Grid.Row="4">
            <esri:FeatureDataGrid x:Name="MyDataGrid" 
            Map="{Binding ElementName=MyMap}"
 GraphicsLayer="{Binding ElementName=MyMap, Path=Layers.[California]}" />
        </Grid>


Wondering If I can format the text adn results like in the Items Control to accomplish this instead of the Grid Format????

Thanks
0 Kudos
DominiqueBroux
Esri Frequent Contributor
The sample you pointed out is using a standard DataGrid not a FeatureDataGrid : On 'SelectionChanged' event, a graphic is created and is highlighted on the map.
You can reuse the same idea with the event MouseEnter of an ItemsControl or with the event SelectionChanged of a ListBox control.
0 Kudos
JayKappy
Frequent Contributor
That sort of makes sense to me....this is where I am right now....I was pointed inthe direction of an "ItemsControl" to format the results of the query...

Not sure which method would be suitable for me....

If I use teh MouseEnter on the ItemsControl as seen below in Red. I dont thin that is differs which record is selected? Does it? I set it up to simply unhide a window and it worked....when I went over teh records it open the window....

but now triyng to figure out if it will actually determine which record I am over? And then highlight that record...


                            <Grid Grid.Column="6" >
                                    <StackPanel Orientation="Vertical" Margin="5" HorizontalAlignment="left" VerticalAlignment="top" >
                                        <Grid x:Name="IdentifyGrid7" HorizontalAlignment="left" VerticalAlignment="Top" Margin="0,2,0,0" MouseEnter="TurnOnIncidents">
                                            <Rectangle Fill="#CC5C90B2" Stroke="Gray"  RadiusX="10" RadiusY="10" Margin="0,0,0,0" >
                                                <Rectangle.Effect>
                                                    <DropShadowEffect/>
                                                </Rectangle.Effect>
                                            </Rectangle>
                                            <TextBlock x:Name="DataDisplayTitleTop7" HorizontalAlignment="Center" Text="Items Control Search PID" Foreground="White" FontSize="10" 
                                                    Margin="0,10,0,0" />
                                            <StackPanel Margin="10,27,0,0"  Orientation="Vertical" VerticalAlignment="Top" >
                                                <StackPanel Orientation="Horizontal">
                                                    <TextBlock x:Name="DataDisplayTitleTop8" HorizontalAlignment="Left" Text="Phone:      " Foreground="White" FontSize="10" 
                                                            Margin="0,0,0,0" />
                                                    <TextBlock x:Name="DataDisplayTitleTop9" HorizontalAlignment="Left" Text="763.555.5555" Foreground="White" 
                                                            Margin="0,0,0,0" >
                                                          <TextBlock.Effect>
                                                               <DropShadowEffect/>
                                                          </TextBlock.Effect>
                                                    </TextBlock>                                                        
                                                </StackPanel>
                                            </StackPanel>     
                                            <StackPanel x:Name="IdentifyResultsPanel7" Height="125" Width="250" Orientation="Vertical" Margin="0,85,0,0" HorizontalAlignment="Center"> 
                                                <ScrollViewer VerticalScrollBarVisibility="Auto"  Width="225" MaxHeight="200"  >
                                                                <ItemsControl x:Name="MyItemsControls" MouseEnter="EnterItemsControl" >
                                                                <ItemsControl.ItemTemplate>
                                                                    <DataTemplate>
                                                                        <StackPanel Orientation="Horizontal" VerticalAlignment="Center" >
                                                                            <StackPanel Margin="1">
                                                                                <TextBlock Text="{Binding Feature.Attributes[HOUSE_NUMB]}" Foreground="White" FontSize="10" />
                                                                            </StackPanel>
                                                                            <StackPanel Margin="5,0,0,0" Orientation="Vertical">
                                                                                <TextBlock Foreground="White" Text="{Binding Feature.Attributes[PID], StringFormat='PID: \{0\}'}" >
                                                                                    <TextBlock.Effect>
                                                                                        <DropShadowEffect/>
                                                                                    </TextBlock.Effect>
                                                                                </TextBlock>
                                                                                <TextBlock Foreground="White" Text="{Binding Feature.Attributes[ADDRESS], StringFormat='Address: \{0\}'}"  >
                                                                                    <TextBlock.Effect>
                                                                                        <DropShadowEffect/>
                                                                                    </TextBlock.Effect>
                                                                                </TextBlock>
                                                                            </StackPanel>
                                                                        </StackPanel>
                                                                    </DataTemplate>
                                                                </ItemsControl.ItemTemplate>
                                                                </ItemsControl>                                                
                                                    </ScrollViewer>
                                            </StackPanel> 
                                        </Grid>
                                    </StackPanel>

                             </Grid>



    Private Sub EnterItemsControl(ByVal sender As Object, ByVal e As MouseEventArgs)
        ShowTimePanel.Begin()
    End Sub
0 Kudos
JayKappy
Frequent Contributor
I am trying something like this for the MouseEnter

Having issues with the stuff in red below.....Am I on the right path here?

1. Value of type 'System.Windows.DependancyProperty cannot be converted to integer
trying to find soem kind of index from the ItemsControl
2. Selected Item not a member of System.Windows.Control.ItemsControl

I can see how you could grab the selected index of the dataGrid, but cant seem to find what to grab for the ItemsControl?????
I think the rest of the code will work....

really appreciate all your patience and help...very appreciated...


    Private Sub EnterItemsControl(ByVal sender As Object, ByVal e As MouseEventArgs)

        ' Highlight the graphic feature associated with the selected row
        Dim ItemControlGrid As ItemsControl = TryCast(sender, ItemsControl)

        Dim selectedIndex As Integer = ItemsControl.TabIndexProperty       
            If selectedIndex > -1 Then

            Dim findResult As FindResult = CType(MyItemsControls.SelectedItem, FindResult)            
             Dim graphic As Graphic = findResult.Feature

            Select Case graphic.Attributes("Shape").ToString()
                Case "Polygon"
                    graphic.Symbol = TryCast(LayoutRoot.Resources("DefaultFillSymbol"), Symbol)
                Case "Polyline"
                    graphic.Symbol = TryCast(LayoutRoot.Resources("DefaultLineSymbol"), Symbol)
                Case "Point"
                    graphic.Symbol = TryCast(LayoutRoot.Resources("DefaultMarkerSymbol"), Symbol)
            End Select

            Dim graphicsLayer As GraphicsLayer = TryCast(MyMap.Layers("MyGraphicsLayerParcelHighlight"), GraphicsLayer)
            graphicsLayer.ClearGraphics()
            graphicsLayer.Graphics.Add(graphic)

        End If

    End Sub

0 Kudos
dotMorten_esri
Esri Notable Contributor
The best way to highlight features on the map is to define a selection state in the symbol template, and simply "select" the feature when you hover on it in the list. ie. myGraphic.Selected = true;
This sample has an example of such a custom symbol:
http://help.arcgis.com/en/webapi/silverlight/samples/start.htm#CustomSymbols
Click the blue square in the pacific to flip its selection state on and off. You can define any type of storyboard on the symbol template that should play back when the feature gets selected (the other marker symbols in the sample uses the MouseOver state to trigger similar animations, but they could just as well have been selection states).

Here's a sample app that uses an approach very similar to what you are asking for:
http://serverapps.esri.com/silverlightdemos/spatialflickr.web/
Hit the 'flickr' button in the top left. When the result returns, hover on any feature in the list, and you will see it highlight on the map. This is all done using the selection state.
0 Kudos
JayKappy
Frequent Contributor
So are you saying that I should have used a List instead of a ItemControl?

I am really confused here...I do appreciate the help....
0 Kudos
JayKappy
Frequent Contributor
yea this is what I am after...It loads all the features as a graphic, populates the listbox and allows the user to hover over a result in the listbox and highlight the featuer in the map...

I am gettign really confused with all the extra CS pages and the jumping around...
I tried to Bind the SourceProperty like I did with the Items control with no success....

I am having a hard time trying to figure out how to take all the Features from a Layer and place them in the listbox. AND I KNOW that its right in front of my eyes...BEING Green is never easy...I have a button that does a query on Parcels Layer and returns the results into a results window....While this is taking place I want to populate all the features from another layer into a different listbox/ItemControl etc.  Say police stations. 

I see in that example you gave me they are doing this...with a bunch of extra seperate CS pages????  I am not sure what they are doing...something with flicker and filtering out the results....
I know there has to be a simpler way to simply populate a listbox with all the records from a Layer, and format them into soemthing like this

PID: Field Value
Address: Field Value

PID: Field Value
Address: Field Value

PID: Field Value
Address: Field Value

imageList.ItemsSource = result.Photos.Photo;
0 Kudos
JayKappy
Frequent Contributor
......................................................
0 Kudos