ユーザーコントロールのスタイルが奇妙な振る舞い

Question

ここでこのような変なことが起こります。私はwpf xamlを使用していますが、私はUser Controlを作成しました。ここで

は、コントロールのXAMLコードです：

<UserControl x:Class="Stirnradprogramm.Classes.Controls.TextBoxWithImage" 
     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" 
     xmlns:local="clr-namespace:Stirnradprogramm.Classes.Controls" 
     x:Name="parent"> 
<Grid DataContext="{Binding ElementName=parent}" Margin="0"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="1*"/> 
     <ColumnDefinition Width="15"/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="15"/> 
     <RowDefinition Height="1*"/> 
    </Grid.RowDefinitions> 
    <TextBox Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" Grid.ColumnSpan="2" KeyDown="TextBox_KeyDown" ></TextBox> 
    <StackPanel Grid.Column="1" Margin="0,3,3,0"> 
     <Image Grid.Column="1" Margin="0,2,0,0" Grid.Row="0" MouseDown="Image_MouseDown" > 
      <Image.Style> 
       <Style TargetType="Image"> 
        <Style.Triggers> 
         <DataTrigger Binding="{Binding Path=State}" Value="true"> 
          <Setter Property="Source" Value="{Binding LockedImgPath}"></Setter> 
         </DataTrigger> 
         <DataTrigger Binding="{Binding Path=State}" Value="false"> 
          <Setter Property="Source" Value="{Binding UnlockedImgPath}"></Setter> 
         </DataTrigger> 
        </Style.Triggers> 
       </Style> 
      </Image.Style> 
     </Image> 
    </StackPanel> 
</Grid> 

今、私は私のメインウィンドウで、それを使用しています：

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="1*"/> 
     <ColumnDefinition Width="1*"/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="1*"></RowDefinition> 
    </Grid.RowDefinitions> 
    <tbwi:TextBoxWithImage Style="{StaticResource TextBoxWithImageStyle}" Height="27" Margin="3" State="{Binding lockPressed}" Grid.Column="0" Grid.Row="1" /> 
    <TextBox Style="{StaticResource TextBoxStyle}" Grid.Column="1" Grid.Row="1"></TextBox> 
</Grid> 

あなたが見ることができるように、私はよここでは2つの異なるスタイルを使用します：

<Style TargetType="tbwi:TextBoxWithImage" x:Key="TextBoxWithImageStyle"> 
    <Setter Property="Height" Value="27"></Setter> 
    <Setter Property="Margin" Value="3"></Setter> 
    <Setter Property="VerticalContentAlignment" Value="Center"></Setter> 
</Style> 
<Style TargetType="TextBox" x:Key="TextBoxStyle"> 
    <Setter Property="Height" Value="27"></Setter> 
    <Setter Property="Margin" Value="3"></Setter> 
    <Setter Property="VerticalContentAlignment" Value="Center"></Setter> 
</Style> 

のスタイルは同じのようですが、視覚的な結果は異なります。

そして、もっと面白い、私は私のユーザーコントロールからスタイルを捨てて、手動でマージンとHeightプロパティを書くとき、結果は、同じ大きさを期待しています。

<tbwi:TextBoxWithImage Height="27" Margin="3" State="{Binding lockPressed}" Grid.Column="0" Grid.Row="1" /> 

誰もがこの行動に直面しましたか？助けていただければ幸いです。

Answer 1

VerticalContentAlignmentセッターを削除するか、スタイルにストレッチすることの値を設定：

<Style TargetType="tbwi:TextBoxWithImage" x:Key="TextBoxWithImageStyle"> 
    <Setter Property="Height" Value="27"></Setter> 
    <Setter Property="Margin" Value="3"></Setter> 
    <Setter Property="VerticalContentAlignment" Value="Stretch"></Setter> 
</Style> 

...そしてセンターへのユーザーコントロールにテキストボックスのVerticalContentAlignmentを設定します。

<TextBox Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" Grid.ColumnSpan="2" VerticalContentAlignment="Center"></TextBox> 

違いは、UserControlのVerticalContentAlignmentプロパティをStretch以外のものに設定した場合、UserControlのグリッドは使用できませんが、TextBoxは空き領域を埋めるために伸びることです。