在 WPF 按钮中添加图像

我试过这个办法:

<Button>
<StackPanel>
<Image Source="Pictures/img.jpg" />
<TextBlock>Blablabla</TextBlock>
</StackPanel>
</Button>

但是我只能在项目窗口中看到图像，当我启动程序时它就消失了。

如果我试试这个:

  Image img = new Image();
img.Source = new BitmapImage(new Uri("foo.png"));


StackPanel stackPnl = new StackPanel();
stackPnl.Orientation = Orientation.Horizontal;
stackPnl.Margin = new Thickness(10);
stackPnl.Children.Add(img);


Button btn = new Button();
btn.Content = stackPnl;

我在 PresentationFramework.dll 中得到一个“ System.Windows.Markup.XamlParseException”异常。

解决办法是什么？

270177 次浏览
小开

请尝试下面的 XAML 代码片段:

<Button Width="300" Height="50">
<StackPanel Orientation="Horizontal">
<Image Source="Pictures/img.jpg" Width="20" Height="20"/>
<TextBlock Text="Blablabla" VerticalAlignment="Center" />
</StackPanel>
</Button>

在 XAML 中，元素是树形结构。因此必须将子控件添加到其父控件中。下面的代码片段也可以正常工作。为您的 XAML 根网格命名为“ MainGrid”。

Image img = new Image();
img.Source = new BitmapImage(new Uri(@"foo.png"));


StackPanel stackPnl = new StackPanel();
stackPnl.Orientation = Orientation.Horizontal;
stackPnl.Margin = new Thickness(10);
stackPnl.Children.Add(img);


Button btn = new Button();
btn.Content = stackPnl;
MainGrid.Children.Add(btn);
小开

用途:

<Button Height="100" Width="100">
<StackPanel>
<Image Source="img.jpg" />
<TextBlock Text="Blabla" />
</StackPanel>
</Button>

它应该可以工作。但是请记住，您必须将一个图像添加到项目的资源中！

小开
最佳答案

在“缺失”图像的情况下，需要考虑以下几点:

  1. 当 XAML 无法定位资源时，它可能会忽略它(当它不抛出 XamlParseException时)

  2. 资源必须适当添加和定义:

    • 确保它存在于项目中预期的位置。

    • 确保它是以您的项目作为资源构建的。

      (右击→属性→ BuildAction = “资源”)

Snippet

在类似情况下可以尝试的另一个方法，对于图像(或任何其他资源)的重用也很有用:

在 XAML 中将图像定义为一种资源:

<UserControl.Resources>
<Image x:Key="MyImage" Source.../>
</UserControl.Resources>

然后在你想要的控制中使用它:

<Button Content="{StaticResource MyImage}" />
小开

如果要覆盖文本，可以将按钮的背景设置为图像。

<Button>
<Button.Background>
<ImageBrush ImageSource="/AssemblyName;component/Pictures/img.jpg"/>
</Button.Background>
<TextBlock>Blablabla</TextBlock>
</Button>

注意图像源语法。请参阅 这个问题获得帮助。

小开

试试 ContentTemplate:

<Button Grid.Row="2" Grid.Column="0" Width="20" Height="20"
Template="{StaticResource SomeTemplate}">
<Button.ContentTemplate>
<DataTemplate>
<Image Source="../Folder1/Img1.png" Width="20" />
</DataTemplate>
</Button.ContentTemplate>
</Button>
小开

我也有同样的问题。我已经通过使用以下代码修复了它。

        <Button Width="30" Margin="0,5" HorizontalAlignment="Stretch"  Click="OnSearch" >
<DockPanel>
<Image Source="../Resources/Back.jpg"/>
</DockPanel>
</Button>

注意: 确保属性窗口中图像的构建操作为 Resource。

enter image description here

小开

我发现我还必须将 “资源”选项卡中的访问修饰符设置为“ Public”——默认设置为 Internal，我的图标只在设计模式下出现，但在运行应用程序时不会出现。


提交答案