10

我已经下载了这个包： http: //modernuiicons.com/我正在尝试使用 xaml 图标。

我已在我的解决方案中添加了一个 xaml 文件，其中包含以下内容

<?xml version="1.0" encoding="utf-8"?>
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="appbar_check" Width="76" Height="76" Clip="F1 M 0,0L 76,0L 76,76L 0,76L 0,0">
<Path Width="37.9998" Height="31.6665" Canvas.Left="19.0001" Canvas.Top="22.1668" Stretch="Fill" Fill="#FF000000" Data="F1 M 23.7501,33.25L 34.8334,44.3333L 52.2499,22.1668L 56.9999,26.9168L 34.8334,53.8333L 19.0001,38L 23.7501,33.25 Z "/>
</Canvas>

现在，如何将此画布引用到我的用户控件？

用户控制

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
mc:Ignorable="d"
x:Class="UserControlSolution.UserControlButton"
x:Name="UserControl"
Height="50" Background="#FF2F2F2F" BorderBrush="#FF919191">


<Grid x:Name="LayoutRoot" Height="50" RenderTransformOrigin="0.5,0.5">
    <Rectangle x:Name="rectangle" RenderTransformOrigin="0.5,0.5" Width="230" Height="50"/>
    <TextBlock x:Name="NameLabel" FontSize="16" Foreground="#FFE5E5E5" Height="34" Width="149" Text="Onthaal Telefoon" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="10,10,0,0" FontFamily="Segoe UI Semibold"/>
    <Viewbox HorizontalAlignment="Right" VerticalAlignment="Top" Height="16.5" Width="17.789" Margin="0,15,24.5,0">
        // Here I want to reference the canvas
    </Viewbox>
</Grid>
</UserControl>

我可以复制画布课程的内容，但必须有另一种解决方案。

4

2 回答 2

21

在页面或 App.xaml 或其他任何内容中添加CanvasandPath作为资源，记住设置x:Key. 然后使用 aContentControl来引用资源。

<!-- In Resources, either on the Page or App.xaml for app-wide reuse -->
<Canvas x:Key="TickCanvas" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="appbar_check" Width="76" Height="76" Clip="F1 M 0,0L 76,0L 76,76L 0,76L 0,0">
    <Path Width="37.9998" Height="31.6665" Canvas.Left="19.0001" Canvas.Top="22.1668" Stretch="Fill" Fill="#FF000000" Data="F1 M 23.7501,33.25L 34.8334,44.3333L 52.2499,22.1668L 56.9999,26.9168L 34.8334,53.8333L 19.0001,38L 23.7501,33.25 Z "/>
</Canvas

<!-- On your page, or somewhere -->
<ViewBox>
    <ContentControl Content="{StaticResource TickCanvas}" />
</ViewBox>

作为证明它有效，我能够看到它的勾号！

顺便说一句，我经常只获取路径数据、迷你标记并将其保存为字符串资源。然后使用 aPath我通过这种方式引用标记资源，我可以在其本身上使用andData={StaticResource TickPath}调整向量的大小，或者通过设置使其由其父级扩展和收缩。节省.HeightWidthPathStretch="Uniform"Viewbox

<!-- In App.xaml for app-wide reuse -->
<x:String x:Key="TickPath">F1 M 23.7501,33.25L 34.8334,44.3333L 52.2499,22.1668L 56.9999,26.9168L 34.8334,53.8333L 19.0001,38L 23.7501,33.25 Z </x:String>

<!-- On page, template or wherever -->
<Path Data="{StaticResource TickPath} />

这种技术在这种情况下可能不起作用，因为那里有一个剪辑几何体。但是对于简单的向量来说很好，我有手绘字体（不能嵌入为字体）作为标记存储在文件中，然后我在运行时加载它们——Data={Binding PathData}也可以。

于 2013-09-06T11:57:26.830 回答
1

基于 Luke's answer 的变体，允许将颜色指定到路径。

<Style TargetType="{x:Type ContentControl}" x:Key="TickIcon">
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <Viewbox Width="{Binding Width, RelativeSource={RelativeSource AncestorType=ContentControl}}">
                    <Canvas x:Name="appbar_check" Width="76" Height="76" Clip="F1 M 0,0L 76,0L 76,76L 0,76L 0,0">
                        <Path Width="37.9998" Height="31.6665" Canvas.Left="19.0001" Canvas.Top="22.1668" Stretch="Fill" Fill="{Binding Foreground, RelativeSource={RelativeSource AncestorType=ContentControl}}" Data="F1 M 23.7501,33.25L 34.8334,44.3333L 52.2499,22.1668L 56.9999,26.9168L 34.8334,53.8333L 19.0001,38L 23.7501,33.25 Z "/>
                    </Canvas>
                </Viewbox>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

和

<Button Command="{Binding ConnectCommand}" VerticalAlignment="Stretch">
    <WrapPanel>
        <ContentControl Foreground="AliceBlue" Style="{StaticResource TickIcon}" Width="20" />
        <TextBlock>Connect</TextBlock>
    </WrapPanel>
</Button>
于 2017-08-22T13:07:36.007 回答