在avalonEdit上显示边框:TextEditor

时间:2015-04-21 12:21:17

标签: c# wpf xaml avalonedit

我正在尝试在Wpf控件中显示avalonEdit'框'周围的边框,但似乎无法实现。

我添加了BorderBrush="Black" BorderThickness="2"但显然我遗漏了一些东西。

我用谷歌搜索了,但是,尽管我的努力,我找不到任何东西 - 我怀疑我可能不知道谷歌的正确术语,因为它感觉它应该是直截了当的!

代码如下:

    

    <Label Content="Account:" HorizontalAlignment="Left" Margin="10,28,0,0" VerticalAlignment="Top"/>
    <TextBox Name ="textBoxAccount" HorizontalAlignment="Left" Height="23" Margin="66,28,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="120"/>
    <Label Content="Query:" HorizontalAlignment="Left" Margin="10,59,0,0" VerticalAlignment="Top"/>

    <Button x:Name="btnGo" Content="Go!" HorizontalAlignment="Left" Height="25" Margin="10,342,0,0" VerticalAlignment="Top" Width="146"/>

    <avalonEdit:TextEditor
        xmlns:avalonEdit="http://icsharpcode.net/sharpdevelop/avalonedit"
        x:Name="textEditor"
        FontFamily="Consolas"
        SyntaxHighlighting="AWQL"
        ScrollViewer.VerticalScrollBarVisibility="Hidden"
        WordWrap="True"
        Visibility="Visible"
        BorderBrush="Black" BorderThickness="2"
        FontSize="10pt" Margin="12,89.96,10,0" Height="229" VerticalAlignment="Top"/>
</Grid>

呈现如下:

enter image description here

但'avalonEdit'框似乎没有呈现边框,因此看起来不可见,除非/直到用户点击它并开始输入。

我真的希望边框看起来与用户控件顶部的简单文本框相同,但现在我已经满足于任何可见的东西了!

3 个答案:

答案 0 :(得分:4)

我之前只与avalon合作过一次,因此我制作了一个快速的项目,可以满足您的需求。

作为免责声明,AvalonEdit似乎破坏了任何试图像你说的那样围绕它的边界。所以我使用网格设置它以围绕它设置边框。

看起来像这样:

Bordered Avalon Edit

代码看起来像这样:

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Width="600" Height="500"
    xmlns:avalonEdit="http://icsharpcode.net/sharpdevelop/avalonedit">
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>

    <Label Grid.Column="0" Grid.Row="0" Content="Account:" HorizontalAlignment="Left" Margin="20,20" VerticalAlignment="Top" Height="26" Width="56" />
    <TextBox Grid.Column="1" Grid.Row="0" Name="textBoxAccount" HorizontalAlignment="Left" Height="26" Margin="20" TextWrapping="Wrap"
             VerticalAlignment="Top" Width="120" />
    <Label Grid.Column="0" Grid.Row="1" Content="Query:" HorizontalAlignment="Left" Margin="20,0" VerticalAlignment="Top" Height="26" Width="45" />

    <Border Grid.ColumnSpan="2"
            Grid.Row="2"
            Grid.Column="0" BorderBrush="Black" BorderThickness="1"
            Margin="20"
            Height="230">
        <avalonEdit:TextEditor
            x:Name="textEditor"
            FontFamily="Consolas"
            SyntaxHighlighting="AWQL"
            ScrollViewer.VerticalScrollBarVisibility="Hidden"
            WordWrap="True"
            Visibility="Visible"
            FontSize="10pt" VerticalAlignment="Top" Height="226"/>
    </Border>


    <Button Grid.Column="0" Grid.Row="3" x:Name="btnGo" Content="Go!" HorizontalAlignment="Left" Height="25" Margin="20"
            VerticalAlignment="Top" Width="146" />

</Grid>

这不是您想要的,但从长远来看,网格也有助于解决其他问题

答案 1 :(得分:4)

这是avalonEdit:TextEditor样式(TextEditor.xaml):

<Style TargetType="{x:Type AvalonEdit:TextEditor}">
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.WindowTextBrushKey}}" />
    <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}" />
    <Setter Property="FlowDirection" Value="LeftToRight"/> <!-- AvalonEdit does not support RTL, so ensure we use LTR by default -->
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type AvalonEdit:TextEditor}">
                <ScrollViewer
                    Focusable="False"
                    Name="PART_ScrollViewer"
                    CanContentScroll="True"
                    VerticalScrollBarVisibility="{TemplateBinding VerticalScrollBarVisibility}"
                    HorizontalScrollBarVisibility="{TemplateBinding HorizontalScrollBarVisibility}"
                    Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TextArea}"
                    VerticalContentAlignment="Top"
                    HorizontalContentAlignment="Left"
                    Background="{TemplateBinding Background}"
                    Padding="{TemplateBinding Padding}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                />
                <ControlTemplate.Triggers>
                    <Trigger Property="WordWrap"
                             Value="True">
                        <Setter TargetName="PART_ScrollViewer"
                                Property="HorizontalScrollBarVisibility"
                                Value="Disabled" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这是关于为什么ScrollViewer不显示边框的解释:https://social.msdn.microsoft.com/Forums/vstudio/en-US/a2310302-167b-44e2-bc23-825ff1610701/scrollviewer-border

所以,我认为最好的方法是将TextEditor包装在Border Guerudo says内,或者在Avalon代码TextEditor.xaml中修改模板。

答案 2 :(得分:2)

我没有使用avalonEdit,但我可以用另一种方式建议你:你可以将TextEditor包裹在<Border> </Border>内。

它可能不是最好的解决方案,但却是一个。