如何使用虚线边框或双线边框创建文本框

时间:2012-11-27 23:50:45

标签: c# wpf xaml

如何在XAML或C#代码中创建以下两个文本框(非矩形)

Textboxes with border http://imageshack.us/a/img27/3186/dashedborder.png

2 个答案:

答案 0 :(得分:9)

您可以使用矩形来创建“Dash”样式

<Window x:Class="WpfApplication5.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TextBlock Width="200" Height="40" Name="Textblock1" Text="Hello World!" TextAlignment="Center" FontSize="20"/>
        <Rectangle Width="{Binding ElementName=Textblock1, Path=ActualWidth}" Height="{Binding ElementName=Textblock1, Path=ActualHeight}" StrokeDashArray="0.0 6.0 0.0" Stroke="Black" StrokeThickness="2"  />
    </Grid>
</Window>

enter image description here

对于双线,您可以创建2个边框

<Window x:Class="WpfApplication5.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Border BorderBrush="Black" Width="200" Height="40" BorderThickness="1">
            <Border BorderBrush="Black" Margin="2" BorderThickness="1">
                <TextBlock  Name="Textblock1" Text="Hello World!" TextAlignment="Center" FontSize="20"/>
            </Border>
        </Border>
    </Grid>
</Window>

enter image description here

答案 1 :(得分:4)

您应该使用Blend编辑文本框的控件模板。我为你做了双人床。

 <Style x:Key="DashedTextBoxStyle" BasedOn="{x:Null}" TargetType="{x:Type TextBox}">
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Padding" Value="1"/>
        <Setter Property="AllowDrop" Value="true"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
        <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TextBox}">
                    <Border BorderBrush="Black" BorderThickness=".5">
                         <Border BorderBrush="Black" Margin="1" BorderThickness=".5">
                                <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                    </Border>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <MultiTrigger>
                <MultiTrigger.Conditions>
                    <Condition Property="IsInactiveSelectionHighlightEnabled" Value="true"/>
                    <Condition Property="IsSelectionActive" Value="false"/>
                </MultiTrigger.Conditions>
                <Setter Property="SelectionBrush" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}"/>
            </MultiTrigger>
        </Style.Triggers>
    </Style>

并将其应用于文本框,如。

<TextBox Text="Hello world" Width="100" Height="30.667" Canvas.Left="150" Canvas.Top="90" Style="{DynamicResource DashedTextBoxStyle}"/>

您可能需要对其进行自定义以获得更好的外观。我也从样式中删除了默认边框。

你可以为你的虚线做同样的事。

希望它有所帮助。