Panel with percentage coordinates

Question

I would like to use a panel whose children have the coordinates given as a percentage of the total width / height of the panel. In addition, I should be able to animate the coordinate property, for example, to make the button move from 10% to 50% of the width of the panel.

I made two attempts:

• Use the grid and specify the size as stars - this was not enough, because AFAIK, by default, WPF cannot animate the distance properties set by the stars. I found somewhere a custom class that allowed me to do this, it even worked, I think this solution is too complicated, I'm looking for something simpler.

• Use a Canvas with a fixed width and height and place it in the viewport - this is a simple solution, but when you resize the View window, the size of the Canvas content also changes. I want the content to have a fixed size.

Is there a simple solution or should I implement my own panel (or, possibly, expand one of the existing ones, i.e. Canvas)?

Hooray!

Answer 1

I'd:

• subclass Canvas, possibly naming it RelativeCanvasorRatioCanvas
• add two attached properties: XRatioandYRatio
• ArrangeOverride . XRatio YRatio ActualWidth ActualHeight RelativeCanvas Canvas.Left Canvas.Top

:

<local:RelativeCanvas>
    <!-- the top-left of this button will be center of panel -->
    <Button local:RelativeCanvas.XRatio="50" local:RelativeCanvas.YRatio="50"/>
</local:RelativeCanvas>

, , , , , - . , , .

Answer 2

: WPF