Добавление изображения в кнопку 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;

Я получаю исключение "System.Windows.Markup.XamlParseException" в PresentationFramework.dll.

Можете ли вы помочь мне найти решение? Спасибо.

Ответы

Ответ 1

В случае "отсутствующего" изображения есть несколько вещей, которые следует учитывать:

  • Когда Xaml не может найти ресурс, он может его игнорировать (когда он не будет бросать XamlParseException)

  • Ресурс должен быть правильно добавлен и определен:

    • убедитесь, что он существует в вашем проекте, где ожидалось.

    • Убедитесь, что он создан с вашим проектом в качестве ресурса.

      (Щелкните правой кнопкой мыши → Свойства → BuildAction = 'Ресурс')

Snippet

Другое дело попробовать в подобных случаях, что также полезно для повторного использования изображения (или любого другого ресурса):

Определите свое изображение как ресурс в вашем Xaml:

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

И затем используйте его в своем желаемом элементе управления:

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

Ответ 2

Попробуйте ниже фрагмент 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);

Ответ 3

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

Должен работать. Но помните, что вы должны добавить изображение к ресурсу в своем проекте!

Ответ 4

Вы можете установить фон Button на изображение, если затем хотите наложить текст.

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

Следите за синтаксисом Image Source, см. этот вопрос для справки.

Ответ 5

Попробуйте 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>