Silverlight ToolTips – positioning and customizing

Posted by Corey on November 25, 2008 at 5:28 am.

Customizing

The end all be all definitive guide on how to customize a ToolTip is Dave Relyea’s post.  He shows a very clean and concise step by step on how to completely change the visuals of a ToolTip.  http://blogs.msdn.com/devdave/archive/2008/10/18/customizing-a-tooltip.aspx

Positioning

Positioning a ToolTip can be done with HorizontalOffset and VerticalOffset.  The biggest drawback is the inability to place the tooltip exactly where you want through XAML.  It can be done by wiring up a MouseEnter event for the ToolTip and then calculating the offsets.

image

<Button x:Name="InfoButton" Content="info" Width="50" Height="25">


    <ToolTipService.ToolTip>


        <ToolTip HorizontalOffset="-40" VerticalOffset="-140">


            <ToolTip.Content>


                <Grid Width="70">


                    <Rectangle Fill="Blue" />


                    <TextBlock TextWrapping="Wrap" Foreground="White"


                        Text="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam mattis," />


                </Grid>


            </ToolTip.Content>


        </ToolTip>


    </ToolTipService.ToolTip>


</Button>

Notice the nested ToolTip inside the ToolTipService.  This is where you set the horizontal and vertical offsets for the Tooltip.

UI

4 Responses to “Silverlight ToolTips – positioning and customizing”

Leave a Reply