none
Trigger mouseover dans un template de bouton dans App.xaml RRS feed

  • Question

  • Bonjour,

    Je débute en WPF, et je suis à la fois impressionné et perdu dans ce nouveau mode de fonctionnement pour moi.

    Je m'amuse à tester les différentes possibilités, et essayais de créer un template global pour mes boutons valider et annuler.

    J'ai réussi àcréer mon template dans le APP.XAML, mais je bloque pour ajouter un trigger sur le mouse over. Je voulais mettre la bordure de mon bouton en couleur jaune / or...

    Voici le code de mon template :

       
    <ControlTemplate x:Key="ButtonValiderTemplate" TargetType="{x:Type Button}">
                <Border CornerRadius="10" Margin="0,0,0,0">
                    <Border.Background>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF21D339" Offset="0"/>
                            <GradientStop Color="#FF057800" Offset="1"/>
                        </LinearGradientBrush>
                    </Border.Background>
                    <WrapPanel>
                        <Image Source="Resources\bouton_tick.png" Margin="5,0,0,0" Stretch="None"  />
                        <TextBlock Text="Valider" Foreground="White" 
                                               HorizontalAlignment="Center"                                           
                                               Margin="5,0,0,0"
                                               Height="Auto"
                                               FontSize="20" Width="Auto" VerticalAlignment="Center">
                        </TextBlock>
                    </WrapPanel>
                </Border>
                <!--<ControlTemplate.Triggers>
                  l'idée est de mettre le border color à goldenrod.
                </ControlTemplate.Triggers>-->
            </ControlTemplate>

    J'ai commenté mon comtroltemplate.triggers, puisque je n'arrive pas à accéder aux propriétés de mon border.

    Il y aurait-il une âme charitable à m'aider et me guider dans ma démarche ?

    Merci d'avance !!!!!


    pieret

    mardi 31 juillet 2018 18:38

Réponses

  • Ca y est, je m'en suis sorti... Si quelqu'un est interessé, voici le code :

    <ControlTemplate x:Key="ButtonValiderTemplate" TargetType="{x:Type Button}">
                <Border x:Name="MyBorder" CornerRadius="10" Margin="0,0,0,0">
                    <Border.Background>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF21D339" Offset="0"/>
                            <GradientStop Color="#FF057800" Offset="1"/>
                        </LinearGradientBrush>
                    </Border.Background>
                    <WrapPanel>
                        <Image Source="Resources\bouton_tick.png" Margin="5,0,0,0" Stretch="None"  />
                        <TextBlock Text="Valider" Foreground="White" 
                                               HorizontalAlignment="Center"                                           
                                               Margin="5,0,0,0"
                                               Height="Auto"
                                               FontSize="20" Width="Auto" VerticalAlignment="Center">
                        </TextBlock>
                    </WrapPanel>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" TargetName="MyBorder" Value="goldenrod"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>

    Il fallait nommer le contrôle à changer (le border en l'occurence) pour le spécifier en targetname dans le setter.


    pieret

    • Marqué comme réponse glaudioman mardi 31 juillet 2018 21:21
    mardi 31 juillet 2018 21:21