web-dev-qa-db-ja.com

プログラムでWPFのボタンアイコンを変更する

現在、アイコン/画像が表示されているボタンがあります。 XAMLでボタンと画像を構成しました。

<Button Height="69" HorizontalAlignment="Left" Margin="-2,0,0,0" Name="toggleBroadcast" VerticalAlignment="Top" Width="64" Grid.Row="1" Opacity="0.5" Click="changeBroadcastState_Click">
        <Image Source="Images\playIcon.png" />
</Button>

このボタンの画像をプログラムでplayIconからstopIconに変更できるようにする必要があります。これどうやってするの?

17
BSchlinker

これは、イベントハンドラーを使用してボタンのコンテンツを変更することで実現できます。

次のように、「再生」アイコンと「停止」アイコンの両方をWindow.Resourcesの下のリソースとして設定できます。

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.Microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.Microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <Image x:Key="Play" Source="/WpfApplication1;component/Play_Icon.png" Height="50" Width="50" />
    <Image x:Key="Stop" Source="/WpfApplication1;component/Stop_Icon.png" Height="50" Width="50"/>
</Window.Resources>
<Grid>
    <Button Click="Button_Click" Name="MediaButton">
        <DynamicResource ResourceKey="Play"/>
    </Button>
</Grid>

これで、ボタンをクリックすると、ボタンのコンテンツを別のリソース(停止アイコン)に変更できます。ボタンのイベントハンドラーでこれを行うことができます。

C#

private void Button_Click(object sender, RoutedEventArgs e)
{
    if (MediaButton.Content == FindResource("Play"))
    {
        MediaButton.Content = FindResource("Stop");
    }
    else
    {
        MediaButton.Content = FindResource("Play");
    }
}

編集:短い表記

MediaButton.Content = FindResource(MediaButton.Content == FindResource("Play") ? "Stop" : "Play");

これがお役に立てば幸いです。他にご不明な点がありましたらお知らせください。

35
d.moncada

次のようなイメージ定義がある場合:

<Image Source="{Binding ImageSource}" Stretch="Fill"/>

次に、切り替えを実行するコードで、単に次のようにします。

ImageSource = image;

ここで、imageは次のように定義されています。

image = new BitmapImage(new Uri("/Application;component/Resources/pause.png", UriKind.Relative));

もちろん、MVVMパターンを使用し、コードにINotifyPropertyChangedインターフェースを実装することに依存しています。

5
ChrisF

変更条件にDataTrigger (edit)を画像のスタイルで使用(/ edit)

<Button Height="69" HorizontalAlignment="Left" Margin="-2,0,0,0" Name="toggleBroadcast" VerticalAlignment="Top" Width="64" Grid.Row="1" Opacity="0.5" Click="changeBroadcastState_Click">
    <Image>
        <Image.Style>        
            <Style TargetType="{x:Type Image}">
                <Setter Property="Source" Value="Images\playIcon.png" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding myCondition}" Value="True">
                        <Setter Property="Source" Value="Images\stopIcon.png" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Image.Style>        
    </Image>
</Button>

myCondition変数は、ViewModel(または、より一般的には、コントロールのDataContext)のブールプロパティになります。

public bool myCondition { get { return ([whatever that condition might be]); } }

これにはセッターが含まれることもあり、単純なautoプロパティの場合もあります。他のMVVM回答と同様に、INotifyPropertyChangedの実装はViewModelに依存します。

良い点は、条件が満たされなくなると、DataTriggerが自動的にSourceプロパティを元の値に戻すことです。

免責事項:現時点ではテストする方法がないので、これを少しずつ、おそらくデバッグ作業を行ってください...

4
Jan

このコードを試してください

window.Icon = BitmapFrame.Create(Application.GetResourceStream(new Uri("LiveJewel.png", UriKind.RelativeOrAbsolute)).Stream);
0
Joee