Переместить автоматически созданные пользовательские пути XAML в верхний левый угол?

Question

Я не уверен, что лучший способ сделать это ... Я создал несколько 'иконок', используя инструменты suck как Inkscape, а затем сохранил их как файлы XAML. Для примера найдите код в конце поста.

Проблема в том, что, если я помещаю эти элементы в свое приложение, они не отображаются в левом верхнем углу холста, и я не могу заставить Inkscape сохранить его там (когда он в конечном итоге сохранится правильно).

Есть ли простой способ заставить все мои пользовательские полотна / дорожки xaml начинаться в верхнем левом углу, не меняя все координаты, поскольку они могут быть довольно сложными и запутанными ...

<?xml version="1.0" encoding="UTF-8"?>
<Canvas     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
            Name="svg2" 
            Width="744.09448819" 
            Height="1052.3622047">
    <Canvas.Resources/>
    <Canvas Name="layer1">
        <Path xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
                Name="path2527" 
                Fill="#000000" 
                Data="M 124.57143 280.5848 
                        C 11.688854 257.94335 13.010144 92.855956 126.2267 73.767996 
                        C 136.54132 72.028986 139.57845 55.076466 129.57538 55.076466 
                        C 124.50146 55.076466 124.50146 55.076466 124.78645 44.826466 
                        C 125.07143 34.576466 125.07143 34.576466 143.82143 34.304396 
                        C 162.57143 34.032336 162.57143 34.032336 162.57143 44.554406 
                        C 162.57143 55.076466 162.57143 55.076466 158.07143 55.076466 
                        C 149.91303 55.076466 151.22222 72.552346 159.45035 73.483256 
                        C 172.00506 74.903666 188.51464 81.047016 199.44208 88.364526 
                        C 206.81274 93.300246 206.81274 93.300246 217.19163 82.956666 
                        C 227.57053 72.613096 227.57053 72.613096 237.57098 82.576016 
                        C 249.65906 94.618746 249.65278 92.540446 237.63732 104.51083 
                        C 227.70321 114.40766 227.70321 114.40766 230.73475 118.81385 
                        C 282.21093 193.63191 213.44867 298.41137 124.57143 280.5848 z 
                        M 165.13275 259.10241 C 211.76596 247.42014 241.46874 194.32531 225.28586 151.57647 
                        C 197.66068 78.601586 100.64894 72.395856 67.053854 141.45456 
                        C 36.048994 205.18873 95.530924 276.53864 165.13275 259.10241 z"/>
        </Canvas>
    </Canvas>

EDIT

