Changing Styles

Mar 4, 2012 at 2:58 PM

The documentation suggest you can change what the visual elements look like (I'm assuming that means the ARItems). I can't seem to figure out how to do this beyond changing Style of the ARDisplay, and that doesn't seem to really have any options anyway. Some tips would be great!

Mar 5, 2012 at 8:02 PM

The way an ARItem is displayed depends on the layer it's displayed on. For example, OverheadMap and WorldView by default just display text. This can be changed by creating a DataTemplate that displays what you want and then telling the view to use that template. Creating a DataTemplate is outside the scope of what I'll be able to provide here, but it's pretty simple. You just create a <DataTemplate> tag and inside of it you put child controls and bind them to the properties of ARItem that you want to show. The BingAR sample included with GART does this. look inside of MainPage.xaml for the following line:

<DataTemplate x:Key


You'll see the rest of the template defined under that.

Once the DataTemplate is defined you need to tell the view to use it. That's really easy with WorldView because it has a dedicated property called ItemTemplate. With OverheadMap it's a little more difficult because the DataTemplate has to be assigned to a layer. The controls default style does this for you automatically (inside of Generic.xaml) but it's not easily discovered. By default the layer binds to a DataTemplate with the key MapShape. So, if you create a DataTemplate in your project and give it the key MapShape then your customized template should show up on the map.

<DataTemplate x:Key="MapShape">...

We could add an ItemTemplate property to the OverheadMap like there is on WorldView. The reason I didn't add it originally was because I thought someone might want different kinds of items to show up on different layers. But that doesn't quite work out since there's only one collection of items. For that we really need DataTemplateSelector which doesn't exist in Silverlight. (Yes, I know there are workarounds.)

Hope that helps.

Sep 19, 2012 at 7:36 PM
Edited Sep 19, 2012 at 7:37 PM

Hey there, 

I'm having a bit of a problem with this myself. I get the worldview to work but not the OverHeadMap. I thought I just had to add a DataTemplate with key mapshape and he would load that as default or did I miss something? This is my code and nothing change on the overheadmap, still the same red text.  

But as I said, I'm new with this so I may have missed something else. Thanks for answer. 


         <DataTemplate x:Key="MapShape">

            <Border BorderBrush="Black" BorderThickness="4" CornerRadius="8" Background="#FF003847" Width="320">
                <Grid Margin="4">
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="0.5*"/>
                        <RowDefinition Height="0.33*"/>
                        <RowDefinition Height="0.33*"/>
                        <RowDefinition Height="16"/>
                    <TextBlock x:Name="NameBlock" TextWrapping="NoWrap" Text="{Binding Content}" FontSize="32" VerticalAlignment="Center" Margin="0,0,4,0" d:LayoutOverrides="Width" Grid.Column="1" TextTrimming="WordEllipsis"/>

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <ARControls:ARDisplay x:Name="ARDisplay" d:LayoutOverrides="Width" Height="672" VerticalAlignment="Bottom">
            <ARControls:OverheadMap x:Name="OverheadMap" CredentialsProvider=".." />

Nov 12, 2012 at 3:28 PM

Yes, that should work. Try adding the resource to the App.xaml resources instead of the page resources. But that really shouldn't matter I don't think...