文本块边距导致文本越界
Textblock margin causes out of bounds text
我目前正在尝试创建一个具有滚动文本(从左到右和从右到左)的可视化组件 - 几乎是一个 html 选取框。
我有一个分成几列和几行的网格,我想将我的组件放在其中一个网格槽中。
网格(命名为 UIGrid)是这样生成的:
for (int i = 0; i < xDivisions; i++)
{
ColumnDefinition newColumn = new ColumnDefinition();
UIGrid.ColumnDefinitions.Add(newColumn);
}
for (int i = 0; i < yDivisions; i++)
{
RowDefinition newRow = new RowDefinition();
UIGrid.RowDefinitions.Add(newRow);
}
我要添加的组件只是一个带有子文本块的边框。我像这样将边框放在网格内:
border = new Border();
Grid.SetColumn(border, xPosition);
Grid.SetRow(border, yPosition);
textBlock = new TextBlock();
border.Child = textBlock;
textBlock.Text = "Scrolling text from left to right";
UIGrid.Children.Add(border);
我正在使用计时器来增加文本块边距,这是计时器回调的简化正文:
textBlock.Measure(new Size(double.PositiveInfinity, double.PositiveInfinity));
double textWidth = textBlock.DesiredSize.Width;
double visibleWidth = componentBase.ActualWidth;
double targetMargin = textWidth < visibleWidth ? visibleWidth : textWidth;
if (margin.Left == targetMargin)
{
margin.Left = -textWidth;
} else
{
margin.Left++;
}
当文本从左向右滑动时,它表现得很好:
https://s10.postimg.org/p0nt7vl09/text_good.png
文本 "leaving" 网格槽已隐藏。
但是,当我将文本块的边距设置为负数时,它可能会从左侧返回到可视区域内,即使文本位于其分配的插槽之外,它也是可见的:
https://s10.postimg.org/pownqtjq1/text_bad.png
我试过使用内边距代替,但我无法设置负内边距。我尝试了一些其他的东西,但我觉得我遇到了障碍。
我该怎么做才能获得漂亮的滚动文本?
如果您想要很好地滚动文本,ListView 可能是更好的选择。它是动态的,您可以将它绑定到您的对象。这需要很多猜测才能解决。
Ed Plunkett 使用 Clip 属性 引导我朝着正确的方向前进。这个想法是这样做的:
border.Clip = new RectangleGeometry
{
Rect = new Rect(0, 0, border.ActualWidth, border.ActualHeight)
};
当然,如果边框还没有渲染,那是行不通的(当然,当我的代码是 运行 时,它就不会)。您可以使用 'Measure' 强制进行测量,就像我以像素为单位测量文本长度所做的那样,但它在我的边框上表现得很奇怪。我根本不会得到正确的尺寸。
最后我干脆订阅了border的SizeChanged事件:
border.SizeChanged += OnSizeComputed;
触发该事件后,我使用 ActualWidth 和 ActualHeight 创建 RectangleGeometry。
我目前正在尝试创建一个具有滚动文本(从左到右和从右到左)的可视化组件 - 几乎是一个 html 选取框。
我有一个分成几列和几行的网格,我想将我的组件放在其中一个网格槽中。
网格(命名为 UIGrid)是这样生成的:
for (int i = 0; i < xDivisions; i++)
{
ColumnDefinition newColumn = new ColumnDefinition();
UIGrid.ColumnDefinitions.Add(newColumn);
}
for (int i = 0; i < yDivisions; i++)
{
RowDefinition newRow = new RowDefinition();
UIGrid.RowDefinitions.Add(newRow);
}
我要添加的组件只是一个带有子文本块的边框。我像这样将边框放在网格内:
border = new Border();
Grid.SetColumn(border, xPosition);
Grid.SetRow(border, yPosition);
textBlock = new TextBlock();
border.Child = textBlock;
textBlock.Text = "Scrolling text from left to right";
UIGrid.Children.Add(border);
我正在使用计时器来增加文本块边距,这是计时器回调的简化正文:
textBlock.Measure(new Size(double.PositiveInfinity, double.PositiveInfinity));
double textWidth = textBlock.DesiredSize.Width;
double visibleWidth = componentBase.ActualWidth;
double targetMargin = textWidth < visibleWidth ? visibleWidth : textWidth;
if (margin.Left == targetMargin)
{
margin.Left = -textWidth;
} else
{
margin.Left++;
}
当文本从左向右滑动时,它表现得很好: https://s10.postimg.org/p0nt7vl09/text_good.png 文本 "leaving" 网格槽已隐藏。
但是,当我将文本块的边距设置为负数时,它可能会从左侧返回到可视区域内,即使文本位于其分配的插槽之外,它也是可见的: https://s10.postimg.org/pownqtjq1/text_bad.png
我试过使用内边距代替,但我无法设置负内边距。我尝试了一些其他的东西,但我觉得我遇到了障碍。
我该怎么做才能获得漂亮的滚动文本?
如果您想要很好地滚动文本,ListView 可能是更好的选择。它是动态的,您可以将它绑定到您的对象。这需要很多猜测才能解决。
Ed Plunkett 使用 Clip 属性 引导我朝着正确的方向前进。这个想法是这样做的:
border.Clip = new RectangleGeometry
{
Rect = new Rect(0, 0, border.ActualWidth, border.ActualHeight)
};
当然,如果边框还没有渲染,那是行不通的(当然,当我的代码是 运行 时,它就不会)。您可以使用 'Measure' 强制进行测量,就像我以像素为单位测量文本长度所做的那样,但它在我的边框上表现得很奇怪。我根本不会得到正确的尺寸。
最后我干脆订阅了border的SizeChanged事件:
border.SizeChanged += OnSizeComputed;
触发该事件后,我使用 ActualWidth 和 ActualHeight 创建 RectangleGeometry。