Question

我是wpf的新手。实际上，我想更改按钮图标（play.ico / stop.ico）。当我单击按钮时，它将状态（状态为数据库列）的值从“联机”更改为“脱机”，或从“脱机”更改为“联机”。它也在数据库中更新我想显示状态为在线时，按钮应该显示stop.ico，状态为离线时，按钮应显示play.ico。如何实现呢？我尝试使用下面的代码，但无法正常工作。请帮忙，建议我缺少什么。

// Xaml代码

<StackPanel Margin="0 0 0 0" Grid.Column="5"  Grid.Row="0" Grid.RowSpan="2">
                    <Button Name="Ignition_Button1" Click="Ignition_Button1_Click_1" Width="35" Height="35" Margin="16,5,16,0"

                            Style="{DynamicResource CircleButton}"
                            Command="{Binding StartStopCommand}">
                        <Button.ToolTip>
                            <ToolTip>
                                <StackPanel>
                                    <TextBlock FontWeight="Bold"
                                               Text="Start or Stop Control Center" />
                                </StackPanel>
                            </ToolTip>
                        </Button.ToolTip>
                        <StackPanel Orientation="Vertical">
                            <Rectangle Width="15" Height="15" StrokeThickness="0">
                                <Rectangle.Style>
                                    <Style TargetType="{x:Type Rectangle}">
                                        <Setter Property="Fill" Value="{StaticResource play.ico}" />
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Status, UpdateSourceTrigger=PropertyChanged}" Value="Online">
                                                <Setter Property="Fill" Value="{StaticResource stop.ico }" />
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding Status, UpdateSourceTrigger=PropertyChanged}" Value="Offline">
                                                <Setter Property="Fill" Value="{StaticResource play.ico}" />
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Rectangle.Style>
                            </Rectangle>
                        </StackPanel>
                    </Button>
                </StackPanel>

Answer 1

我会在这里建议几件事。我会推荐几何形状和路径，而不是点阵图的ico，而会出现锯齿。使用具有两种状态的按钮，您可以在两个按钮之间进行切换，然后再选择一个按钮即可。下面，我将两个几何放入切换按钮的资源中。这些通常会被放入资源字典中（连同用于肖像学的许多其他几何图形）并合并到app.xaml中。

        <ToggleButton IsChecked="True"
                      IsThreeState="False"
                      >
            <ToggleButton.Resources>
                <Geometry x:Key="StopGeom">
                    M0,0L32,0 32,32 0,32z
                </Geometry>
                <Geometry x:Key="PlayGeom">
                    M0,0L16,8 32,16 16,24 0,32 0,16z
                </Geometry>
            </ToggleButton.Resources>
            <Path Fill="Black"
                  Stretch="Uniform"
                  Margin="4">
                <Path.Style>
                    <Style TargetType="Path">
                        <Setter Property="Data" Value="{StaticResource PlayGeom}"/>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding IsChecked, RelativeSource={RelativeSource AncestorType={x:Type ToggleButton}}}" Value="True">
                                <Setter Property="Data" Value="{StaticResource StopGeom}"/>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Path.Style>
            </Path>
        </ToggleButton>

这需要做更多的工作，但应为您提供一种实现方法的想法。有关布局和几何的更多信息：

https://social.technet.microsoft.com/wiki/contents/articles/32610.wpf-layout-lab.aspx

我不知道您如何设计按钮的形状，但是我用这一点向wpf新手强调了无外观控件的含义：

https://social.technet.microsoft.com/wiki/contents/articles/29866.aspx

如何使用数据触发器更改按钮图标？ wpf

1 个答案: