简体   繁体   中英

Change button background WPF mouseover property with c# conditions

I have a huge problem and I don't know what to do. I am writing a client on c# WPF. I have 3 elements on my form (textbox, passwordbox, button). So I want to change my button background to "active(changing an image)" when people will fill textbox and passwordbox text. Something like login and password.

 private void eventhandler(object sender, RoutedEventArgs e)
    {
        if (login.Text.Length > 0 && password.Password.Length > 0)
        {

            ImageBrush myBrush = new ImageBrush();
            myBrush.ImageSource =
                 new BitmapImage(new Uri("pack://application:,,,/Images/Enter Enabled.bmp", UriKind.Absolute));
            Enter.Background = myBrush;

           }
        else if (login.Text.Length < 1 || password.Password.Length < 1)
        {

            ImageBrush myBrush = new ImageBrush();
            myBrush.ImageSource =
                 new BitmapImage(new Uri("pack://application:,,,/Images/Enter Disabled.bmp", UriKind.Absolute));
            Enter.Background = myBrush;
        }
    }

So I have this c# code. It works but now I have a problem. When I mouseover my button It changes it's background back to "Disabled".

Xaml

<Window x:Class="Test.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="250" Width="288" Background="#FF494949">
<Window.Resources>
    <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
        <Setter Property="FocusVisualStyle">
            <Setter.Value>
                <Style>
                    <Setter Property="Control.Template">
                        <Setter.Value>
                            <ControlTemplate>
                                <Rectangle Margin="2" SnapsToDevicePixels="True" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Background" Value="#FFDDDDDD"/>
        <Setter Property="BorderBrush" Value="#FF707070"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Padding" Value="1"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsDefaulted" Value="True">
                            <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" TargetName="border">
                                <Setter.Value>
                                    <ImageBrush ImageSource="Images/Enter Disabled.bmp"/>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="BorderBrush" TargetName="border" Value="#FF3C7FB1"/>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter Property="Background" TargetName="border">
                                <Setter.Value>
                                    <ImageBrush ImageSource="Images/Enter Pressed.bmp"/>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="BorderBrush" TargetName="border" Value="#FF2C628B"/>
                        </Trigger>
                        <Trigger Property="ToggleButton.IsChecked" Value="True">
                            <Setter Property="Background" TargetName="border" Value="#FFBCDDEE"/>
                            <Setter Property="BorderBrush" TargetName="border" Value="#FF245A83"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Background" TargetName="border" Value="#FFF4F4F4"/>
                            <Setter Property="BorderBrush" TargetName="border" Value="#FFADB2B5"/>
                            <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid Margin="0,0,2,-4.478">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="0*"/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <Button HorizontalAlignment="Left" Name="Enter" Margin="46,92,0,0" VerticalAlignment="Top" Width="127" Height="27" Grid.Column="1" BorderThickness="0" Style="{DynamicResource ButtonStyle1}">
        <Button.Background>
            <ImageBrush ImageSource="Images/Enter Disabled.bmp"/>
        </Button.Background>
    </Button>
    <TextBox Grid.ColumnSpan="2" Name="login" HorizontalAlignment="Left" Height="23" Margin="53,23,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="120" TextChanged="eventhandler"/>
    <PasswordBox Grid.ColumnSpan="2" Name="password" HorizontalAlignment="Left" Margin="53,59,0,0" VerticalAlignment="Top" Width="120" PasswordChanged="eventhandler"/>

</Grid>

I know it's because of Mouseover image brush but how i can lock it or change in c# code with those conditions above. Testapplication

I've uploaded testapp on takebin. So just fill textbox and passwordbox with text and mouseover a button and you will see what's the problem is. Thank you all for replies and any help

Agreed. Remove this if you don't want such behaviour:

   <Trigger Property="IsMouseOver" Value="True">
       <Setter Property="Background" TargetName="border">
            <Setter.Value>
               <ImageBrush ImageSource="Images/Enter Disabled.bmp"/>
            </Setter.Value>
         </Setter>
    <Setter Property="BorderBrush" TargetName="border" Value="#FF3C7FB1"/>
  </Trigger>

The WPF button already has this functionality included in it. you can bind the IsEnabled property of your button to a bool value in your view model and then define the style for enabled, disabled and moseover in your styles xml using visual states.

You'll find the source code for the default WPF button styling here: https://msdn.microsoft.com/en-us/library/ms753328(v=vs.110).aspx

Then you can also change the property bound to IsEnabled according to property changes on your textboxes.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM