Question

我想尝试这样的事情：

基本上，我制作了电子邮件按钮，我想制作一个带有文本的自定义文本框，当鼠标进入“电子邮件”按钮时，该文本框会慢慢淡入。现在，我制作了这样的自定义框：

<Style x:Key="AppearingTextbox" TargetType="{x:Type TextBox}">
  <Setter Property="Cursor" Value="Arrow"/>
  <Setter Property="Foreground" Value="#3E82C4"/>
  <Setter Property="Background" Value="#0F1C2B"/>
  <Setter Property="Opacity" Value="0.4"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type TextBox}">
        <Path Data="M0 0 30 0 50 -15 70 0 100 0 100 30 0 30z" Fill="#0F1C2B"/>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

我正在窗口中使用它：

<TextBox Style="{DynamicResource AppearingTextbox}" Height="30" Width="100" FontSize="14">
  aaaaaaaaaa
</TextBox>

然而，我得到的只是装满这种灰/黑色的盒子，当我尝试写入时，没有任何反应。我对所有这些都有点新意，所以不确定我做错了什么另外，如果将鼠标悬停在另一个按钮上，它将如何显示或消失？我想的可能是在电子邮件按钮上进行鼠标悬停效果，并以某种方式将其链接到TextBox不透明度......不知道该怎么办呢...
任何帮助或见解将不胜感激。

<Style.Triggers>
  <DataTrigger Binding="{Binding ElementName=Ikona, Path=IsMouseOver}" Value="True">
    <DataTrigger.EnterActions>
      <BeginStoryboard >
        <Storyboard TargetProperty="Opacity" Duration="00:00:00.3" AutoReverse="False">
          <DoubleAnimation From="0" To="1" Duration="00:00:00.3"/>
        </Storyboard>
      </BeginStoryboard>
    </DataTrigger.EnterActions>
    <DataTrigger.ExitActions>
      <BeginStoryboard >
        <Storyboard TargetProperty="Opacity" Duration="00:00:00.3" AutoReverse="False">
          <DoubleAnimation From="1" To="0" Duration="00:00:00.3"/>
        </Storyboard>
      </BeginStoryboard>
    </DataTrigger.ExitActions>
  </DataTrigger>
</Style.Triggers>

通过在上面的代码中最后一次关闭<Setter>标记添加以下内容，我设法在将鼠标悬停在按钮上时淡入并淡出动画。

我的定制框中仍然没有写任何内容的问题。我是否需要启用或更改某些属性才能使其正常工作？我有一种感觉，“填充”是这里的问题..但不知道该怎么办。

Answer 1

此代码将执行您想要的操作：

<Grid>
    <Button Width="100" Height="50" VerticalAlignment="Top" x:Name="SomeButton"></Button>
    <TextBox Width="200" Height="200" Background="Red" Opacity="0" Text="Some TextBox">
        <TextBox.Style>
            <Style TargetType="{x:Type TextBox}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=SomeButton, Path=IsMouseOver}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard >
                                <Storyboard TargetProperty="Opacity" Duration="00:00:01" AutoReverse="True">
                                    <DoubleAnimation From="0" To="1" Duration="00:00:01"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </TextBox.Style>
    </TextBox>
</Grid>

TextBox的Style简单地说是要观察Button的IsMouseOver属性，当它被设置为true以便以1s淡入时。当条件为假时，TextBox以1s淡出（AutoReverse =“True”）

Answer 2

只是用工具提示来描述我的意思的另一个选项，你可以做这样的事情。只是在记事本中快速拼凑在一起，所以如果你决定走这条路，你可能想要调整它。

{{1}}

将鼠标悬停在wpf中的按钮上时，如何显示自定义文本框

2 个答案: