如何在 WinRT XAML 中将多个 Shapes.Path 添加到 ListView？答案

【问题标题】：How do I add multiple Shapes.Path to ListView in WinRT XAML?如何在 WinRT XAML 中将多个 Shapes.Path 添加到 ListView？
【发布时间】：2014-05-21 04:09:49
【问题描述】：

我在 XAML 中有一个 ListView 控件，其中包含由以下代码 (WinRT C#) 设置样式的项目。但我无法显示“path_2”，如下图所示。

如何在 WinRT XAML 中向 ListView 添加多个 Shapes.Path？

[MainPage.xaml.cs]

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Shapes;

namespace AppListViewPath
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();

            object o;
            Application.Current.Resources.TryGetValue("PathCustomStyle", out o);

            Path path_1 = new Path()
            {
                Style = (Style)o
            };

            Path path_2 = new Path()
            {
                Style = (Style)o
            };

            this.listView_path.Items.Add(path_1); // show
            this.listView_path.Items.Add(path_2); // doesn't show...
        }
    }
}

[App.xaml]

<Application
    x:Class="AppListViewPath.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:AppListViewPath"
    RequestedTheme="Light">

    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="Common/StandardStyles.xaml"/>
            </ResourceDictionary.MergedDictionaries>

            <Style x:Key="PathCustomStyle" TargetType="Path">
                <Setter Property="Data" Value="M95,15 C95,20 95,20 95,20"/>
                <Setter Property="Width" Value="200"/>
                <Setter Property="Height" Value="200"/>
                <Setter Property="Stroke" Value="Red"/>
                <Setter Property="Stretch" Value="Fill"/>
                <Setter Property="HorizontalAlignment" Value="Center"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
            </Style>

        </ResourceDictionary>
    </Application.Resources>
</Application>

[MainPage.xaml]

<Page
    x:Class="AppListViewPath.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:AppListViewPath"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
        <ListView x:Name="listView_path"/>
    </Grid>
</Page>

【问题讨论】：

标签： c# xaml windows-runtime microsoft-metro winrt-xaml

【解决方案1】：

问题是您不能在可视化树中多次使用相同的 Geometry，并且样式在读取 Geometry 时解析 Path.Data 对 Geometry 的引用，而不是将字符串分配给目标然后解析它。由于 Geometry 已在使用中，因此第二个 Path 最终没有数据。

您可以为数据创建一个字符串资源并将其与样式分开设置，而不是直接在样式中设置数据：

<ResourceDictionary>
    <Style x:Key="PathCustomStyle" TargetType="Path">
        <Setter Property="Width" Value="200"/>
        <Setter Property="Height" Value="200"/>
        <Setter Property="Stroke" Value="Red"/>
        <Setter Property="StrokeThickness" Value="10" />
        <Setter Property="Stretch" Value="Fill"/>
        <Setter Property="HorizontalAlignment" Value="Center"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
    </Style>

    <x:String x:Key="PathDataString">M95,15 C95,20 95,20 95,20</x:String>
<ResourceDictionary>

在 Xaml 中设置：

<Path Style="{StaticResource PathCustomStyle}" Data="{StaticResource PathDataString}" />

在代码中设置：

object o;
Application.Current.Resources.TryGetValue("PathCustomStyle", out o);

string stringData = (string)Application.Current.Resources["PathDataString"];

string xamlPath = "<Path xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'>" +
"<Path.Data>" + stringData + "</Path.Data></Path>";

// Shows 10
for (int i = 0; i < 10; i++)
{
    Path path = XamlReader.Load(xamlPath) as Path;
    path.Style = (Style)o;

    this.listView_path.Items.Add(path);
}

【讨论】：