0
votes

I have a rounded border around a textbox. When displaying it, the horizontal top and bottom lines of the textbox are shown despite setting "BorderThickness" property to 0 and "BorderBrush" to transparent. How can I do borders for textbox to be not shown?

Below the code:

<Border Grid.Row="0" Grid.Column="0" 
      BorderBrush="DarkBlue"          
      BorderThickness="0.8" 
      CornerRadius="5"
      Margin="5,10,3,10" 
      Height="Auto" Width="Auto" 
      Background="AliceBlue" 
      HorizontalAlignment="Left">

      <TextBox x:Name="txtSearch"
               Width="250"
               Style="{StaticResource WatermarkedTextBox}" 
               VerticalAlignment="Center" 
               HorizontalAlignment="Left"
               BorderBrush="Transparent" 
               BorderThickness="0"
               Margin="1"/>
</Border>

Any ideas why textbox borders are being displayed?

ATTEMPT #1:

I have found that the culprit is the style attached, that is the static resource WatermarkedTextBox which is as follows:

<Style x:Key="WatermarkedTextBox" TargetType="TextBox">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox">
                <Grid>
                    <TextBox Text="{Binding Text, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}" />
                    <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center"
                          Text="{TemplateBinding Tag}" 
                          Margin="5,0,5,0"
                          Foreground="#FF808080"
                          FontStyle="Italic"
                          IsHitTestVisible="False"
                          x:Name="UserMessage"
                          Visibility="Hidden"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="Text" Value=""/>
                            <Condition Property="IsKeyboardFocusWithin" Value="False"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Visibility" TargetName="UserMessage" Value="Visible"/>
                    </MultiTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

So how can I solve this?

1
Someone know why it is happening? Any help will be highly appreciated. thx.Ralph

1 Answers

0
votes

The culprit was the border of the textbox set in the style "WatermarkedTextbox" so setting BorderThickness property to 0 is working now:

<Style x:Key="WatermarkedTextBox" TargetType="TextBox">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TextBox">
                <Grid>
                    <TextBox BorderThickness="0" 
                             Text="{Binding Text, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}" />
                    <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center"
                          Text="{TemplateBinding Tag}" 
                          Margin="5,0,5,0"
                          Foreground="#FF808080"
                          FontStyle="Italic"
                          IsHitTestVisible="False"
                          x:Name="UserMessage"
                          Visibility="Hidden"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="Text" Value=""/>
                            <Condition Property="IsKeyboardFocusWithin" Value="False"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Visibility" TargetName="UserMessage" Value="Visible"/>
                    </MultiTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>