图像不显示XAML

本文关键字：XAML 显示 图像 | 更新日期: 2023-09-27 18:12:00

我创建了自己的按钮，图标在一边，文本在另一边，但问题是图像不显示。我错过什么了吗?任何帮助都会很感激。TIA

这是控件的XAML 

<UserControl x:Name="QButtonControl"
    x:Class="CommonLayout.QButton"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:CommonLayout"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="36"
    d:DesignWidth="145" MinWidth="145" MinHeight="36" Loaded="QButtonControl_Loaded">
    <Grid PointerEntered="Grid_PointerEntered_1" PointerExited="Grid_PointerExited_1" MinWidth="145" MinHeight="36" Background="#FFDCD1D1">
        <TextBlock x:Name="btnLabel" Height="20" Margin="36,8,4,8" TextWrapping="Wrap" Text="Text Here" VerticalAlignment="Center" FontSize="18.667" Width="105"/>
        <Image x:Name="img" HorizontalAlignment="Left" Height="27" Margin="1,4,0,0" VerticalAlignment="Top" Width="29"/>
    </Grid>
</UserControl>

这是控件后面的代码。

public sealed partial class QButton : UserControl
    {
        private ImageSource iconDefault;
        private Brush hoverBrush = new SolidColorBrush(Color.FromArgb(255, 228, 228, 228));
        public string Text
        {
            get
            {
                return btnLabel.Text;
            }
            set
            {
                btnLabel.Text = value;
            }
        }
        public ImageSource Icon
        {
            get
            {
                return iconDefault;
            }
            set
            {
                iconDefault = value;
                img.Source = value;
            }
        }
        public Brush HoverBrush
        {
            get
            {
                return hoverBrush;
            }
            set
            {
                hoverBrush = value;
            }
        }
        public QButton()
        {
            this.InitializeComponent();
        }
        private void Grid_PointerEntered_1(object sender, PointerRoutedEventArgs e)
        {
            btnLabel.Foreground = HoverBrush;
        }
        private void Grid_PointerExited_1(object sender, PointerRoutedEventArgs e)
        {
            btnLabel.Foreground = Foreground;
        }
        private void QButtonControl_Loaded(object sender, RoutedEventArgs e)
        {
            img.Source = iconDefault;       
        }

    }

图像不显示XAML

首先，不要使用硬编码的文件路径到图像。
Windows Store应用程序在沙盒中运行，所以当你部署应用程序时，你将无法获得任何任意的文件位置。

第二，你不能在Image URI中使用反斜杠。反斜杠是你设置你得到的错误的技术原因。但只是改变正斜杠不是答案。

Access Image in XAML

如果你添加一个图像到你的项目/Assets文件夹，你可以使用XAML像这样在QButton中显示它。

<local:QButton x:Name='qButton1'
               Icon='/assets/jellyfish.jpg'  />
在代码中

在代码中更改图标。

public MainPage()
{
  this.InitializeComponent();
  this.Loaded += MainPage_Loaded;
}
private async void MainPage_Loaded(object sender, RoutedEventArgs e)
{
  var file = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Assets/shrimp.jpg"));
  var fileStream = await file.OpenAsync(Windows.Storage.FileAccessMode.Read);
  var image = new BitmapImage();
  image.SetSource(fileStream);
  qButton1.Icon = image;
    }

如果您希望用户在运行时从其计算机中选择图像，请查看文件选择器。

MSDN文件选择器

您是否忘记设置Icon属性?

This works for me

<local:QButton Icon="C:'Users'Public'Pictures'Sample Pictures'Penguins.jpg" />


public QButton()
{
    this.InitializeComponent();
    Uri imageUri = new Uri(@"C:'Users'Public'Pictures'Sample Pictures'Penguins.jpg");
    BitmapImage image = new BitmapImage(imageUri);
    this.Icon = image;
}
相关文章：