在ToolTip WPF上使用情节提要

Question

I am trying to create a storyboard, so when a user clicks on a textbox, its copies the text to their clipboard and shows a tooltip saying copied, which then fades away.

Here is my attempt:

xaml :

<TextBox Name="PolyValue" Text="{Binding .}" IsReadOnly="True" BorderThickness="0" Background="White"
        VerticalAlignment="Center" PreviewMouseDown="CopyTextBox" >

    <TextBox.ToolTip>
        <ToolTip Style="{StaticResource TooltipPopupFadeAway}" IsOpen="True" Opacity="0" Background="Transparent" BorderThickness="0">
            <Border Background="White" BorderBrush="Black" BorderThickness="1" CornerRadius="3" >
                <Label Content="Copied" Padding="5, 2" />
            </Border>
        </ToolTip>
    </TextBox.ToolTip>
</TextBox>

Here is the Storyboard :

<Style x:Key="TooltipPopupFadeAway" TargetType="ToolTip">
    <Style.Triggers>
        <DataTrigger Binding="{Binding Opacity, RelativeSource={RelativeSource Self}}" Value="1">
            <DataTrigger.EnterActions>
                <BeginStoryboard x:Name="ClosePopupStoryBoard">
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:01" From="3" To="0" />
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
        </DataTrigger>
    </Style.Triggers>
</Style>

Code behind:

private void CopyTextBox(object sender, MouseButtonEventArgs e)
{
    if(sender is TextBox textBox)
    {
        Clipboard.SetText(textBox.Text);
        (textBox.ToolTip as ToolTip).IsOpen = false;
        (textBox.ToolTip as ToolTip).IsOpen = true; //this recalculates the position
        (textBox.ToolTip as ToolTip).Opacity = 1;

    }
}

This works exactly how I want it to, however it only works once, after it has been shown and the user clicks again nothing happens.

After setting a break point in the CopyTextBox method, the of the ToolTip opacity is 0 even after programmatically setting it to 1.

I am not sure what I am doing wrong?

Answer 1

You should trigger directly on the IsOpen property. Make sure to set the default Opacity to 0 , and do not explicitly set it to 1 afterwards.

<Style x:Key="TooltipPopupFadeAway" TargetType="ToolTip">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="Opacity" Value="0"/>
    <Setter Property="IsOpen" Value="False"/>
    <Style.Triggers>
        <Trigger Property="IsOpen" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                         Duration="0:0:1" From="3" To="0"/>
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
    </Style.Triggers>
</Style>

In code behind, do not to set the Opacity:

private void CopyTextBox(object sender, MouseButtonEventArgs e)
{
    if (sender is TextBox textBox)
    {
        Clipboard.SetText(textBox.Text);
        ((ToolTip)textBox.ToolTip).IsOpen = false;
        ((ToolTip)textBox.ToolTip).IsOpen = true;
    }
}

Answer 2

This is the sort of approach I mean.

Just binding the text property means you need no code.

I'm not sure this does exactly what you want because you seem to have previewmousedown showing the tooltip. Which is a bit odd for a tooltip since mouseover shows them.

<Window.Resources>
    <ControlTemplate x:Key="TooltipPopupFadeAway" TargetType="ToolTip">
                    <Border Background="Yellow">
                    <TextBlock Text="{Binding PlacementTarget.Text, RelativeSource={RelativeSource AncestorType={x:Type ToolTip}}}"
                               Name="TheText"
                               />
                    </Border>
        <ControlTemplate.Triggers>
            <EventTrigger RoutedEvent="ToolTip.Opened">
                <BeginStoryboard>
                    <Storyboard TargetProperty="Opacity">
                        <DoubleAnimation From="1.0" To="0" Duration="0:0:2" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
</Window.Resources>
<Grid>
    <TextBox>
        <TextBox.ToolTip>
            <ToolTip Template="{StaticResource TooltipPopupFadeAway}"/>
        </TextBox.ToolTip> 
    </TextBox>
</Grid>

And you could set that template and tooltip etc via style if it suited you better. I used a yellow background so I can see it easy. The tooltip probably doesn't exactly match what you had.