【问题标题】:Rounded Corners on Canvas dissappear when Element is dragged to the border将元素拖到边框时,画布上的圆角消失
【发布时间】:2011-10-22 11:11:55
【问题描述】:

我有这个代码:

    <Window x:Class="WpfApplication8.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>
        <ScrollViewer Background="#FFADB9CD"  >
            <Grid>
                <Border Name="mask" Height="{Binding ElementName=cnvsEtikett, Path=Height}" Width="{Binding ElementName=cnvsEtikett, Path=Width}" Background="White" CornerRadius="6"/>
                <Canvas Height="100" Name="cnvsEtikett" Width="200" Background="White" ClipToBounds="True">
                    <Canvas.OpacityMask>
                        <VisualBrush Visual="{Binding ElementName=mask}" />
                    </Canvas.OpacityMask>
                    <TextBlock Height="23.2"  Text="TextBlock" Canvas.Left="63" Canvas.Top="41" />
                </Canvas>
            </Grid>
        </ScrollViewer>
    </Grid>
</Window>

我希望画布具有圆角,直到我将文本块拖动到任一侧为止。然后角落消失。这是我程序中窗口的简单重新创建,在那里我使用拖放操作来移动文本块。我真的需要那些圆角,但我完全不知道如何解决这个问题!

有什么想法吗??

编辑:当文本块移动到边缘时,画布似乎被拉伸了(因为角半径也发生了变化!)

【问题讨论】:

  • 这只是一个范围,所以我什至不打算将其发布为答案。也许尝试给 TextBlock 一个边距。边距可能是透明的,并且会阻止不透明的内容到达边界。但由于半径发生变化,我认为这不会奏效。但是很容易尝试。或者我会尝试将高度和宽度放在网格列和行上,然后将边框放在具有拉伸高度和宽度的行列中。再次,只是要尝试的事情。

标签: wpf canvas drag-and-drop border rounded-corners


【解决方案1】:

刚刚想到另一个解决方案..

<Border ClipToBounds="True" CornerRadius="6" Background="White" Name="brdEtikett" Height="200" Width="200" >
    <Canvas Name="cnvsEtikett" Background="Transparent"  />
</Border>

在画布上将边框的背景设置为你想要的颜色,并使画布透明!!

这样您就不必在元素上放置填充或边距!

【讨论】:

  • 在什么方面(除了命中测试)与我上面提出的解决方案不同?我知道你在画布上没有边距,我放一个边距的唯一原因是因为你说你不希望画布与圆角的边框重叠(你的解决方案中的画布就是这样)。跨度>
【解决方案2】:

最好的办法可能是将画布放在边框内(我通常在圆角边框内的面板上放置一个小边距,以防止东西伸出)。这样,边框会像画布一样自动扩展或收缩(前提是设置为自动高度宽度)。

Border 可以有一个单独的内容子项,在这种情况下是具有自己内容的 Canvas。

编辑

这不是达到同样的目的吗?

    <Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" x:Class="WpfApplication8.MainWindow"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <ScrollViewer Background="#FFADB9CD"  >
            <Grid>
                <Border x:Name="mask" Background="White" CornerRadius="6" HorizontalAlignment="Center" VerticalAlignment="Center">
                    <Canvas Height="100" x:Name="cnvsEtikett" Width="200" ClipToBounds="True" d:LayoutOverrides="Margin">
                        <TextBlock Height="23.2"  Text="TextBlock" Canvas.Left="59" Canvas.Top="31" />
                    </Canvas>
                </Border>
            </Grid>
        </ScrollViewer>
    </Grid>
</Window>

Gong Solutions Drag Drop Helper library

【讨论】:

  • 这样画布的角会伸出边框的圆角!这就是我使用不透明蒙版的方式
  • 那么你想让画布延伸到边框的角落吗?以上不是达到同样的目的吗?
  • 不,那是我不希望他们做的,我想要一个圆角的画布:)
  • 那么,如果你将画布放在边框内,并在四周放置 3 或 4 的边距,则它们都不会突出。
  • 是的,必须这样做..这不是一个完美的解决方案,因为这样我必须将边框的填充添加到每个拖放操作的坐标中,但至少角落现在看起来不错.谢谢!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2022-10-07
  • 2012-06-30
  • 2013-04-18
  • 2016-10-13
  • 2011-10-05
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多