locked
UIElement not rendered completly when using RenderTransform

    Question

  • Hi,

    I would like to place a UIElement within another where the inner Element uses a RenderTransform to adjust its size. The problem is, that the inner element is not rendered completely. Only the part that original fit into the outer element is visible.

    Example:
    The outer Element is a Grid with a Size of 100 x 200 pixels. The inner element is also a Grid with a Size of 200 x 200 pixels. If no transform is used only the upper half of the inner grid is visible because the lower part lies outside the bounds of the outer grid. This is not surprising.

    If RenderTransform is applied to the inner Grid with a 0.5 scale the actual size should be 100 x 100 pixels. But only the upper half of 100 x 50 pixels is dawn. It looks like the lower part is ignored because it was not visible before applying the transform. This does not make a lot of sense: When I use a transformation to scale a larger element to fit into a smaller element I expect the complete element to be visible.

    <Grid Background="Green" Width="200" Height="100">
        <Grid Background="Yellow" Width="200" Height="200">
            <Grid.RenderTransform>
                <CompositeTransform ScaleX="0.5" ScaleY="0.5"/>
            </Grid.RenderTransform>
        </Grid>
    </Grid>
    How can this be solved?

    Thursday, March 20, 2014 10:35 AM

Answers

  • change the first grid to an canvas?

    Microsoft Certified Solutions Developer - Windows Store Apps Using C#

    • Marked as answer by Agenor Thursday, March 20, 2014 12:46 PM
    Thursday, March 20, 2014 11:08 AM

All replies

  • change the first grid to an canvas?

    Microsoft Certified Solutions Developer - Windows Store Apps Using C#

    • Marked as answer by Agenor Thursday, March 20, 2014 12:46 PM
    Thursday, March 20, 2014 11:08 AM
  • This works pefectly, thank you very much! Any idea why this does not work when a Grid is used?
    • Edited by Agenor Thursday, March 20, 2014 12:48 PM
    Thursday, March 20, 2014 12:47 PM
  • because render transform is applied very late in the pipeline and the grid is already getting clipped in it.. not sure how to override that. i tried to change clipping zone but that didnt solved it

    Microsoft Certified Solutions Developer - Windows Store Apps Using C#

    Thursday, March 20, 2014 12:49 PM