Frage

Ich verwende einen WPF Expander eine Reihe von analogen Prozessvariablen anzuzeigen.

Ich mag die Grenze ‚glüht‘ Expander machen (oder Flash), wenn eine dieser Variablen in einer ‚Warnung‘ oder ‚Alarm‘ -Zustand.

Um dies zu erreichen, ich bin einige Daten unter Verwendung löst gebunden an ein paar boolean Eigenschaften meiner Ansicht nach Modell ( ‚AnalogWarningActive‘ und ‚AnalogAlarmActive‘). Die Daten lösen Auftakt ein Storyboard, das die Expander Grenze Opazität beseelt.

Die Daten lösen Arbeit, wie ich erwarten würde: die richtige Grenze Farbe erscheint und die Opazität Animation beginnt. Allerdings gibt es zwei Probleme:

  1. Die Trübung des gesamten Expander (und alle Kontrollen enthalten) verändert und nicht nur die Opazität seiner Grenze.

  2. Wenn die 'AnalogWarningActive' und 'AnalogAlarmActive' Tags auf False zurückgeben, verschwindet die Grenze, aber die opactiy Animation auf unbestimmte Zeit fortgesetzt (dh. Die gesamten Expander weiter in und auszublenden).

Hier ist die XAML Ich verwende:

<SolidColorBrush x:Key="AnalogAlarmBrush" Color="#FFFF8080" />
<SolidColorBrush x:Key="AnalogWarningBrush" Color="#FFFFFF80" />

<Storyboard x:Key="AlarmBorderFlasher" AutoReverse="True" RepeatBehavior="Forever">
    <DoubleAnimation  
        Storyboard.TargetProperty="(Border.Opacity)" 
        From="1.0" To="0.4" 
        Duration="0:0:0.8" />
</Storyboard>

<Expander Header="Test Data" IsExpanded="True">
    <Expander.Style>
        <Style TargetType="{x:Type Expander}">
            <Style.Triggers>

                <DataTrigger Binding="{Binding Path=AnalogWarningActive}" Value="True" >

                    <DataTrigger.EnterActions>
                        <BeginStoryboard Name="WarningBorderStoryboard" Storyboard="{StaticResource AlarmBorderFlasher}" />
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <StopStoryboard BeginStoryboardName="WarningBorderStoryboard" />
                    </DataTrigger.ExitActions>

                    <DataTrigger.Setters>
                        <Setter Property="BorderBrush" Value="{StaticResource AnalogWarningBrush}" />
                        <Setter Property="BorderThickness" Value="4" />
                    </DataTrigger.Setters>

                </DataTrigger>

                <DataTrigger Binding="{Binding Path=AnalogAlarmActive}" Value="True" >

                    <DataTrigger.EnterActions>
                        <BeginStoryboard Name="AlarmBorderStoryboard" Storyboard="{StaticResource AlarmBorderFlasher}" />
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <StopStoryboard BeginStoryboardName="AlarmBorderStoryboard" />
                    </DataTrigger.ExitActions>

                    <DataTrigger.Setters>
                        <Setter Property="BorderBrush" Value="{StaticResource AnalogAlarmBrush}" />
                        <Setter Property="BorderThickness" Value="4" />
                    </DataTrigger.Setters>

                </DataTrigger>

            </Style.Triggers>
        </Style>
    </Expander.Style>

    <!-- snipped the contents of the expander (a tabcontrol and a few text boxes, labels, etc)-->

</Expander>
War es hilfreich?

Lösung

Frage # 1

Die Opazität auf einem Visual wie Border Einstellung betrifft, dass Visual und alle seine Nachkommen. Deshalb Einstellung Border.Opacity macht alles verschwinden.

Sie haben zwei Möglichkeiten: 1. Animate die Grenze Stricheigenschaft oder 2. Ändern Sie den Inhalt nicht ein Nachkomme von Border sein

.

, um die Stricheigenschaft Animieren ist, um Code trivial, hat aber den Nachteil, dass nicht alle Bürsten leicht animierbar zu transparent sind und zurück. Zum Beispiel ist dies mit Gefälle Bürste schwierig. Auch wenn Ihre Grenzen eine Vielzahl von Farben waren und Sie wollten nicht zu 100% gehen transparent gibt es keine gute Möglichkeit, den Hub zu animieren, ohne die Farbe zu ändern.

Ändern des Inhalts nicht ein Nachkomme von Border zu sein, ist sehr einfach, und ist das, was ich geneigt wäre, in den meisten Fällen zu tun. Ersetzen Sie einfach:

<Border x:Name="MyBorder" Stroke="Red" StrokeThickness="3" CornerRadius="6">
  <my:ContentHere />
</Border>

mit dieser:

<Grid>
  <Border x:Name="MyBorder" Stroke="Red" StrokeThickness="3" Stroke="Red" CornerRadius="6">
  <Border Stroke="Transparent" StrokeThickness="3" CornerRadius="Red">
    <my:ContentHere />
  </Border>
</Grid>

Nun ist die Undurchsichtigkeit der sichtbaren Grenze kann animiert werden, während das transparent man das Layout und Clipping des Kindes steuert.

Wenn Sie keine haben Corner oder anderes lustiges Geschäft, können Sie nur eine Marge auf dem Inhalt gesetzt und die transparente Grenze verzichten:

<Grid>
  <Border x:Name="MyBorder" Stroke="Red" StrokeThickness="3" />
  <my:ContentHere Margin="3" />
</Grid>

Frage 2

Auf dem ersten Blick sehe ich kein Problem mit Ihrem XAML, die die Animation verursachen würden am Laufen zu halten, nachdem der Auslösewert zurück auf false geht, aber ich habe nicht sehr genau hinsehen. Von dem, was ich bemerkte, würde ich denke, es ist die Animation auf dem aktuellen Wert aufhören würde, nicht verlassen, es läuft.

Sie könnten versuchen, StopStoryboard mit RemoveStoryboard ersetzen. RemoveStoryboard sollte die animierten Objekte zurück auf die ursprünglichen Werte zurückgesetzt.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top