9

基本的に、ホバーしたアイテムの場所を指す矢印が付いた素敵な黒いツールチップを作成するカスタム ツールチップ スタイルがあります。

問題は、ツールチップが常に正しい位置 (つまり、ウィンドウの端の近く) に配置されない場合があることです。これは、ツールチップの矢印が正しい場所を指していないことを意味します... この問題は何かありますか? または、場所の配置ごとに特定のスタイルを作成できますか?

<Style x:Key="{x:Type ToolTip}" TargetType="ToolTip">
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Setter Property="HasDropShadow" Value="True"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToolTip">
                <StackPanel>
                    <Border CornerRadius="3" HorizontalAlignment="Center" VerticalAlignment="Top" Padding="10,7" BorderThickness="0" Background="#e5323232">
                        <StackPanel>
                            <TextBlock FontFamily="Arial" FontSize="12" Text="{TemplateBinding Content}" Foreground="#f0f0f0" />
                        </StackPanel>
                    </Border>
                    <Path Margin="10,0,0,0" Fill="#e5323232" Data="M 0 0 L 6 6 L 12 0 Z"/>
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
4

2 に答える 2

1

多分あなたはこれを試すことができます.toを設定Placementし、テンプレートで作成した矢印と一致するようにCenteraを追加しました.HorizontalOffset

ただし、それはコントロールの垂直方向の中央に配置されないため、コントロールのサイズを作成して計算し、2 で割るか、Border と同じサイズIValueConverterのダミー要素を追加して、StackPanelコードビハインドを必要としないツールチップ

<Style TargetType="{x:Type ToolTip}">
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="HasDropShadow" Value="True"/>
        <Setter Property="Placement" Value="Center" />
        <!--Offset to the arrow path-->
        <Setter Property="HorizontalOffset" Value="15"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ToolTip}">
                    <StackPanel>
                        <Border x:Name="border" CornerRadius="3" HorizontalAlignment="Center" VerticalAlignment="Top" Padding="10,7" BorderThickness="0" Background="#e5323232">
                            <StackPanel>
                                <TextBlock FontFamily="Arial" FontSize="12" Text="{TemplateBinding Content}" Foreground="#f0f0f0" />
                            </StackPanel>
                        </Border>
                        <Path Margin="10,0,0,0" Fill="#e5323232" Data="M 0 0 L 6 6 L 12 0 Z"/>

                        <!--Dummy rectangle same height as tool tip, so it centers on the control-->
                        <Rectangle Height="{Binding ActualHeight, ElementName=border}" />
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
于 2013-05-15T10:23:14.343 に答える