Search code examples
wpfsilverlightpathcontrolsrubber

WPF: rubber multipath controls interface


I have a card component with (see below). And this component has a some paths inside and Canvas. But they have not rubber (when you place it into the Silverlight page).

How to do it rubber if possibly ?

The sample of queen of heart you can find here: https://docs.google.com/file/d/0B8AVeqop_fkjOFpGZUFvbTE3ejQ/edit?usp=sharing


Solution

  • You can use a Viewbox : Put all Path inside Grid with good Height Width, Margin values and put grid inside Viewbox :

    <Viewbox>
        <Grid Height="250.246002197266" Width="179.378997802734">
            <Path Data="F1M8 ... 398z" Fill="White" Stroke="Black" StrokeThickness="0.797" StrokeMiterLimit="4"/>
            <Path Margin="24.008,19.949,23.562,20.618" Fill="#FF131F67"  Data="F1M130...207.687z"/>
            <Path Margin="26.852,21.476,26.825,22.004" Data="F1M11.39....758z" Fill="#FFE2CF00" />
            <Path Margin="4.65,8.681,4.65,8.679" Data="F1M15...5.584z" Fill="#FFD40000" />
            <Path Margin="25.367,21.05,25.187,21.582" Data="F1M80....205.543z" Fill="Black" />
        </Grid>
    </Viewbox>
    

    How to find Margin of path and Width/Height of canvas :

    1. In blend, select the 5 canvas ;
    2. Right click -> "Group Into" -> "Grid"