Question

我正在尝试为文本块创建自定义控件，当鼠标悬停时，会出现边框。我是WPF的新手，只做了一些非常简单的自定义控件。我需要在XAML UserControl中实现它。

任何建议都将不胜感激。再次感谢StackOverflow。

编辑：我将不得不将持久性属性绑定到几个不同的控件，所以我真的需要在自定义控件中执行此操作。这就是我所拥有的，它不起作用：

xmlns:customControls="clr-namespace:****.CustomControls"
....
<customControls:MouseOverBorder>
        <TextBlock Style="{StaticResource ResourceKey=HomePageButtonText}"
                   Height="100"
                   Width="100"
                   Margin="5"
                   Text="View Reports" />
</customControls:MouseOverBorder>

UserControl：

<UserControl 
x:Class="****.MouseOverBorder"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
mc:Ignorable="d">

<UserControl.Resources>
    <ResourceDictionary>
        <Style x:Key="MouseOverBorder" TargetType="{x:Type Border}">
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="CornerRadius" Value="3" />
            <Style.Triggers>
                <Trigger Property="Border.IsMouseOver" Value="true">
                    <Setter Property="BorderBrush" Value="White" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </ResourceDictionary>
</UserControl.Resources>
<Border Style="{DynamicResource MouseOverBorder}" BorderThickness="1" CornerRadius="3" SnapsToDevicePixels="True"/>

Answer 1

无需进行UserControl。我已设法通过以下标记完成此任务：

<Border Style="{DynamicResource BorderStyle1}" BorderThickness="1" CornerRadius="3" >
    <TextBlock Text="TextBlock" />
</Border>

这是风格：

<Style x:Key="BorderStyle1" TargetType="{x:Type Border}">
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="CornerRadius" Value="3"/>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="BorderBrush" Value="#FF123BBA"/>
        </Trigger>
    </Style.Triggers>
</Style>

编辑：

仍然没有得到它为什么你需要UserControl（请不要称之为自定义控件 - 这些是不同的东西），但让我们考虑你的例子。

撰写以下内容时

<customControls:MouseOverBorder>
    <TextBlock Style="{StaticResource ResourceKey=HomePageButtonText}"
               Height="100"
               Width="100"
               Margin="5"
               Text="View Reports" />
</customControls:MouseOverBorder>

您实际上是在设置MouseOverBorder.Content属性。最初它的内容是在MouseOverBorder.xaml文件中定义的。因此，您将使用TextBlock替换所有UserControl结构。但我仍然有你的想法，并为此找到解决方案。

首先，为MouseOverBorder类添加自定义DependencyProperty和CLR包装器：

public static readonly DependencyProperty MyContentTemplateProperty =
    DependencyProperty.Register("MyContentTemplate", typeof(DataTemplate), typeof(MouseOverBorder), null);

[Browsable(true)]
[Category("Other")]
public DataTemplate MyContentTemplate
{
    get { return (DataTemplate)GetValue(MyContentTemplateProperty); }
    set { SetValue(MyContentTemplateProperty, value); }
}

其次，在MouseOverBorder中创建一些东西，使用这个属性，例如

<ContentPresenter ContentTemplate="{Binding MyContentTemplate, ElementName=userControl}"/>
<!-- userControl is the Name of MouseOverBorder, defined in xaml -->

最后，您可以按照以下方式使用UserControl：

<customControls:MouseOverBorder>
    <customControls:MouseOverBorder.MyContentTemplate>
        <DataTemplate>
            <TextBlock Style="{StaticResource ResourceKey=HomePageButtonText}"
                       Height="100"
                       Width="100"
                       Margin="5"
                       Text="View Reports" />
        </DataTemplate>
    </customControls:MouseOverBorder.MyContentTemplate>
</customControls:MouseOverBorder>

鼠标悬停在文本块的自定义控件中的边框

1 个答案: