边框没有排列在TextBlock上

时间:2014-05-01 03:32:23

标签: c# wpf xaml

我正在开发一个聊天程序,我想在每一行文本中分隔一行。

这是我正在使用的XAML:

<ScrollViewer Grid.Row="0" Name="ScrollBar">
    <ListView HorizontalContentAlignment="Stretch"
              BorderThickness="0"
              IsTabStop="False"
              Name="AllItems"
              Background="#E4E4E4"
              ScrollViewer.HorizontalScrollBarVisibility="Disabled"
              PreviewMouseWheel="AllItems_PreviewMouseWheel"
              ItemsSource="{Binding Messages}">

        <ListView.ItemTemplate>
            <DataTemplate>
                <Border BorderBrush="Black"
                        BorderThickness="0, 1, 0, 0">
                    <TextBlock
                            FontSize="16"
                            TextWrapping="Wrap"
                            FontFamily="Arial"
                            Margin="0"
                            Initialized="ChatLine_Initialized"
                            VerticalAlignment="Center" />
                </Border>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</ScrollViewer>

我还以交替的颜色设置每一行的背景(这是TextBlock&#39; Initialize事件的事件处理程序):

static int s_curr;

void ChatLine_Initialized(object sender, EventArgs e)
{
    int curr = Interlocked.Increment(ref s_curr);
    if ((curr % 2) == 0)
        ((TextBlock)sender).Background = (SolidColorBrush)(new BrushConverter().ConvertFrom("#C8C8C8"));
    else
        ((TextBlock)sender).Background = (SolidColorBrush)(new BrushConverter().ConvertFrom("#E4E4E4"));
}

我遇到的问题是较暗的线条没有填满边框 例如,以下是它的呈现方式:

Lines

如何让较暗的背景填充到边界线?

2 个答案:

答案 0 :(得分:1)

删除文本块的边框并为ListBox项应用样式,这可行,

<Grid>
    <ScrollViewer Grid.Row="0" Name="ScrollBar">
        <ListView HorizontalContentAlignment="Stretch"
              BorderThickness="0"
              IsTabStop="False"
              Name="AllItems"
              Background="#E4E4E4" 
              ScrollViewer.HorizontalScrollBarVisibility="Disabled"
              ItemsSource="{Binding Messages}">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ListViewItem">
                                <Border Name="Border" BorderBrush="Black" BorderThickness="1">
                                    <ContentPresenter />
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ListView.ItemContainerStyle>
                <ListView.ItemTemplate>
               <DataTemplate>
                <TextBlock
                            FontSize="16"
                            TextWrapping="Wrap"
                            FontFamily="Arial"
                            Text="{Binding Name}"
                            Initialized="ChatLine_Initialized"
                             />                      
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </ScrollViewer>
</Grid>

<强>输出:

enter image description here

答案 1 :(得分:1)

无需在ListView中创建ScrollViewer,然后将每个备用行设置为不同的颜色。 DataGrid内置了所有这些功能。

这可以调整,但风格代表你的屏幕截图:

<DataGrid HorizontalContentAlignment="Stretch"
          BorderThickness="0"
          IsTabStop="False"
          Name="AllItems"
          ScrollViewer.HorizontalScrollBarVisibility="Disabled"
          ItemsSource="{Binding Messages}"
          AlternationCount="2"
          HeadersVisibility="None">
    <DataGrid.CellStyle>
        <Style TargetType="{x:Type DataGridCell}">
            <Setter Property="Foreground" Value="Black" />
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="{x:Null}" />
                    <Setter Property="BorderBrush" Value="{x:Null}" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </DataGrid.CellStyle>
    <DataGrid.RowStyle>
        <Style TargetType="{x:Type DataGridRow}">
            <Style.Triggers>
                <Trigger Property="AlternationIndex" Value="0">
                    <Setter Property="Background" Value="#E4E4E4" />
                </Trigger>
                <Trigger Property="AlternationIndex" Value="1">
                    <Setter Property="Background" Value="#C8C8C8" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </DataGrid.RowStyle>
</DataGrid>