WPF tooltip位置,增加箭头,圆角设置,样式修改

先贴代码

<Window.Resources>
        <FontFamily x:Key="PingFangSCRegular">/WpfApplication2;Component/Fonts/#PingFang SC Regular</FontFamily>
        <Style x:Key="MyToolTipStyle" TargetType="ToolTip">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <StackPanel>
                            <Path HorizontalAlignment="Right" VerticalAlignment="Center" Data="M 6 0 L 0 6 L 12 6 Z" Fill="#E6333333" Margin="0,0,10,0"/>
                            <Border CornerRadius="2" Background="#E6333333" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <TextBlock  Text="{TemplateBinding ContentControl.Content}" Foreground="White" FontFamily="{StaticResource PingFangSCRegular}" LineHeight="20" Margin="6"/>
                            </Border>
                        </StackPanel>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Name="btnTest"  Content="Button" HorizontalAlignment="Left" Margin="180,96,0,0" VerticalAlignment="Top" Width="21" Height="18" Click="btnTest_Click">
            <Button.ToolTip>
                <ToolTip Name="aaa" Style ="{DynamicResource MyToolTipStyle}" Content="按钮提示按钮提示按钮提示按钮提示" VerticalOffset="-10" HorizontalOffset="-180"/>
            </Button.ToolTip>
        </Button>
    </Grid>

1.tooltip相对位置修改:
参考了:https://www.cnblogs.com/greenteaone/archive/2010/12/15/1906890.html
VerticalOffset="-10" HorizontalOffset="-180" 这两个是相对于鼠标的位置修改
2.增加箭头:

<Path HorizontalAlignment="Right" VerticalAlignment="Center" Data="M 6 0 L 0 6 L 12 6 Z" Fill="#E6333333" Margin="0,0,10,0"/>

在样式里面增加了一个path,就是图形,自定义了一个三角形,看上去和箭头一样,具体的path data的定义,可以参考:
https://blog.csdn.net/feiying008/article/details/13094539
3.圆角设置:样式里面的Border的属性CornerRadius=“2”
4.样式修改:之前没接触过样式,后来百度学习了下,发现就是在xaml最前面增加如下内容

<Window.Resources>
        <Style x:Key="MyToolTipStyle" TargetType="ToolTip">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        //style的内容
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

其中MyToolTipStyle是style名称,后面的ToolTip是style可以运用控件的类型,ControlTemplate里面的具体你设计的风格内容。

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
WPF中,可以使用ToolTip来为控件添加提示文本。根据引用\[1\]和引用\[2\]的代码,可以看出可以通过设置ToolTip样式来自定义提示框的外观。在引用\[2\]中,定义了一个名为"FlowToolTip"的样式,其中设置了提示框的水平对齐方式、垂直对齐方式以及背景颜色等属性。同时,还使用了一个边框和阴影效果来增加提示框的立体感。在样式的模板中,使用了一个TextBlock来显示提示文本的内容。这个TextBlock的字体、字号和前景色等属性也可以根据需要进行调整。引用\[3\]中提到,TextBlock也可以用于ToolTip中,可以通过设置TextBlock的Text属性来显示提示文本的内容。如果希望提示文本换行,可以参考引用\[4\]中的代码,将TextBlock放置在一个TextBox中,并设置TextWrapping属性为Wrap,这样就可以实现提示文本的换行显示。 #### 引用[.reference_title] - *1* *2* [WPF自定义tooltip样式](https://blog.csdn.net/FireGhost57/article/details/103714602)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* *4* [WPF中的ToolTip自动换行](https://blog.csdn.net/lulei6/article/details/106545828)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值