XAML из моего приложения

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       Background="Black">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
               <!-- Text Content -->
        <Viewbox Grid.Column="1" Grid.Row="0" Grid.RowSpan="3" Stretch="Fill">
            <TextBlock VerticalAlignment="Center" HorizontalAlignment="Stretch" Text="" Foreground="{Binding Path=ForegroundColour, UpdateSourceTrigger=PropertyChanged}" FontWeight="UltraBlack">
                <TextBlock.BitmapEffect>
                    <OuterGlowBitmapEffect GlowColor="LightGray" GlowSize="1"/>
                </TextBlock.BitmapEffect>
            </TextBlock>
        </Viewbox>
        <!-- Clock Button -->
        <StackPanel x:Name="clockCanvas" Grid.Column="0" Grid.Row="0">
            <Canvas>
                <Path Fill="White" Data="M 80.585224 169.88705 C 56.848634 164.45281 37.130464 149.09974 26.612084 127.86218 C 20.776944 116.08051 19.042194 109.26026 18.411614 95.621693 C 17.742034 81.139423 20.281694 69.295703 26.900484 56.033923 C 30.763404 48.293953 33.052344 45.284343 41.563214 36.754743 C 50.357724 27.940853 52.863904 26.058063 61.145654 22.043263 C 73.472574 16.067443 80.302404 14.275203 93.142854 13.646783 C 132.17775 11.736373 165.41602 36.874653 174.2177 74.964123 C 176.01638 82.747923 176.30366 86.330733 175.87409 95.621693 C 175.2441 109.24748 173.51166 116.06778 167.6846 127.86218 C 160.22115 142.96872 147.81411 155.37079 132.64285 162.88988 C 127.69285 165.34317 120.94285 168.08165 117.64285 168.97539 C 109.48593 171.18453 88.506924 171.70064 80.585224 169.88705 z M 114.33298 158.38025 C 138.19458 152.1303 157.00356 133.27793 163.19039 109.4101 C 166.24789 97.614743 165.60682 81.400023 161.63261 70.008973 C 154.86102 50.599923 138.9022 34.730683 118.97777 27.593553 C 112.42367 25.245813 110.15251 24.960583 97.642854 24.914143 C 85.595274 24.869433 82.666644 25.185343 76.642854 27.179453 C 56.153434 33.962263 38.951554 51.025423 32.100934 71.362183 C 28.991204 80.593743 28.279904 97.872723 30.607314 107.64549 C 36.460274 132.22201 55.481524 151.84134 79.816004 158.40146 C 89.349244 160.97144 104.47558 160.96214 114.33298 158.38025 z M 74.257654 127.73004 C 73.060584 126.89157 72.142854 125.16053 72.142854 123.74105 C 72.142854 122.3618 76.475084 113.43931 81.770024 103.9133 L 91.397194 86.593283 L 116.42452 73.227733 C 130.18955 65.876683 142.25911 59.721423 143.24577 59.549393 C 148.78735 58.583143 151.36312 65.507203 146.77616 69.039603 C 145.47447 70.042023 134.28893 76.221633 121.91939 82.772073 L 99.429314 94.681963 L 90.655084 110.50835 C 85.829254 119.21286 81.377304 126.72105 80.761854 127.19322 C 78.425624 128.98557 76.300574 129.16095 74.257654 127.73004 z"/>
            </Canvas>
            <Label Content="{Binding Path=Clock.Value, UpdateSourceTrigger=PropertyChanged}" Foreground="{Binding Path=ClockColor, UpdateSourceTrigger=PropertyChanged}" FontSize="16" HorizontalAlignment="Center" />
        </StackPanel>
        <!-- Stopwatch Button -->
        <StackPanel x:Name="stopwatchCanvas" Grid.Column="0" Grid.Row="1">
            <Canvas>
                <Path Fill="White" Data="M 456.57143 413.78623 C 424.76159 407.88318 401.40597 387.81419 391.66856 358.01656 C 384.49111 336.05271 385.90264 312.2971 395.58282 292.14081 C 406.57688 269.24875 424.36364 255.18414 450.55979 248.66861 C 459.23591 246.51068 462.57143 243.62752 462.57143 238.28601 C 462.57143 234.57209 461.26377 233.0759 457.57143 232.56515 C 455.22815 232.24101 455.05312 231.80606 454.77933 225.62672 C 454.37878 216.58659 454.93673 216.21933 469.07143 216.21933 C 483.20612 216.21933 483.76408 216.58659 483.36353 225.62672 C 483.08974 231.80606 482.91471 232.24101 480.57143 232.56515 C 476.87909 233.0759 475.57143 234.57209 475.57143 238.28601 C 475.57143 243.64517 478.90235 246.50952 487.67076 248.69052 C 502.09593 252.27856 512.33883 257.28334 522.40939 265.66414 L 528.25588 270.52964 L 535.04617 266.59033 C 538.78083 264.42372 541.98531 262.79988 542.16724 262.9818 C 542.34916 263.16373 542.9491 270.82985 543.50044 280.01764 C 544.05177 289.20542 544.92955 297.51996 545.45104 298.49439 C 549.41462 305.9004 551.92828 326.46599 550.47372 339.58755 C 545.74863 382.21245 513.72136 412.69968 472.07143 414.21983 C 466.02143 414.44064 459.04643 414.24553 456.57143 413.78623 z M 484.11133 396.19916 C 509.12004 389.82047 527.09509 372.4139 534.18028 347.71372 C 536.52938 339.52434 536.76107 337.34058 536.28612 327.86563 C 535.41996 310.58629 536.13953 311.65678 516.46559 298.37892 L 499.40597 286.86545 L 506.06393 283.04239 L 512.7219 279.21933 L 509.39667 276.41622 C 504.79657 272.53843 493.35075 267.07396 485.57143 265.04156 C 476.97393 262.79541 461.16894 262.79541 452.57143 265.04156 C 416.00978 274.59352 393.80739 312.70351 404.104 348.23497 C 412.69338 377.87512 438.26527 397.46778 468.61133 397.65916 C 474.07293 397.69361 480.69917 397.06946 484.11133 396.19916 z"/>
            </Canvas>
            <Label Content="{Binding Path=Stopwatch.Value, UpdateSourceTrigger=PropertyChanged}" Foreground="{Binding Path=StopwatchColor, UpdateSourceTrigger=PropertyChanged}" FontSize="16" HorizontalAlignment="Center" />
        </StackPanel>
        <!-- Countdown Button -->
        <StackPanel x:Name="countdownCanvas" Grid.Column="0" Grid.Row="2">
            <Canvas>
                <Path Fill="White" Data="M 287 376.64338 C 261.09905 371.83686 240.66626 357.53966 228.20794 335.50549 C 220.52484 321.91692 216.26208 300.74934 217.94551 284.54537 C 218.83809 275.95377 221.36371 264.63392 223.12038 261.35154 C 223.64188 260.37711 224.51966 252.06257 225.07099 242.87479 C 225.62232 233.687 226.22227 226.02088 226.40419 225.83895 C 226.58612 225.65703 229.7906 227.28087 233.52525 229.44748 L 240.31554 233.38679 L 246.16204 228.52129 C 256.23259 220.14049 266.47549 215.13571 280.90066 211.54767 C 289.66907 209.36667 293 206.50232 293 201.14316 C 293 197.42924 291.69234 195.93305 288 195.4223 C 285.65671 195.09816 285.48168 194.66321 285.20789 188.48387 C 284.80735 179.44374 285.3653 179.07648 299.5 179.07648 C 313.63469 179.07648 314.19264 179.44374 313.7921 188.48387 C 313.51831 194.66321 313.34328 195.09816 311 195.4223 C 307.30766 195.93305 306 197.42924 306 201.14316 C 306 206.48467 309.33552 209.36783 318.01164 211.52576 C 344.20779 218.04129 361.99455 232.1059 372.98861 254.99796 C 379.97773 269.55087 382.72366 286.01418 380.90229 302.4447 C 376.1772 345.0696 344.14993 375.55683 302.5 377.07698 C 296.45 377.29779 289.475 377.10268 287 376.64338 z M 314.5399 359.05631 C 339.3313 352.73304 357.44235 335.33418 364.46743 311.09212 C 374.76404 275.56066 352.56165 237.45067 316 227.89871 C 307.40249 225.65256 291.5975 225.65256 283 227.89871 C 275.22067 229.93111 263.77485 235.39558 259.17476 239.27337 L 255.84952 242.07648 L 262.50749 245.89954 L 269.16546 249.7226 L 252.10584 261.23607 C 232.4319 274.51393 233.15146 273.44344 232.28531 290.72278 C 231.81036 300.19773 232.04205 302.38149 234.39115 310.57087 C 243.02502 340.67005 268.46417 360.32348 299.0399 360.51631 C 304.5015 360.55076 311.12774 359.92661 314.5399 359.05631 z"/>
            </Canvas>
            <Label  Content="{Binding Path=Countdown.Value, UpdateSourceTrigger=PropertyChanged}" Foreground="{Binding Path=CountdownColor, UpdateSourceTrigger=PropertyChanged}" FontSize="16" HorizontalAlignment="Center" />
        </StackPanel>
        <Canvas x:Name="helpCanvas" Grid.Row="0" Grid.Column="0" Grid.RowSpan="3" Grid.ColumnSpan="3" Background="Black" Visibility="Collapsed">
        </Canvas>
    </Grid>
</Page>

Измените свойство Text TextBox в ViewBox, чтобы увидеть, как оно выглядит с содержимым.

Answer 1

Примените TranslateTransform, используя верхнюю левую точку, чтобы переместить содержимое в верхний левый угол холста.

Answer 2

Если вы удалите ширину и высоту с холста, который, кажется, смещает содержимое. (Будет ли этого достаточно или это повлечет за собой другие проблемы?)

Вы также можете отбросить все упаковочные полотна, так как Путь может быть сам по себе.