How can I avoid the bluish border when clicking a HyperlinkButton in Silverlight?

Question

I have a Silverlight menu for my application with an image as the background. I use some empty HyperlinkButton at a specific position and size to simulate a real button on the image (think as a HTML image-map):

<HyperlinkButton x:Name="Portfolio" Width="86" Height="40" Canvas.Top="50" NavigateUri="/portfolio"/>
<HyperlinkButton x:Name="Analysis" Width="79" Height="40" Canvas.Top="50" Canvas.Left="124" NavigateUri="/analysis" BorderThickness="0"/>
<HyperlinkButton x:Name="News" Width="77" Height="40" Canvas.Top="50" Canvas.Left="240"  NavigateUri="/news"/>
<HyperlinkButton x:Name="Questions" Width="80" Height="40" Canvas.Top="50" Canvas.Left="357" NavigateUri="/questions"/>
<HyperlinkButton x:Name="Companies" Width="80" Height="40" Canvas.Top="50" Canvas.Left="477" NavigateUri="/companies"/>

The problem is when I click these buttons it shows a bluish border corresponding to the hyperlink button area during the click event. There is a way I can avoid showing that?

Answer 1

For info on styling controls, see http://weblogs.asp.net/scottgu/pages/silverlight-tutorial-part-7-using-control-templates-to-customize-a-control-s-look-and-feel.aspx (skip down to the Customizing Controls using Control Templates section halfway down). If you want to start with the default style (usually a good idea--start here and add/change/remove things until you get what you want) look here: http://msdn.microsoft.com/en-us/library/cc296242(VS.95).aspx.

In this case, I believe the offender is the "FocusVisualElement." You could either change the color of it, set visibility to "Collapsed," or remove/change the "Focused" state so the storyboard isn't run.

Answer 2

You can edit a template of HyperlinkButton in Blend: 1.right click on control choose "Edit Template->Edit a copy" 2.in "States" panel click "Pressed" 3.change property "Stroke" of rectangle named "FocusVisualElement" from solid color to "No brush"

http://silverlight.net/forums/t/40896.aspx

Answer 3

I found the answer in other blog, just set IsTabStop="False" in the HyperLinkButton instance.