Question

我在一个Grid中有一个Border，它显示在ChildWindow中。我需要使Border更大，所以我应用了RenderTransform。然而，ChildWindow并没有扩展到适合缩放的边界。看起来在应用渲染变换之前计算大小。这意味着边框现在被裁剪，我只能看到它的1/4。

我尝试在ScrollViewer和ViewBox中包装Border，但这些都没有用。

<Grid>
    ...
    <Border x:Name="Border"
            Grid.Row="3"
            Grid.ColumnSpan="2"
            Background="White"
            BorderBrush="Black"
            BorderThickness="1"
            CornerRadius="5"
            VerticalAlignment="Top"
            Height="{Binding NewLabelTemplate.Height}"
            Width="{Binding NewLabelTemplate.Width}">
        <Border.RenderTransform>
            <ScaleTransform CenterX="0.5"
                            CenterY="0.5"
                            ScaleX="2"
                            ScaleY="2"/>
        </Border.RenderTransform>
        ...
    </Border>
    ...
</Grid>

如何在计算尺寸时让ChildWindow使用边框的最终尺寸？

我无法将比例应用于ChildWindow或直接使用边框的渲染高度和宽度，因为网格中还有其他我想要缩放的元素。

Answer 1

目前我可以想到两种可能的解决方案：

<强> 1。计算边框的缩放属性以绑定到

<Grid>
    <Grid.Resources>
        <ScaledSizeProperties x:Key="BorderSizes"
            ScaleFactor="2"
            BorderThickness="1"
            CornerRadius="5"
            Height="{Binding NewLabelTemplate.Height}"
            Width="{Binding NewLabelTemplate.Width}"/>
    </Grid.Resources>
    ...
    <Border x:Name="Border"
        Grid.Row="3"
        Grid.ColumnSpan="2"
        Background="White"
        BorderBrush="Black"
        VerticalAlignment="Top"
        BorderThickness="{Binding
            Path=ScaledBorderThickness, Source={StaticResource BorderSizes}}"
        CornerRadius="{Binding
            Path=ScaledCornerRadius, Source={StaticResource BorderSizes}}"
        Height="{Binding
            Path=ScaledHeight, Source={StaticResource BorderSizes}}"
        Width="{Binding
            Path=ScaledWidth, Source={StaticResource BorderSizes}}">
        ...
    </Border>
    ...
</Grid>

和代码：

public class ScaledSizeProperties : DependencyObject
{
    //add input DependencyProperties for:
    //double ScaleFactor
    //double BorderThickness
    //double CornerRadius
    //double Height
    //double Width

    //add output DependencyProperties for:
    //double ScaledBorderThickness
    //double ScaledCornerRadius
    //double ScaledHeight
    //double ScaledWidth

    public double ScaleFactor
    {
        get { return (double) GetValue( ScaleFactorProperty ); }
        set { SetValue( ScaleFactorProperty, value ); }
    }

    public static readonly DependencyProperty ScaleFactorProperty =
        DependencyProperty.Register( "ScaleFactor", typeof( double ),
        typeof( ScaledSizeProperties ),
        new PropertyMetadata( 1, OnScaleFactorChanged ) );

    private static void OnScaleFactorChanged(DependencyObject d,
        DependencyPropertyChangedEventArgs e)
    {
        //recalculate all size properties
    }

    public double Height
    {
        get ...
        set ...
    }

    ... DependencyProperty HeightProperty ... OnHeightChanged ...

    private static void OnHeightChanged(DependencyObject d,
        DependencyPropertyChangedEventArgs e)
    {
        //recalculate ScaledHeight
    }
}

<强> 2。使用LayoutTransformer而不是RenderTransform

作为Toolkit一部分的LayoutTransformer现在（自SL5起）是Silverlight基础库包的官方部分。

<Grid>
...
<LayoutTransformer
    Grid.Row="3"
    Grid.ColumnSpan="2"
    VerticalAlignment="Top">
    <LayoutTransformer.LayoutTransform>
        <ScaleTransform CenterX="0.5"
                        CenterY="0.5"
                        ScaleX="2"
                        ScaleY="2"/>
    </LayoutTransformer.LayoutTransform>
    <Border x:Name="Border"
        Background="White"
        BorderBrush="Black"
        BorderThickness="1"
        CornerRadius="5"
        Height="{Binding NewLabelTemplate.Height}"
        Width="{Binding NewLabelTemplate.Width}">
        ...
    </Border>
</LayoutTransformer>
...
</Grid>

视图不会扩展以适合缩放的边框

1 个答案: