在 XAML 中使用几何资源 [英] Using Geometry resources in XAML

问题描述

我有一个名为 Header 的用户控件，它具有依赖属性 IconData:

I have an usercontrol called Header with depenency property IconData:

public Geometry IconData
{
    get { return (Geometry)GetValue(IconDataProperty); }
    set { SetValue(IconDataProperty, value); }
}

public static readonly DependencyProperty IconDataProperty = 
    DependencyProperty.Register(nameof(IconData), typeof(Geometry), typeof(Header), new PropertyMetadata(null);

我在应用程序中定义了图标

I have the icon defined in Application

<x:String x:Key="HomeIconGeometry">F1 M 24.0033,56.0078L 24.0033,38.0053L 22.0031,40.0056L 19.0027,35.0049L 38.0053,20.0028L 45.0063,25.5299L 45.0063,21.753L 49.0068,21.0029L 49.0068,28.6882L 57.008,35.0049L 54.0075,40.0056L 52.0073,38.0053L 52.0073,56.0078L 24.0033,56.0078 Z M 38.0053,26.9204L 27.0038,36.005L 27.0038,53.0074L 33.0046,53.0074L 33.0046,42.006L 43.006,42.006L 43.006,53.0074L 49.0068,53.0074L 49.0068,36.005L 38.0053,26.9204 Z</x:String>

我是这样使用的:

<local:Header x:Name="HeaderPanel" IconData="{StaticResource HomeIconGeometry}" />

然而，XAML 设计器一如既往地糟糕:

However, the XAML designer sucks as always:

这个问题类似于ResourceDictionary 中的PathGeometry不同的是，建议的答案在自定义控件/用户控件中不起作用

This question is simmilar to PathGeometry in ResourceDictionary with the difference, that the proposed answer does not work in custom controls / usercontrols

推荐答案

你想要做的是在 WPF 中完美运行，但不幸的是，它在 UWP 上不受支持...

What you are trying to do is perfectly working in WPF but unfortunately, it is not supported on UWP...

我发现的唯一方法是在页面/应用程序资源中声明您的路径，因此能够使用移动和绘制语法

The only way I've found is to declare your path in the page/app resources and hence, by able to use the move and draw syntax

<Page.Resources>
    <Path x:Key="pp" Data="F1 M 24.0033,56.0078L 24.0033,38.0053L 22.0031,40.0056L 19.0027,35.0049L 38.0053,20.0028L 45.0063,25.5299L 45.0063,21.753L 49.0068,21.0029L 49.0068,28.6882L 57.008,35.0049L 54.0075,40.0056L 52.0073,38.0053L 52.0073,56.0078L 24.0033,56.0078 Z M 38.0053,26.9204L 27.0038,36.005L 27.0038,53.0074L 33.0046,53.0074L 33.0046,42.006L 43.006,42.006L 43.006,53.0074L 49.0068,53.0074L 49.0068,36.005L 38.0053,26.9204 Z" />
    <local:PathToFiguresConverter x:Key="converter" />
</Page.Resources>

然后使用转换器提取创建的 PathGeometry Data 并将它们提供给路径对象:

And then use a converter to extract the created PathGeometry Data and provide them to the path object :

class PathToFiguresConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        var path = value as Path;
        var figures = (path.Data as PathGeometry).Figures;
        return figures;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

在页面/控件中:

<Path Fill="{ThemeResource SystemControlForegroundAccentBrush}">
    <Path.Data>
        <PathGeometry Figures="{Binding Source={StaticResource pp}, Converter={StaticResource converter} }" />
    </Path.Data>
</Path>

这也意味着在您的情况下，您必须将依赖项属性更改为:

That also means that in your case, you will have to change your dependency property to :

public PathFigureCollection IconData
{
    get { return (PathFigureCollection )GetValue(IconDataProperty); }
    set { SetValue(IconDataProperty, value); }
}

public static readonly DependencyProperty IconDataProperty = 
    DependencyProperty.Register(nameof(IconData), typeof(PathFigureCollection ), typeof(Header), [...])

这篇关于在 XAML 中使用几何资源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！