マウスオーバー境界線をテキストブロック用のカスタムコントロール

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 
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

ユーザーコントロールを作成する必要はありません。私は、次のマークアップでこれを達成するために管理している：ここで

<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> 

EDIT：あなたがユーザーコントロールを必要としない理由

はまだそれを得ることはありません（してくださいそれをカスタムコントロールと呼んではいけません - これらは別のものです）、あなたの例を考えましょう。あなたは以下の

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

を書くとき

あなたが実際にMouseOverBorder.Contentプロパティを設定しています。もともとContentはMouseOverBorder.xamlファイルで定義されています。したがって、すべてのUserControl構造体をTextBlockに置き換えます。しかし、まだ私はあなたの考えを持って、それのための解決策を持っています。

まず、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 --> 

は最後に、次のようにユーザーコントロールを使用することができます。

<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>