wpf - TextBlock のマウスハウアー

Question

アイデアは、上記のマウスの遠吠えTextBlock、 newImageが表示され、それをクリックできるようになることです。マウスが離れるとTextBlock-Imageが消えます。

その間、私はこれに来ましたが、まだ続行できません:

<Style x:Key="HoverHighlightTextStyle" TargetType="TextBlock">
    <Setter Property="FontSize" Value="16"/>
    <Setter Property="FontWeight" Value="Normal"/>
    <Setter Property="Margin" Value="3,0,3,0"/>

    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
         </Trigger>
    </Style.Triggers>
</Style>

Expected result

Answer 1

I suggest you to follow the below steps.

1. Create a stackpanel (orientation is set to horizontal) or any other appropriate control and add text box and image controls inside it.
2. Hide the borders of text box and the image controls so that only the stackpanel border is visible.
3. When the mouseover event fired, set the image control to be appeared.
4. When the mouseleave event fired, set the image control to be disappeared.

I haven't tested this. But this might help you to get an idea.

Answer 2

I find solution based on sa_ddam213 answer:

<TextBlock x:Name="txtblkSelectedItem" Text="My Textblock">
<TextBlock.ToolTip>
  <ToolTip PlacementTarget="{Binding ElementName=txtblkSelectedItem}" Placement="Right" HorizontalOffset="-20">
    <Image Source="http://stackoverflow.com/users/flair/1849109.png" Width="10" Height="10"/>
  </ToolTip>
</TextBlock.ToolTip>

The idea, is positioning tooltip inside textblock can be achived by using ToolTip

Placement="Right" HorizontalOffset="-20"

properties