不适用Border 和 TextBlock 而用Line呢
时间: 2024-03-05 13:52:17 浏览: 18
你可以在ItemsControl.ItemTemplate中使用Line并设置Stroke和StrokeThickness属性来添加下划线。以下是示例代码:
```xml
<ItemsControl>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid>
<Line X1="0" Y1="10" X2="100" Y2="10" Stroke="Black" StrokeThickness="1"/>
<TextBlock Text="{Binding}" />
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
```
这将在ItemsControl中的每个项下方添加一条黑色线条。你可以通过调整Line的X1、Y1、X2、Y2属性和StrokeThickness属性来更改线条的位置和大小。
相关问题
我并不想去掉Border和Border的Margin属性,该怎么修改
如果你不想去掉 `Border` 控件和 `Margin` 属性,可以在 `Border` 控件的内部再添加一个 `Grid` 控件,并在 `Grid` 控件中绘制 `TextBlock` 和 `Line` 控件。以下是修改后的代码示例:
```xaml
<ItemsControl x:Class="HDSProject.Control.CustomFont"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:HDSProject.Control"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800"
x:Name="itemCtrl"
ItemsSource="{Binding Path=Title2, RelativeSource={RelativeSource Mode=Self}}"
FontSize="20" Foreground="Teal">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border Margin="{Binding Path=CharacterSpacing, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:CustomFont}}">
<Grid>
<TextBlock Text="{Binding}" Margin="0"/>
<Line X1="0" Y1="{Binding ActualHeight, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=TextBlock}}" X2="{Binding ActualWidth, ElementName=tb}" Y2="{Binding ActualHeight, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=TextBlock}}" Stroke="Teal" StrokeThickness="1"/>
</Grid>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
```
这段 XAML 代码同样会在每个 `TextBlock` 下面添加一条宽度与 `TextBlock` 相同的下划线,下划线颜色为 Teal,线条粗细为 1。`Line` 控件的位置使用了 `ActualHeight` 和 `ActualWidth` 属性来实现自适应,无需设置 `Margin` 属性。
利用Line在<ItemsControl.ItemTemplate> <DataTemplate> <Border Margin="{Binding Path=CharacterSpacing, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:CustomFont}}"> <TextBlock Text="{Binding}" /> <!--<Border.Style> <Style TargetType="Border"> <Setter Property="BorderThickness" Value="0"/> <Style.Triggers> <DataTrigger Binding="{Binding ShowUnderline, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:CustomFont}}" Value="True"> <Setter Property="BorderThickness" Value="0 0 0 1"/> </DataTrigger> </Style.Triggers> </Style> </Border.Style> <Border.BorderBrush> <SolidColorBrush Color="{Binding Foreground.Color, ElementName=itemCtrl}" /> </Border.BorderBrush>--> </Border> </DataTemplate>的Border外画一条下划线
您可以将下划线添加到Border的底部,使用一个Border或Rectangle元素,同时设置其高度和背景颜色。例如,您可以将下面的代码添加到Border的下面:
```
<Border Margin="{Binding Path=CharacterSpacing, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:CustomFont}}">
<TextBlock Text="{Binding}" />
</Border>
<Rectangle Height="1" Fill="Gray" Margin="0,0,0,5" />
```
这将添加一个灰色的下划线,高度为1像素,与Border底部的间距为5像素。您可以根据需要调整颜色、高度和间距。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)