Question

我在我的应用程序中使用以下 ControlTemplate 作为图片按钮。

App.xaml 中的控制模板位于下方。

<!--Below is the style for all ImageButtons in this project -->
    <Style x:Key="ButtonStyleIB" TargetType="Button">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/>
        <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
        <Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/>
        <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/>
        <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>
        <!--<Setter Property="Padding" Value="10,3,10,5"/>-->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid x:Name="grid" Background="Transparent">
                        <Grid.Projection>
                            <PlaneProjection/>
                        </Grid.Projection>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="MouseOver"/>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="-25" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="grid" />
                                        <!--d:IsOptimized="True"-->
                                        <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.CenterOfRotationX)" Storyboard.TargetName="grid" />
                                        <!--d:IsOptimized="True"-->
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Margin="0" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

现在在我的页面中，我正在创建如下按钮。

  <Button x:Name="saveButton" Style ="{StaticResource ButtonStyleIB}" VerticalAlignment="Center" Click="save_button_clicked">
            <Image Source="/STCDirectory;component/Images/save.png" Stretch="Fill" />
        </Button>

到此为止它很好。因此，当我运行应用程序时，显示带有图像的按钮。它工作正常。

现在基于一些内部条件，我想禁用图像按钮。因此，对于禁用按钮我正在使用以下代码。

saveButton.IsEnabled = false;

因此，根据上述步骤，图像按钮无法点击。

但我想在按钮被禁用时也更改图像。

我怎么能做到这一点。

Answer 1

不要在按钮中直接显示图像你可以用字符串属性绑定它，点击按钮你可以将该字符串更改为另一个uri，然后它会将按钮的图像更改为新图像。

我希望这可能有所帮助......

Answer 2

你可以使用imagesource绑定来实现..首先像这样定义你的按钮。

  <Button Grid.Row="1" x:Name="saveButton" Style ="{StaticResource ButtonStyleIB}" VerticalAlignment="Center" Click="saveButton_Click_1" Width="300" Height="50">
        <Image Source="{Binding ImageSource}" Stretch="Fill" />
    </Button>

并在你的page.xaml.cs中创建属性ImageSource。

public partial class MainPage : PhoneApplicationPage , INotifyPropertyChanged
{
    // Constructor
    public MainPage()
    {
        InitializeComponent();
        ImageSource = "/Assets/1.jpg";
        this.DataContext = this;
    }
    private string _ImageSource;
    public string ImageSource
    {
        get
        {
            return _ImageSource;
        }
        set
        {
            _ImageSource = value;
            FirePropertyChanged("ImageSource");
        }
    }
    public event PropertyChangedEventHandler PropertyChanged;
    protected void FirePropertyChanged(string propertyName)
    {
        if (this.PropertyChanged != null)
        {
            this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    private void saveButton_Click_1(object sender, RoutedEventArgs e)
    {
        ImageSource = "/Assets/2.jpg";
        saveButton.IsEnabled = false;
    }


}

这里1.jpg和2.jpg是我切换过的图像。

在Windows Phone 8中设置禁用按钮的图像

2 个答案: