Skip to content

Commit 53db626

Browse files
committed
feat: add custom balloon tooltip style
1 parent 4ef0dbc commit 53db626

File tree

5 files changed

+122
-0
lines changed

5 files changed

+122
-0
lines changed

src/Fischless.Relauncher/App.xaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
<ui:ControlsDictionary />
1212
<vio:ControlsDictionary />
1313
<ResourceDictionary Source="/Views/Controls/Button/Button.xaml" />
14+
<ResourceDictionary Source="/Views/Controls/Tooltip/Tooltip.xaml" />
1415
</ResourceDictionary.MergedDictionaries>
1516
<FontFamily x:Key="DelugeLEDFontFamily">pack://application:,,,/Fischless.Relauncher;component/Assets/Fonts/deluge-led.ttf#Deluge LED</FontFamily>
1617
<FontFamily x:Key="SymbolThemeFontFamily">pack://application:,,,/Fischless.Relauncher;component/Assets/Fonts/Segoe Fluent Icons.ttf#Segoe Fluent Icons</FontFamily>
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
// This file is used by Code Analysis to maintain SuppressMessage
2+
// attributes that are applied to this project.
3+
// Project-level suppressions either have no target or are given
4+
// a specific target and scoped to a namespace, type, member, etc.
5+
6+
using System.Diagnostics.CodeAnalysis;
7+
8+
[assembly: SuppressMessage("Style", "IDE0130:Namespace does not match folder structure", Justification = "<Pending>", Scope = "namespace", Target = "~N:Fischless.Relauncher.Views.Controls")]
Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
2+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
3+
xmlns:local="clr-namespace:Fischless.Relauncher.Views.Controls">
4+
<!-- Converter registration -->
5+
<local:TooltipCenterOffsetConverter x:Key="TooltipCenterOffsetConverter" />
6+
<Style x:Key="BalloonToolTip" TargetType="ToolTip">
7+
<!-- Basic properties -->
8+
<Setter Property="OverridesDefaultStyle" Value="True" />
9+
<Setter Property="HasDropShadow" Value="False" />
10+
<Setter Property="Placement" Value="Bottom" />
11+
<Setter Property="ToolTipService.ShowDuration" Value="0" />
12+
<Setter Property="ToolTipService.HorizontalOffset" Value="{Binding ActualWidth, RelativeSource={RelativeSource Self}, Converter={StaticResource TooltipCenterOffsetConverter}}" />
13+
<Setter Property="ToolTipService.VerticalOffset" Value="4" />
14+
<Setter Property="ToolTipService.InitialShowDelay" Value="0" />
15+
<Setter Property="ToolTipService.BetweenShowDelay" Value="0" />
16+
<Setter Property="ToolTipService.ShowDuration" Value="6000" />
17+
<Setter Property="ToolTipService.PlacementTarget" Value="{Binding RelativeSource={RelativeSource Self}}" />
18+
<Setter Property="Template">
19+
<Setter.Value>
20+
<ControlTemplate TargetType="ToolTip">
21+
<!-- Root container with scale transform for animation -->
22+
<Grid RenderTransformOrigin="0.5,0">
23+
<Grid.RenderTransform>
24+
<ScaleTransform x:Name="scale" ScaleX="0.8" ScaleY="0.8" />
25+
</Grid.RenderTransform>
26+
<StackPanel>
27+
<!-- Arrow -->
28+
<Path HorizontalAlignment="Center"
29+
Data="M 0 6 L 6 0 L 12 6 Z"
30+
Fill="#F2F2F2"
31+
Stroke="#CCC"
32+
StrokeThickness="0.5" />
33+
<!-- Content box -->
34+
<Border Padding="11,5"
35+
Background="#F2F2F2"
36+
BorderBrush="#CCC"
37+
BorderThickness="0.5"
38+
CornerRadius="4">
39+
<TextBlock FontFamily="Microsoft Yahei UI"
40+
FontSize="14"
41+
Foreground="#36373A"
42+
Text="{TemplateBinding Content}" />
43+
</Border>
44+
</StackPanel>
45+
</Grid>
46+
<!-- Animation trigger -->
47+
<ControlTemplate.Triggers>
48+
<!-- When tooltip opens, play scale + fade animation -->
49+
<EventTrigger RoutedEvent="ToolTip.Opened">
50+
<BeginStoryboard>
51+
<Storyboard>
52+
<!-- Scale animation -->
53+
<DoubleAnimation Storyboard.TargetName="scale"
54+
Storyboard.TargetProperty="ScaleX"
55+
From="0.8"
56+
To="1.0"
57+
Duration="0:0:0.15">
58+
<DoubleAnimation.EasingFunction>
59+
<QuadraticEase EasingMode="EaseOut" />
60+
</DoubleAnimation.EasingFunction>
61+
</DoubleAnimation>
62+
<DoubleAnimation Storyboard.TargetName="scale"
63+
Storyboard.TargetProperty="ScaleY"
64+
From="0.8"
65+
To="1.0"
66+
Duration="0:0:0.15">
67+
<DoubleAnimation.EasingFunction>
68+
<QuadraticEase EasingMode="EaseOut" />
69+
</DoubleAnimation.EasingFunction>
70+
</DoubleAnimation>
71+
<!-- Fade-in animation -->
72+
<DoubleAnimation Storyboard.TargetProperty="Opacity"
73+
From="0"
74+
To="1"
75+
Duration="0:0:0.15" />
76+
</Storyboard>
77+
</BeginStoryboard>
78+
</EventTrigger>
79+
</ControlTemplate.Triggers>
80+
</ControlTemplate>
81+
</Setter.Value>
82+
</Setter>
83+
</Style>
84+
</ResourceDictionary>
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
using System.Globalization;
2+
using System.Windows.Data;
3+
4+
namespace Fischless.Relauncher.Views.Controls;
5+
6+
/// <summary>
7+
/// Converts the element's ActualWidth to a negative half value
8+
/// so that the tooltip appears horizontally centered.
9+
/// </summary>
10+
public class TooltipCenterOffsetConverter : IValueConverter
11+
{
12+
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
13+
{
14+
if (value is double width && !double.IsNaN(width))
15+
{
16+
// Return negative half width for centering
17+
return -width / 2d + 16d;
18+
}
19+
return 0d;
20+
}
21+
22+
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
23+
{
24+
throw new NotSupportedException();
25+
}
26+
}

src/Fischless.Relauncher/Views/MaskWindow.xaml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,9 @@
1919
VerticalAlignment="Top"
2020
Command="{Binding OpenSettingsCommand}"
2121
Style="{StaticResource BorderlessButtonStyle}">
22+
<Button.ToolTip>
23+
<ToolTip Content="重启动设置" Style="{StaticResource BalloonToolTip}" />
24+
</Button.ToolTip>
2225
<Button.Content>
2326
<Border Padding="5.5">
2427
<Image Width="16"

0 commit comments

Comments
 (0)