如何在XAML中居中放置XML图形？_Xaml_App.xaml

如何在XAML中居中放置XML图形？

xaml

如何在XAML中居中放置XML图形？,xaml,app.xaml,Xaml,App.xaml,我是XAML的新手，我正在尝试找出一些你定位事物的方法。我有一个以Adobe Illustrator图像开始的图形，然后我将其转换为可以像XAML一样渲染的代码。但是，我似乎无法使其在显示区域内居中显示。使用水平对齐，我可以毫无问题地将其他东西居中，但由于某些原因，我似乎无法将此图形居中。我希望我错过了什么 <Window x:Class="play.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/pr

我是XAML的新手，我正在尝试找出一些你定位事物的方法。我有一个以Adobe Illustrator图像开始的图形，然后我将其转换为可以像XAML一样渲染的代码。但是，我似乎无法使其在显示区域内居中显示。使用水平对齐，我可以毫无问题地将其他东西居中，但由于某些原因，我似乎无法将此图形居中。我希望我错过了什么

<Window x:Class="play.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<StackPanel>
    <Viewbox xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Height="320">
        <Canvas x:Name="Layer_1" Canvas.Left="0" Canvas.Top="0" Width="62" Height="22" HorizontalAlignment="Center" Background="#00AEEF">
            <!--Unknown tag: metadata-->
            <!--Unknown tag: sodipodi:namedview-->
            <Canvas x:Name="g3" HorizontalAlignment="Center">
                <Path xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="path5" Fill="White" Margin="0,0,0,0" HorizontalAlignment="Center">
                    <Path.Data>
                        <PathGeometry Figures="M16.733 8.245c-0.027-0.413-0.393-0.726-0.798-0.698c-0.413 0.027-0.726 0.385-0.698 0.798   c0.123 1.855-0.554 3.68-1.855 5.006c-1.199 1.225-2.783 1.899-4.46 1.899c0 0 0 0-0.001 0c-1.553 0-3.007-0.59-4.125-1.656   l1.177-1.177c0.28-0.279 0.081-0.758-0.314-0.758H2.38c-0.245 0-0.444 0.199-0.444 0.444v3.278c0 0.396 0.478 0.594 0.758 0.314   l1.041-1.041c1.401 1.35 3.231 2.096 5.185 2.096c0.001 0 0.001 0 0.002 0c2.082 0 4.047-0.835 5.53-2.349   C16.053 12.771 16.884 10.527 16.733 8.245z" FillRule="NonZero"/>
                    </Path.Data>
                </Path>
                <Path xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="path7" Fill="White" Margin="0,0,0,0">
                    <Path.Data>
                        <PathGeometry Figures="M2.075 10.503c0.413-0.031 0.723-0.391 0.692-0.804c-0.14-1.868 0.535-3.709 1.85-5.051   C5.819 3.424 7.403 2.75 9.079 2.75c1.594 0 3.085 0.618 4.213 1.736l-1.152 1.152c-0.28 0.28-0.082 0.759 0.314 0.759h3.278   c0.245 0 0.444-0.199 0.444-0.444V2.674c0-0.396-0.479-0.594-0.758-0.314l-1.066 1.065C12.941 2.024 11.074 1.25 9.079 1.25   c-2.083 0-4.048 0.834-5.533 2.348C1.93 5.248 1.101 7.513 1.272 9.811c0.029 0.395 0.358 0.694 0.747 0.694   C2.037 10.505 2.057 10.504 2.075 10.503z" FillRule="NonZero"/>
                    </Path.Data>
                </Path>
            </Canvas>
        </Canvas>
    </Viewbox>

</StackPanel>

也许您应该使用Grid Grid.RowDefinitions和Grid.ColumnDefinitions来居中画布，而不是使用HorizontalAlignment属性

祝你好运

画布仅适用于静态放置图形。您应该开始使用网格和堆栈面板

我已修改了您的xaml：

