简体   繁体   中英

How to Disable DataTrigger based on Situation in WPF XAML?

This is just a Sample Code

In the Sample Code, I'm having 3 Buttons. Each button Visibility is Collapsed by Default, it will be Visible at the time of Mouse Hover in the respective Grid or Border.

The names of the 3 Buttons are

  1. SupremeButton
  2. PowerButton
  3. StarButton

PowerButton has an additional Trigger, when the Button gets Visible then it turns the Background Color to BlueViolet . But the default Background Color is BurlyWood

Additionally two DataTriggers are there for setting Visibility in PowerButton.

  • If SupremeButton gets Visibility Visible then PowerButton turns the Visibility to Visible
  • If StarButton gets Visibility Visible then PowerButton turns the Visibility to Visible

    Here my requirement is I need to Disable the DataTrigger of Background Color for the above said two DataTrigger gets effect. The Result should be the Default Color BurlyWood .

Note : Don't add any Condition in the above said DataTrigger to set the Background Color to BurlyWood. Share your idea, how to byepass the DataTrigger.

My Sample WPF XAML Source Code is

<Grid>
    <Border x:Name="m_Border" Width="100" Height="30" HorizontalAlignment="Center" VerticalAlignment="Top" Background="#FFF2FFC6" Margin="0,20,0,0">
        <Button x:Name="SupremeButton" Content="iApp" HorizontalAlignment="Center" VerticalAlignment="Center" Width="75" >
            <Button.Style>
                <Style>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ElementName=m_Border, Path=IsMouseOver}" Value="false">
                            <Setter Property="Button.Visibility" Value="Collapsed"></Setter>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Button.Style>
        </Button>
    </Border>
    <Grid x:Name="grid" Width="100" Height="30" HorizontalAlignment="Center" VerticalAlignment="Top" Background="#FFF2FFC6" Margin="0,60,0,0">
        <Button x:Name="PowerButton" Content="iApp" HorizontalAlignment="Center" VerticalAlignment="Center" Background="BurlyWood" Width="75" >
            <Button.Style>
                <Style>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ElementName=grid, Path=IsMouseOver}" Value="false">
                            <Setter Property="Button.Visibility" Value="Collapsed"></Setter>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ElementName=PowerButton, Path=Visibility}" Value="Visible">
                            <Setter Property="Button.Background" Value="BlueViolet"></Setter>
                        </DataTrigger>

                        <!-- Visibilty is set by Outer Button -->
                        <DataTrigger Binding="{Binding ElementName=SupremeButton, Path=Visibility}" Value="Visible">
                            <Setter Property="Button.Visibility" Value="Visible"></Setter>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ElementName=StarButton, Path=Visibility}" Value="Visible">
                            <Setter Property="Button.Visibility" Value="Visible"></Setter>
                        </DataTrigger>

                    </Style.Triggers>
                </Style>
            </Button.Style>
        </Button>
    </Grid>
    <Border x:Name="n_Border" Width="100" Height="30" HorizontalAlignment="Center" VerticalAlignment="Top" Background="#FFF2FFC6" Margin="0,100,0,0">
        <Button x:Name="StarButton" Content="iApp" HorizontalAlignment="Center" VerticalAlignment="Center" Width="75" >
            <Button.Style>
                <Style>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ElementName=n_Border, Path=IsMouseOver}" Value="false">
                            <Setter Property="Button.Visibility" Value="Collapsed"></Setter>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Button.Style>
        </Button>
    </Border>
</Grid>

I hope I've understood what you need. When the mouse is over PowerButton it will appear with a BlueViolet background. When the mouse is over one of the other two buttons then PowerButton will appear with a BurlyWood background.

Here is the modified "PowerButton" XAML:-

    <Button x:Name="PowerButton" Content="iApp" HorizontalAlignment="Center" VerticalAlignment="Center" Width="75" >
        <Button.Style>
            <Style TargetType="{x:Type Button}">
                <Setter Property="Background" Value="BlueViolet" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=grid, Path=IsMouseOver}" Value="false">
                        <Setter Property="Button.Visibility" Value="Collapsed"></Setter>
                    </DataTrigger>

                    <!-- Visibilty is set by Outer Button -->
                    <DataTrigger Binding="{Binding ElementName=SupremeButton, Path=Visibility}" Value="Visible">
                        <Setter Property="Button.Visibility" Value="Visible"></Setter>
                        <Setter Property="Background" Value="BurlyWood" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding ElementName=StarButton, Path=Visibility}" Value="Visible">
                        <Setter Property="Button.Visibility" Value="Visible"></Setter>
                        <Setter Property="Background" Value="BurlyWood" />
                    </DataTrigger>

                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>

The problem was with your Background attribute in the <Button> element, which I've removed. (Attribute values in the control's XAML override any values set within styles and triggers, so PowerButton would always have been BurlyWood).

In my version I now set the button background to BlueViolet within the <Style> section. Setting the default with a style <Setter> (instead of in the <Button> XAML) allows triggers to override the value. I also removed your trigger to change the background to BlueViolet, as this is now redundant.

The remaining triggers remain unchanged. These will change the background to BurlyWood when the mouse is over one of the other two buttons .

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