[C#, XAML/WPF] Probleem met Triggers

Pagina: 1
Acties:

Onderwerpen


Acties:
  • 0 Henk 'm!

  • Hyperz
  • Registratie: Augustus 2009
  • Laatst online: 09-07 02:45
Hoi :)

Ik ben hier een beetje aan het prutsen met Visual Studio 2010 B2 en .NET 4. Nu heb ik een simpel WPF app gemaakt met daarin onder andere 2 GroupBox's die wat buttons en textboxes hebben. De opacity van die 2 groupbox's is 0.5. Nu is het mijn bedoeling om via een animatie de opacity naar 1.0 te brengen wanneer de cursor erover is of één van de childs input focus heeft. Dus heb ik deze style in mijn window recources geplaatst:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
        <Style x:Key="gbFadeStyle" TargetType="{x:Type GroupBox}">
            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsMouseOver" Value="False" />
                        <Condition Property="IsKeyboardFocusWithin" Value="False" />
                    </MultiTrigger.Conditions>
                    <MultiTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="0.5" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiTrigger.EnterActions>
                </MultiTrigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
                <Trigger Property="IsKeyboardFocusWithin" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
            </Style.Triggers>
        </Style>


Om één of andere reden haalt die MultiTrigger niets uit. Wanneer ik hem verplaats onder de andere 2 triggers werkt niets meer :?. Wat doe ik hier fout?

Asus P8P67 EVO | i5 2500k (4.8 GHz) | Sapphire HD 7970 Vapor-X GHz Ed. | 8 GB DDR3 1600 | 1 TB HDD


Acties:
  • 0 Henk 'm!

  • JMaster
  • Registratie: December 2009
  • Laatst online: 19-09 11:14
Misschien moet je andere Triggers weghalen en testen wat er dan gebeurt?

Acties:
  • 0 Henk 'm!

  • TheNameless
  • Registratie: September 2001
  • Laatst online: 07-02 21:38

TheNameless

Jazzballet is vet!

Als je een style definieerd in een resourcedictionary en je geeft die een key, moet je wel het volgende doen:
XML:
1
<GroupBox Style="{StaticResource gbFadeStyle}"/>


Als je namelijk je style geen key geeft, dan wordt die style toegepast op alle object van het type dat je in je TargetType opgeeft (implicit styling is de term hiervan).
Als je wel een key opgeeft dan verlies je deze functie en moet je expliciet je style opgeven.

Hoop dat het zo een beetje duidelijk is ;)


Dit werkt:
XML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<Window x:Class="WpfApplication1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300">
    <Window.Resources>
        <Style x:Key="gbFadeStyle" TargetType="{x:Type GroupBox}">
            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsMouseOver" Value="False" />
                        <Condition Property="IsKeyboardFocusWithin" Value="False" />
                    </MultiTrigger.Conditions>
                    <MultiTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="0.5" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiTrigger.EnterActions>
                </MultiTrigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
                <Trigger Property="IsKeyboardFocusWithin" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <GroupBox Opacity="0.5" Style="{StaticResource gbFadeStyle}">
            <Button Content="Test" Width="50" Height="50"/>
        </GroupBox>
    </Grid>
</Window>


Dit ook:
XML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<Window x:Class="WpfApplication1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300">
    <Window.Resources>
        <Style TargetType="{x:Type GroupBox}">
            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsMouseOver" Value="False" />
                        <Condition Property="IsKeyboardFocusWithin" Value="False" />
                    </MultiTrigger.Conditions>
                    <MultiTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="0.5" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiTrigger.EnterActions>
                </MultiTrigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
                <Trigger Property="IsKeyboardFocusWithin" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <GroupBox Opacity="0.5">
            <Button Content="Test" Width="50" Height="50"/>
        </GroupBox>
    </Grid>
</Window>


