Abdulhameed
Top achievements
Rank 1
Abdulhameed
asked on 27 Jul 2011, 06:48 AM
Is it possible to use the Navigation bar with shapfile maps?
I tried to set the visibility to visible with no success?
Please advise?
I tried to set the visibility to visible with no success?
Please advise?
3 Answers, 1 is accepted
0
Accepted
Hello Abdulhameed,
It seems you set RadMap.UseDefaultLayout property to "False". This approach is used to hide all of the controls including Navigation for creating your own custom layout. For more information please take a look to the following documentation topic:
http://www.telerik.com/help/silverlight/radmap-features-default-layout.html
If you want to use standard Navigation control of RadMap, then you should specify "True" to RadMap.UseDefaultLayout property or just remove it. Also you can hide other controls if they are not required. The sample code is below.
Kind regards,
Andrey Murzov
the Telerik team
It seems you set RadMap.UseDefaultLayout property to "False". This approach is used to hide all of the controls including Navigation for creating your own custom layout. For more information please take a look to the following documentation topic:
http://www.telerik.com/help/silverlight/radmap-features-default-layout.html
If you want to use standard Navigation control of RadMap, then you should specify "True" to RadMap.UseDefaultLayout property or just remove it. Also you can hide other controls if they are not required. The sample code is below.
<
telerik:RadMap
x:Name
=
"radMap"
NavigationVisibility
=
"Visible"
ScaleVisibility
=
"Collapsed"
MouseLocationIndicatorVisibility
=
"Collapsed"
>
...
</
telerik:RadMap
>
Kind regards,
Andrey Murzov
the Telerik team
Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!
0
Abdulhameed
Top achievements
Rank 1
answered on 30 Jul 2011, 09:10 AM
One Other thing.
What are the options to change the navigation bar look and feel.
Is it affected by theme?
I have seen an article in help explains how to change the colors only
Can I change it totally and use images ......
What are the options to change the navigation bar look and feel.
Is it affected by theme?
I have seen an article in help explains how to change the colors only
Can I change it totally and use images ......
0
Hi Abdulhameed,
Yes, you can use themes to change the appearance of the map and its controls. You can specify the StyleManager.Theme attachable property. Also when you use a theme then you should reference its dll in your project.
Also you can use standard approach for restyling the navigation control using your own styles. The sample code is below.
All the best,
Andrey Murzov
the Telerik team
Yes, you can use themes to change the appearance of the map and its controls. You can specify the StyleManager.Theme attachable property. Also when you use a theme then you should reference its dll in your project.
<
telerik:RadMap
x:Name
=
"radMap"
telerik:StyleManager.Theme
=
"Metro"
>
</
telerik:RadMap
>
Also you can use standard approach for restyling the navigation control using your own styles. The sample code is below.
<
UserControl
x:Class
=
"SilverlightApplication1.MainPage"
xmlns:telerik
=
"http://schemas.telerik.com/2008/xaml/presentation"
xmlns:system
=
"clr-namespace:System;assembly=mscorlib"
mc:Ignorable
=
"d"
d:DesignHeight
=
"300"
d:DesignWidth
=
"400"
>
<
UserControl.Resources
>
<
LinearGradientBrush
x:Key
=
"ControlOuterBorderVertical_Normal"
EndPoint
=
"1,0.5"
StartPoint
=
"0,0.5"
>
<
GradientStop
Color
=
"#FFA9BFD6"
/>
<
GradientStop
Color
=
"#FFCDDAEA"
Offset
=
"1"
/>
</
LinearGradientBrush
>
<
Thickness
x:Key
=
"MapCommandBarMargin"
>6,0</
Thickness
>
<
Thickness
x:Key
=
"MapZoomBarMargin"
>6,0</
Thickness
>
<
SolidColorBrush
x:Key
=
"MapArrowShadow"
Color
=
"White"
/>
<
system:Double
x:Key
=
"MapNavigationSize"
>74</
system:Double
>
<
Visibility
x:Key
=
"MapArrowVisibility"
>Visible</
Visibility
>
<
SolidColorBrush
x:Key
=
"MapNavigationCenterEllipseBackground"
Color
=
"Transparent"
/>
<
SolidColorBrush
x:Key
=
"MapNavigationCenterEllipseStroke"
Color
=
"Transparent"
/>
<
Visibility
x:Key
=
"MapNavigationCenterEllipseVisibility"
>Collapsed</
Visibility
>
<
SolidColorBrush
x:Key
=
"MapNavigationCenterOuterEllipseStroke"
Color
=
"Transparent"
/>
<
Style
x:Key
=
"MapNavigationButton"
TargetType
=
"telerik:RadButton"
>
<
Setter
Property
=
"Foreground"
>
<
Setter.Value
>
<
LinearGradientBrush
EndPoint
=
"1,1"
StartPoint
=
"0,0"
>
<
GradientStop
Color
=
"#FF1E395B"
Offset
=
"0.004"
/>
<
GradientStop
Color
=
"#FFC3E4F5"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FF4C607A"
Offset
=
"0.5"
/>
</
LinearGradientBrush
>
</
Setter.Value
>
</
Setter
>
<
Setter
Property
=
"Width"
Value
=
"30"
/>
<
Setter
Property
=
"Height"
Value
=
"30"
/>
</
Style
>
<
Style
x:Key
=
"MapNavigationLeftButton"
BasedOn
=
"{StaticResource MapNavigationButton}"
TargetType
=
"telerik:RadButton"
>
<
Setter
Property
=
"Padding"
Value
=
"0,0,12,0"
/>
<
Setter
Property
=
"Background"
>
<
Setter.Value
>
<
LinearGradientBrush
EndPoint
=
"1,0.5"
StartPoint
=
"0,0.5"
>
<
GradientStop
Color
=
"#FFFDFEFF"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFDDE9F7"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFE6F0FA"
Offset
=
"0.5"
/>
<
GradientStop
Color
=
"#FFDCE6F4"
Offset
=
"0.5"
/>
</
LinearGradientBrush
>
</
Setter.Value
>
</
Setter
>
<
Setter
Property
=
"CornerRadius"
Value
=
"9,15,15,9"
/>
</
Style
>
<
Style
x:Key
=
"MapNavigationRightButton"
BasedOn
=
"{StaticResource MapNavigationButton}"
TargetType
=
"telerik:RadButton"
>
<
Setter
Property
=
"Padding"
Value
=
"12,0,0,0"
/>
<
Setter
Property
=
"Background"
>
<
Setter.Value
>
<
LinearGradientBrush
EndPoint
=
"0,0.5"
StartPoint
=
"1,0.5"
>
<
GradientStop
Color
=
"#FFFDFEFF"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFDDE9F7"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFE6F0FA"
Offset
=
"0.5"
/>
<
GradientStop
Color
=
"#FFDCE6F4"
Offset
=
"0.5"
/>
</
LinearGradientBrush
>
</
Setter.Value
>
</
Setter
>
<
Setter
Property
=
"CornerRadius"
Value
=
"15,9,9,15"
/>
</
Style
>
<
Style
x:Key
=
"MapNavigationUpButton"
BasedOn
=
"{StaticResource MapNavigationButton}"
TargetType
=
"telerik:RadButton"
>
<
Setter
Property
=
"Padding"
Value
=
"0,0,0,12"
/>
<
Setter
Property
=
"Background"
>
<
Setter.Value
>
<
LinearGradientBrush
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFDFEFF"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFDDE9F7"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFE6F0FA"
Offset
=
"0.5"
/>
<
GradientStop
Color
=
"#FFDCE6F4"
Offset
=
"0.5"
/>
</
LinearGradientBrush
>
</
Setter.Value
>
</
Setter
>
<
Setter
Property
=
"CornerRadius"
Value
=
"9,9,15,15"
/>
</
Style
>
<
Style
x:Key
=
"MapNavigationDownButton"
BasedOn
=
"{StaticResource MapNavigationButton}"
TargetType
=
"telerik:RadButton"
>
<
Setter
Property
=
"Padding"
Value
=
"0,12,0,0"
/>
<
Setter
Property
=
"Background"
>
<
Setter.Value
>
<
LinearGradientBrush
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFDFEFF"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFDDE9F7"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFE6F0FA"
Offset
=
"0.5"
/>
<
GradientStop
Color
=
"#FFDCE6F4"
Offset
=
"0.5"
/>
</
LinearGradientBrush
>
</
Setter.Value
>
</
Setter
>
<
Setter
Property
=
"CornerRadius"
Value
=
"15,15,9,9"
/>
</
Style
>
<
Style
x:Key
=
"MapNavigationCenterButton"
BasedOn
=
"{StaticResource MapNavigationButton}"
TargetType
=
"telerik:RadButton"
>
<
Setter
Property
=
"Background"
>
<
Setter.Value
>
<
LinearGradientBrush
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFDFEFF"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFDCE6F4"
/>
</
LinearGradientBrush
>
</
Setter.Value
>
</
Setter
>
<
Setter
Property
=
"CornerRadius"
Value
=
"13"
/>
<
Setter
Property
=
"Width"
Value
=
"26"
/>
<
Setter
Property
=
"Height"
Value
=
"26"
/>
</
Style
>
<
Style
x:Key
=
"MapDropDownButton"
TargetType
=
"telerik:RadDropDownButton"
>
<
Setter
Property
=
"Width"
Value
=
"36"
/>
<
Setter
Property
=
"Height"
Value
=
"26"
/>
<
Setter
Property
=
"CornerRadius"
Value
=
"3"
/>
<
Setter
Property
=
"Background"
>
<
Setter.Value
>
<
LinearGradientBrush
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFDFEFF"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFDDE9F7"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFE6F0FA"
Offset
=
"0.5"
/>
<
GradientStop
Color
=
"#FFDCE6F4"
Offset
=
"0.5"
/>
</
LinearGradientBrush
>
</
Setter.Value
>
</
Setter
>
<
Setter
Property
=
"BorderBrush"
Value
=
"{StaticResource ControlOuterBorderVertical_Normal}"
/>
</
Style
>
<
Style
x:Key
=
"MapCommandBarButton"
BasedOn
=
"{StaticResource MapDropDownButton}"
TargetType
=
"telerik:RadDropDownButton"
>
</
Style
>
<
Style
x:Key
=
"MapZoomBarButton"
BasedOn
=
"{StaticResource MapDropDownButton}"
TargetType
=
"telerik:RadDropDownButton"
>
</
Style
>
<
Style
TargetType
=
"telerik:MapNavigation"
>
<
Setter
Property
=
"IsTabStop"
Value
=
"False"
/>
<
Setter
Property
=
"Template"
>
<
Setter.Value
>
<
ControlTemplate
TargetType
=
"telerik:MapNavigation"
>
<
Grid
x:Name
=
"mapNavigation"
HorizontalAlignment
=
"Center"
VerticalAlignment
=
"Center"
Width
=
"{StaticResource MapNavigationSize}"
Height
=
"{StaticResource MapNavigationSize}"
>
<
telerik:RadButton
x:Name
=
"PART_ArrowLeft"
HorizontalAlignment
=
"Left"
Style
=
"{StaticResource MapNavigationLeftButton}"
>
<
telerik:Arrow
Direction
=
"Left"
Visibility
=
"{StaticResource MapArrowVisibility}"
/>
</
telerik:RadButton
>
<
telerik:RadButton
x:Name
=
"PART_ArrowRight"
HorizontalAlignment
=
"Right"
Style
=
"{StaticResource MapNavigationRightButton}"
>
<
telerik:Arrow
Direction
=
"Right"
Visibility
=
"{StaticResource MapArrowVisibility}"
/>
</
telerik:RadButton
>
<
telerik:RadButton
x:Name
=
"PART_ArrowUp"
VerticalAlignment
=
"Top"
Style
=
"{StaticResource MapNavigationUpButton}"
>
<
telerik:Arrow
Direction
=
"Up"
Visibility
=
"{StaticResource MapArrowVisibility}"
/>
</
telerik:RadButton
>
<
telerik:RadButton
x:Name
=
"PART_ArrowDown"
VerticalAlignment
=
"Bottom"
Style
=
"{StaticResource MapNavigationDownButton}"
>
<
telerik:Arrow
Direction
=
"Down"
Visibility
=
"{StaticResource MapArrowVisibility}"
/>
</
telerik:RadButton
>
<
Ellipse
StrokeThickness
=
"5"
Width
=
"47"
Height
=
"47"
VerticalAlignment
=
"Center"
HorizontalAlignment
=
"Center"
Fill
=
"{StaticResource MapNavigationCenterEllipseBackground}"
Stroke
=
"{StaticResource MapNavigationCenterEllipseStroke}"
Visibility
=
"{StaticResource MapNavigationCenterEllipseVisibility}"
/>
<
Ellipse
HorizontalAlignment
=
"Center"
VerticalAlignment
=
"Center"
StrokeThickness
=
"1"
Height
=
"47"
Width
=
"47"
Stroke
=
"{StaticResource MapNavigationCenterOuterEllipseStroke}"
Visibility
=
"{StaticResource MapNavigationCenterEllipseVisibility}"
/>
<
telerik:RadButton
x:Name
=
"PART_CenterButton"
Style
=
"{StaticResource MapNavigationCenterButton}"
/>
</
Grid
>
</
ControlTemplate
>
</
Setter.Value
>
</
Setter
>
</
Style
>
</
UserControl.Resources
>
<
Grid
x:Name
=
"LayoutRoot"
Background
=
"White"
>
<
telerik:RadMap
x:Name
=
"radMap"
>
<
telerik:RadMap.Provider
>
<
telerik:OpenStreetMapProvider
/>
</
telerik:RadMap.Provider
>
</
telerik:RadMap
>
</
Grid
>
</
UserControl
>
All the best,
Andrey Murzov
the Telerik team
Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>