Question

我有一个包含椭圆的用户控件。椭圆被平移转换为右边，直到它部分位于其父控件之外。

我将用户控件放入3列网格的中间列。

如果我将列宽设置为GridUnitType.Auto，我可以看到椭圆溢出列。如果我将列宽设置为GridUnitType.Star，则椭圆仍会溢出列，但现在会将其剪切为列宽。

我需要使用GridUnitType.Star均匀分布列宽，但不希望剪切任何已转换的内容。

我在下面提供了示例代码。任何帮助将不胜感激。

UserControl（包含椭圆）

<UserControl
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="GridWidthTest.UserControl1">

<Grid x:Name="LayoutRoot" Background="Green">
    <Ellipse Fill="#FFF40404" Stroke="Black" Grid.Column="1" Width="400" Height="400" RenderTransformOrigin="0.5,0.5">
        <Ellipse.RenderTransform>
            <TransformGroup>
                <TranslateTransform X="200"/>
            </TransformGroup>
        </Ellipse.RenderTransform>
    </Ellipse>          
</Grid>

父控件（包含网格）

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:GridWidthTest" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
x:Class="GridWidthTest.MainPage"
Width="640" Height="480" mc:Ignorable="d">

<Grid x:Name="LayoutRoot" Background="White">

    <Grid ShowGridLines="True">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>           

        <local:UserControl1 Grid.Column="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>             
    </Grid>         
</Grid>

Answer 1

感谢您的回复。

我现在通过将椭圆包裹在画布中解决了这个问题，这意味着它不会被剪裁。

Answer 2

这是一个非常棘手的难题。首先，了解RenderTransform实际上做了什么很重要。它会转换呈现的内容。基于最终相当简单的矩阵计算，每个像素被移动到新位置。这在整个渲染过程中发生得相当晚。在应用变换之前，椭圆已经被剪切。

布局引擎经历两个阶段，测量，其中元素争夺他们的首选条件（椭圆需要400 x 400框渲染）然后安排他们的容器告诉他们实际拥有的东西。

在列宽为“自动”的情况下，Grid在测量阶段期间为宽度为400的框产生UserControl请求。椭圆呈现没有任何剪裁，因为框是足够大然后 RenderTransform将结果转换为新位置。

在列宽为“*”的情况下，Grid只会给UserControl一个宽度框，该宽度由该列的可用宽度份额确定，即使它小于{{1}所需的宽度。在这种情况下，椭圆呈现但必须剪切到指定框的边框。它的然后表示这个剪切的椭圆被转换为一个新的位置。

为了能够突破给定的框，元素可以指定负边距。这将导致渲染一个更大的框。例如，如果容器指示宽度仅为200但UserControl具有-100边距，则渲染的实际框为400像素宽。

让这个按预期工作，同时支持动态安排内容可能是一些试错练习。

当父列宽度设置为GridUnitType.Star时，Silverlight剪辑UserControl

2 个答案: