Uno平台材质卡使用路径图标

Question

我在基于Uno的应用程序上使用材料卡。它工作得很好——只是我试图为MediaContent添加一个Pathicon，但很难让它正常工作。我试图覆盖模板中的图像源，但没有成功，我可能做得不对。从本质上讲，我想要一个.png或jpg所在的路径图标。任何关于如何实现这一目标的建议都将不胜感激。

<material:Card HeaderContent="Outlined card"
SubHeaderContent="With title and subtitle only"
MediaContent="" 
Style="{StaticResource MaterialOutlinedCardStyle}"
PointerExited="eventPageClick">
<material:Card.HeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,14,16,0"
Style="{ThemeResource MaterialHeadline6}" />
</DataTemplate>
</material:Card.HeaderContentTemplate>
<material:Card.SubHeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,0,16,14"
Style="{ThemeResource MaterialBody2}" />
</DataTemplate>
</material:Card.SubHeaderContentTemplate>
<material:Card.MediaContentTemplate>
<DataTemplate>
<Image Source="{Binding}"
Stretch="Uniform"
MaxHeight="194" />
</DataTemplate>
</material:Card.MediaContentTemplate>
</material:Card>

Answer 1

好问题！

使用MediaContentTemplate，您应该能够在DataTemplate中放置您想要的任何内容，包括PathIcons。唯一的问题是，只有当MediaContent属性不是null或空字符串时，才会加载MediaContentTemplate。所以我会做一些事情，比如将Path Data字符串设置为MediaContent，然后在MediaContentTemplate中使用Binding作为PathIcon的Data属性，如下所示：

<material:Card HeaderContent="Outlined card"
SubHeaderContent="With title and subtitle only"
MediaContent="PASTE PATH DATA HERE" 
Style="{StaticResource MaterialOutlinedCardStyle}"
PointerExited="eventPageClick">
<controls:Card.MediaContentTemplate>
<DataTemplate>
<PathIcon Data="{Binding}"/>
</DataTemplate>
</controls:Card.MediaContentTemplate>
...
</material:Card>

Answer 2

谢谢sbilogan！你给了我让它发挥作用的钥匙。他们的关键是媒体内容的文本不能为空。事实证明，我可以把任何文本放在那里，然后像下面这样添加路径图标，这很有效。非常感谢你的帮助！

<material:Card HeaderContent="Outlined card3"
SubHeaderContent="With title and subtitle only"
Style="{StaticResource MaterialOutlinedCardStyle}"
MediaContent="Example"        
PointerExited="eventPageClick">
<material:Card.HeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,14,16,0"
Style="{ThemeResource MaterialHeadline6}" />
</DataTemplate>
</material:Card.HeaderContentTemplate>
<material:Card.SubHeaderContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"
Margin="16,0,16,14"
Style="{ThemeResource MaterialBody2}" />
</DataTemplate>
</material:Card.SubHeaderContentTemplate>
<material:Card.MediaContentTemplate>
<DataTemplate>
<PathIcon HorizontalAlignment="Center" VerticalAlignment="Center" Margin="10" Data="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</DataTemplate>
</material:Card.MediaContentTemplate>
</material:Card>