web-dev-qa-db-ja.com

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 '」例外が発生します。

解決策は何ですか?

52
Marco

「欠落」画像の場合、考慮すべき事項がいくつかあります。

  1. XAMLがリソースを見つけられない場合、それは無視される可能性があります(XamlParseExceptionをスローしない場合)

  2. リソースを適切に追加して定義する必要があります。

    • 予想される場所にプロジェクトに存在することを確認してください。

    • プロジェクトがリソースとしてビルドされていることを確認してください。

      (右クリック→プロパティ→BuildAction = 'Resource')

Snippet

同様の場合に試すべきもう1つのことは、画像(またはその他のリソース)の再利用にも役立ちます。

画像をXAMLのリソースとして定義します:

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

後で希望するコントロールで使用します:

<Button Content="{StaticResource MyImage}" />
69
Ron.B.I

以下の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);
26
Vimal CK

つかいます:

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

動作するはずです。ただし、プロジェクトのリソースに画像を追加する必要があることに注意してください!

8
Maciek

テキストをオーバーレイする場合は、ボタンの背景を画像に設定できます。

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

画像ソースの構文に注意してください。 この質問 を参照してください。

5
kjhf

私も同じ問題を抱えていました。次のコードを使用して修正しました。

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

注:プロパティウィンドウのイメージのビルドアクションがResourceであることを確認してください。

enter image description here

3
Ali Asad

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>
2
yu yang Jian

(リソース)タブのアクセス修飾子 を「パブリック」に設定する必要があることもわかりました-デフォルトでは内部に設定され、アイコンはデザインモードでのみ表示され、アプリケーションを実行したときは表示されませんでした。

0
Robin Bennett