Mahapps地铁控制：平铺背景图像

Question

我想用Mahapps.Metro创建一个很酷的Windows 8外观。 我使用了<Controls:Tile/>个元素。这是我的wpf代码：

        <Controls:Tile Title="Artikel einstellen" TiltFactor="2" Grid.Column="0" Grid.Row="0" Width="300" Height="150">
            <Controls:Tile.Background>
                <VisualBrush Visual="{StaticResource appbar_add}" />
            </Controls:Tile.Background>
        </Controls:Tile>
        <Controls:Tile Title="Artikel verkauft" TiltFactor="2" Grid.Column="1" Grid.Row="0" Width="300" Height="150"/>
        <Controls:Tile Title="Artikel bezahlt" TiltFactor="2" Grid.Column="0" Grid.Row="1" Width="300" Height="150"/>
        <Controls:Tile Title="Artikel entfernen" TiltFactor="2" Grid.Column="1" Grid.Row="1" Width="300" Height="150"/>

现在我得到了这个结果：

但我想要这样的事情：

我下载了MahApps.Metro＆amp;的Icons & Resource Package。使用以下代码将它们包含在app.xaml文件中：

<ResourceDictionary Source="/Resources/Icons.xaml" />

谢谢你的帮助！

Answer 1

我发现了问题。 我必须在<Rectangle/>内创建一个<Tile/>，如下所示：

<Controls:Tile Title="Artikel einstellen" TiltFactor="2" Grid.Column="0" Grid.Row="1" Width="300" Height="150">
            <Rectangle Width="50" Height="50">
                <Rectangle.Fill>
                    <VisualBrush Visual="{StaticResource appbar_add}" />
                </Rectangle.Fill>
            </Rectangle>
        </Controls:Tile>

Answer 2

MahApps.Metro.IconPacks需要更少的代码并拥有更多图标

<Controls:Tile Width="300" Height="150" Grid.Column="0" Grid.Row="1" Title="Hello!">
    <Grid>
        <iconPacks:PackIconFontAwesome Kind="FlagCheckeredSolid" Foreground="#FFFFFF" Height="50" Width="50"/>
    </Grid>
</Controls:Tile>

不要忘记调用命名空间

xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"