Dit NIET:
XML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<Window x:Class="WpfApplication1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300">
    <Window.Resources>
        <Style x:Key="gbFadeStyle" TargetType="{x:Type GroupBox}">
            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsMouseOver" Value="False" />
                        <Condition Property="IsKeyboardFocusWithin" Value="False" />
                    </MultiTrigger.Conditions>
                    <MultiTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="0.5" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiTrigger.EnterActions>
                </MultiTrigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
                <Trigger Property="IsKeyboardFocusWithin" Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                                 To="1.0" Duration="0:0:0.5" />
                            </Storyboard>
                        </BeginStoryboard>
                    </Trigger.EnterActions>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <GroupBox Opacity="0.5">
            <Button Content="Test" Width="50" Height="50"/>
        </GroupBox>
    </Grid>
</Window>

[ Voor 88% gewijzigd door TheNameless op 01-02-2010 16:50 ]

Ducati: making mechanics out of riders since 1946


Acties:
  • 0 Henk 'm!

  • Hyperz
  • Registratie: Augustus 2009
  • Laatst online: 09-07 02:45
Ik had idd Style="{StaticResource gbFadeStyle}" aan mijn groupboxes toegevoegd. Na nog wat prutsen heb ik het werkende gekregen door de 2 normale Triggers te verwijderen en de animatie in MultiTrigger.ExitActions te plaatsen. Heb dus meer dan 2 uur zitten sukkelen terwijl de oplossing eigenlijk redelijk obvious was.

Toch snap ik niet waarom de MultiTrigger niet werkte met de twee andere Triggers. Logica zegt mij dat dat toch zou moeten werken?

Asus P8P67 EVO | i5 2500k (4.8 GHz) | Sapphire HD 7970 Vapor-X GHz Ed. | 8 GB DDR3 1600 | 1 TB HDD


Acties:
  • 0 Henk 'm!

  • Niemand_Anders
  • Registratie: Juli 2006
  • Laatst online: 09-07-2024

Niemand_Anders

Dat was ik niet..

Hyperz schreef op maandag 01 februari 2010 @ 18:05:
Toch snap ik niet waarom de MultiTrigger niet werkte met de twee andere Triggers. Logica zegt mij dat dat toch zou moeten werken?
Daar had ik in het begin ook moeite mee. Maar je moet er iets anders tegen aan kijken. Via templates en styles defineer je de standaard layout.

Middels een trigger kun je iets veranderen en dat blijft zo lang de conditie die aan de trigger is gekoppeld nog steeds true terug geeft. Zodra de trigger niet meer voldoet aan de conditie krijgt je de oude (originele) style weer terug. Als je dus een trigger koppelt aan IsMouseOver=true hoef je dus niet zoals bij CSS een IsMouseOut aktie te schrijven. Alle veranderingen welke IsMouseOver=true heeft doorgevoerd worden terug gedraaid.

Het enigste verschil tussen een trigger en een multitrigger is dat je met een multitrigger meerdere condities kunt 'groeperen'. Dat maakt het onderhoud ietsje gemakkelijker.

Overigens gebruiken vaak autoassigned styles:
XML:
1
2
3
<Style x:key="{x:Type GroupBox}" TargetType="GroupBox">
  ...
</Style>

Op deze manier is het iets gemakkelijker om de look & feel consistent te houden. Ik vind het alleen erg jammer dat Microsoft met .NET 4.0 nog steeds geen horizontal en vertical alignment heeft toegevoegd aan de gridview. Persoonlijk heb ik weinig gridview gezien waarvan waardes niet rechts uitgelijnd moeten worden. Gelukkig zijn er bedrijven zoals Telerik welke in dat gat springen.

If it isn't broken, fix it until it is..


Acties:
  • 0 Henk 'm!

  • JMaster
  • Registratie: December 2009
  • Laatst online: 19-09 11:14
@Hyperz: Dat bedoelde ik idd met de andere Triggers weghalen. ExitActions had ik over het hoofd gezien.
Pagina: 1