<StackPanel>
    <Viewbox xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Height="320">
        <Grid x:Name="Layer_1" Width="62" Height="22" HorizontalAlignment="Center" Background="#00AEEF">
            <!--Unknown tag: metadata-->
            <!--Unknown tag: sodipodi:namedview-->
            <Grid x:Name="g3" HorizontalAlignment="Center" VerticalAlignment="Center">
                <Path xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="path5" Fill="White" Margin="0,0,0,0" HorizontalAlignment="Center">
                    <Path.Data>
                        <PathGeometry Figures="M16.733 8.245c-0.027-0.413-0.393-0.726-0.798-0.698c-0.413 0.027-0.726 0.385-0.698 0.798   c0.123 1.855-0.554 3.68-1.855 5.006c-1.199 1.225-2.783 1.899-4.46 1.899c0 0 0 0-0.001 0c-1.553 0-3.007-0.59-4.125-1.656   l1.177-1.177c0.28-0.279 0.081-0.758-0.314-0.758H2.38c-0.245 0-0.444 0.199-0.444 0.444v3.278c0 0.396 0.478 0.594 0.758 0.314   l1.041-1.041c1.401 1.35 3.231 2.096 5.185 2.096c0.001 0 0.001 0 0.002 0c2.082 0 4.047-0.835 5.53-2.349   C16.053 12.771 16.884 10.527 16.733 8.245z" FillRule="NonZero"/>
                    </Path.Data>
                </Path>
                <Path xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="path7" Fill="White" Margin="0,0,0,0">
                    <Path.Data>
                        <PathGeometry Figures="M2.075 10.503c0.413-0.031 0.723-0.391 0.692-0.804c-0.14-1.868 0.535-3.709 1.85-5.051   C5.819 3.424 7.403 2.75 9.079 2.75c1.594 0 3.085 0.618 4.213 1.736l-1.152 1.152c-0.28 0.28-0.082 0.759 0.314 0.759h3.278   c0.245 0 0.444-0.199 0.444-0.444V2.674c0-0.396-0.479-0.594-0.758-0.314l-1.066 1.065C12.941 2.024 11.074 1.25 9.079 1.25   c-2.083 0-4.048 0.834-5.533 2.348C1.93 5.248 1.101 7.513 1.272 9.811c0.029 0.395 0.358 0.694 0.747 0.694   C2.037 10.505 2.057 10.504 2.075 10.503z" FillRule="NonZero"/>
                    </Path.Data>
                </Path>
            </Grid>
        </Grid>
    </Viewbox>

</StackPanel>

您使用什么来转换路径数据？如果它是非常方便的，那么请确保您导出它的目的是正确的。在您这样做之前，我将合并/合并这两个路径并将其导出为一个路径，如果操作正确，那么它不应该关心大小，您也不应该需要ViewBox，因为它是向量。那么，您使用什么来导出路径数据，并了解在将路径数据导出到应用程序之前，您要删除的许多内容都是垃圾。我在名为Inkscape的应用程序中打开了该图形，然后使用“另存为”>“Microsoft XAML”。我没有Adobe Illustrator，但是你链接的应用看起来很酷。我将保存信息以备将来使用。我使用的URL是，我不确定如何组合这两条路径。我看看能不能弄明白。谢谢你提供的信息。组合路径花了几次尝试，但我成功了。我删除了viewbox，但由于某些原因，图形仍然保持左对齐。这里没有太多的代码，所以看起来应该很容易理解，但我没有任何运气。我试着将内部画布居中，也试着将外部画布居中，但没有什么乐趣。也许我应该解释一下实际的目标：我将使矢量图形居中于图形下方的两个文本块上。文本根据语言而变化，因此变化很大。考虑到这一点，我不打算使用我提供的代码示例。图形不应在其下方的文本上方居中之外做出反应。如果有更好的方法，我很乐意更改我的代码。您是否已使用Visual Studio安装Blend？我只是把你的东西复制/粘贴在那里。选择两条路径并快速右键单击->合并->联合生产，但这仍然不是我通常会做的那种事情。PS-如果您不使用Illustrator，那么Blend是一个方便的工具，在进行xaml设计工作时，我对inkscape还不太熟悉，因此无法对其进行恰当的描述。此解决方案与我最终实现的解决方案之间的主要区别在于，我遵循了上面Mike Swanson的建议，复制了第二条路径的图形值，并将其粘贴到第一条路径中，然后删除了第二条路径。这是一个我没有考虑过的好建议。谢谢大家的帮助！