文本框在我用Path设置样式后没有显示任何文本

本文关键字:文本 任何 显示 样式 设置 Path | 更新日期: 2023-09-27 18:28:35

我使用PATH为文本框创建了一个自定义样式。这个盒子看起来正是我想要的,但当我在里面写任何文字时,似乎什么都没有出现。我的风格中似乎有什么东西挡住了它,或者我需要添加一些东西来显示内容。但我不确定具体是什么,有人知道我能做些什么让文本出现在定制的盒子里吗?

<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"/>
  <Setter Property="IsReadOnly" Value="True"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type TextBox}">
        <StackPanel>
          <Path Data="M0 0 30 0 50 -10 70 0 100 0 100 30 0 30z" Fill="#0F1C2B"/>
        </StackPanel>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
  <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>
</Style>

应用于此TextBox:

<TextBox Style="{DynamicResource AppearingTextbox}" Height="30" Width="100" FontSize="10" Margin="0,480,0,0">
        Some text
</TextBox>

感谢一群人,我成功地让它发挥了作用。我不能把它放在Border标签里面,因为Border标签只接受一个子元素。相反,我使用了网格。网格也很好,因为在我读到的文档中,它允许将元素堆叠在一起。这就是我为任何在未来偶然发现这一点的人所做的。

<ControlTemplate>标签中,我做了以下操作:

<ControlTemplate TargetType="{x:Type TextBox}">
  <Grid>
    <Path Data="M0 0 30 0 50 -10 70 0 100 0 100 30 0 30z" Fill="#0F1C2B"/>
    <ScrollViewer Margin="0" x:Name="PART_ContentHost" />
  </Grid>
</ControlTemplate>

这立刻使文本出现在我制作的盒子里。一点样式使文本符合我的要求,但仅此而已。
感谢很多人,并考虑解决这个问题:)

文本框在我用Path设置样式后没有显示任何文本

TextBox模板需要命名零件

<ScrollViewer x:Name="PART_ContentHost" />

托管其内容并提供编辑功能

来自MSDN

可以包含FrameworkElement的视觉元素。TextBox的文本显示在此元素中。

编辑

<ControlTemplate TargetType="{x:Type TextBox}">
   <Grid>
      <Path Data="M0 0 30 0 50 -10 70 0 100 0 100 30 0 30z" Fill="#0F1C2B"/>
      <ScrollViewer x:Name="PART_ContentHost"/>
   </Grid>
</ControlTemplate>
MSDN提供了一个TextBox样式的示例,并列举了命名的部分。对于TextBox,显示其内容的是PART_ContentHost。默认模板为ScrollViewer:
<ScrollViewer Margin="0" x:Name="PART_ContentHost" />

如果将其添加到StackPanel,则元素将连续显示,但需要在Path之前显示文本。然后将StackPanel更改为Grid

<Grid>
    <Path Data="M0 0 30 0 50 -10 70 0 100 0 100 30 0 30z" Fill="#0F1C2B"/>
    <ScrollViewer Margin="0" x:Name="PART_ContentHost" />
</Grid>

接下来,我们需要将元素彼此对齐,然后可以添加VerticalAlignmentHorizontalAlignment

<Grid>
    <Path VerticalAlignment="Center" HorizontalAlignment="Center" Data="M0 0 30 0 50 -10 70 0 100 0 100 30 0 30z" Fill="#0F1C2B"/>
    <ScrollViewer VerticalAlignment="Center" HorizontalAlignment="Center" Margin="0" x:Name="PART_ContentHost"  />
</Grid>

最后你还有一个问题。默认情况下,文本颜色为黑色。您可以通过覆盖前景属性来更改它:

<Setter Property="Foreground" Value="White" />

完整样式将如下所示:

<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"/>
    <Setter Property="IsReadOnly" Value="True"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TextBoxBase}">
                <Grid>
                    <Path VerticalAlignment="Center" HorizontalAlignment="Center" Data="M0 0 30 0 50 -10 70 0 100 0 100 30 0 30z" Fill="#0F1C2B"/>
                    <ScrollViewer VerticalAlignment="Center" HorizontalAlignment="Center" Margin="0" x:Name="PART_ContentHost" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <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>
</Style>