Reputation: 429
Lets take this as example. I now have a total of 8 textboxes. I use a static resource style to make sure they all have the exact same styling set. But notice how some of the textboxes have a bottom border line and others don't. Why does this happen?
Here's the code
<Style x:Key="AddressTextBox" TargetType="TextBox">
<Setter Property="MinWidth" Value="230"></Setter>
<Setter Property="MaxWidth" Value="260"></Setter>
<Setter Property="MaxLength" Value="45"></Setter>
<Setter Property="Margin" Value="1"></Setter>
<Setter Property="BorderThickness" Value="1,1,1,1"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="Padding" Value="1,2,0,1"/>
<Setter Property="BorderBrush" Value="Gray"></Setter>
<Setter Property="Height" Value="20"></Setter>
</Style>
<DockPanel>
<StackPanel>
<Grid Margin="5">
<StackPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7">Postal</TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7"></TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7"></TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7"></TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
<DockPanel Height="10"></DockPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7">Street</TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7"></TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7"></TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
<DockPanel Height="Auto">
<TextBlock Width="50" Margin="7"></TextBlock>
<TextBox Style="{StaticResource AddressTextBox}"></TextBox>
</DockPanel>
</StackPanel>
</Grid>
</StackPanel>
</DockPanel>
Upvotes: 3
Views: 175
Reputation: 6316
Even though your layout is very inefficient, its not the problem as all above comments suggest. Nothing to do with SnapToDevicePixels
, Padding
, Margins
, etc. It is part of TextBox'
s control style. It seems that if you set BorderWidth
bigger than default, it sticks on all corners, but if you go below it doesn't. If you extract the TextBox
's template you can see its border and styling. So in order to "beat" this irregularity, instead of trying to sort of indirectly manipulate the TextBox
's Border
properties in your style you need to override its template. Then manipulate it's Border
directly in the Template
.
Here's a the style that will work(I plugged in your setters into it) :
<SolidColorBrush x:Key="DisabledBackgroundBrush" Color="LightGray"/>
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="Gray"/>
<SolidColorBrush x:Key="EnabledBackgroundBrush" Color="White"/>
<Style x:Key="AddressTextBox" TargetType="{x:Type TextBoxBase}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="AllowDrop" Value="true"/>
<Setter Property="MinWidth" Value="230"/>
<Setter Property="MaxWidth" Value="260"/>
<Setter Property="Margin" Value="1"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="Padding" Value="1,2,0,1"/>
<Setter Property="Height" Value="20"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBoxBase}">
<Border Name="Border" CornerRadius="2" Padding="2" Background="{StaticResource EnabledBackgroundBrush}"
BorderBrush="Gray" BorderThickness="1" >
<ScrollViewer Margin="0" x:Name="PART_ContentHost"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}"/>
<Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBackgroundBrush}"/>
<Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
also, just a tip about your layout. To minimize inefficiencies, I would use the Grid
:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock Text="Postal"/>
<TextBox Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
<TextBlock Grid.Row="1" />
<TextBox Grid.Row="1" Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
<TextBlock Grid.Row="2" />
<TextBox Grid.Row="2" Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
<TextBlock Grid.Row="3" />
<TextBox Grid.Row="3" Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
<TextBlock Grid.Row="4" Text="Street" Margin="7,10,7,7"/>
<TextBox Grid.Row="4" Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
<TextBlock Grid.Row="5"/>
<TextBox Grid.Row="5" Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
<TextBlock Grid.Row="6"/>
<TextBox Grid.Row="6" Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
<TextBlock Grid.Row="7"/>
<TextBox Grid.Row="7" Grid.Column="1" Style="{StaticResource AddressTextBox}"/>
</Grid>
Upvotes: 1