【问题标题】:Simple (I think) Horizontal Line in WPF?WPF中的简单(我认为)水平线?
【发布时间】:2011-01-19 20:59:40
【问题描述】:

创建一个相对简单的数据输入表单,并且只想用一条水平线(与 HTML 中的 HR 标签不同)分隔某些部分,从而延伸整个表单的长度。

我试过这个:

<Line Stretch="Fill" Stroke="Black" X2="1"/>

因为父控件不是固定宽度,这条线导致窗口拉伸到全屏宽度。

有没有一种简单的方法可以在不固定我的父控件/窗口的宽度的情况下做到这一点?

【问题讨论】:

标签: wpf xaml wpf-controls


【解决方案1】:

如何将其添加到您的 xaml:

<Separator/>

【讨论】:

  • 出色的解决方案和一个标签!
  • 我不明白这是一个解决方案。我添加了一个分隔符,但没有看到任何行。将分隔符放置在标准布局面板(如 Grid)中以使其像水平线一样显示时,需要进行哪些配置?
  • 当分隔符没有显示时,我添加了高度和背景颜色。
  • @jpierson 如果将其添加到网格中,您可能需要像任何其他控件一样将其分配给行和列。否则它可能会出现在第一行/列中,你会错过它。 (它可以在 StackPanel 上正常工作。)
  • 请注意屏幕阅读器会大声读出&lt;Separator/&gt;。如果 &lt;Separator/&gt; 用于实际分隔 UI 中的项目组,这是一个完美的解决方案。如果使用 line 纯粹是出于审美原因,我建议改用 &lt;Line/&gt;&lt;Rectangle/&gt;
【解决方案2】:

我遇到了同样的问题,最终选择使用 Rectangle 元素:

&lt;Rectangle HorizontalAlignment="Stretch" Fill="Blue" Height="4"/&gt;

在我看来,修改/形状比分隔符更容易。 当然,Separator 对于简单的分离来说是一个非常简单和简洁的解决方案:)

【讨论】:

  • 适用于 Silverlight 5,而 Seperator 不适用。
【解决方案3】:

使用高度为 1 的边框并且不设置宽度(即 Width = Auto,Horizo​​ntalAlignment = Stretch,默认值)

【讨论】:

  • 垂直分隔符还是很方便的:&lt;Border Width="1" Margin="2" Background="#8888"/&gt;
【解决方案4】:

对于其他为此苦苦挣扎的人:Qwertie's comment 对我来说效果很好。

<Border Width="1" Margin="2" Background="#8888"/>

这会创建一个垂直分隔符,您可以根据自己的需要进行调整。

【讨论】:

    【解决方案5】:
    To draw Horizontal 
    ************************    
    <Rectangle  HorizontalAlignment="Stretch"  VerticalAlignment="Center" Fill="DarkCyan" Height="4"/>
    
    To draw vertical 
    *******************
     <Rectangle  HorizontalAlignment="Stretch" VerticalAlignment="Center" Fill="DarkCyan" Height="4" Width="Auto" >
            <Rectangle.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="90"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Rectangle.RenderTransform>
        </Rectangle>
    

    【讨论】:

    • 为什么不这样做呢? &lt;Rectangle VerticalAlignment="Stretch" HorizontalAlignment="Center" Fill="DarkCyan" Width="4"/&gt;
    猜你喜欢
    • 2012-08-18
    • 2021-12-28
    • 2015-02-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多