Archive

Posts Tagged ‘Blend’

Neue Expression Blend Beispiele

August 26th, 2009

Auf Codeplex wurde gerade ein unglaublich geniales Projekt inkl. Sourcecode und voller Designtime-Unterstützung veröffentlich.

Link: http://expressionblend.codeplex.com

Darin enthalten sind einige typischen Behaviors für den Umgang mit dem MediaElement.

Der absolute Hammer (sorry), ist der MouseGestureTrigger, der es erlaubt Mausgestiken zu definieren auf die reagiert werden kann, z.B. man zeichnet mit der Maus einen Haken, dies wird tatsächlich als Haken erkannt.

Was ist alles drin?

 

Media Behaviors

  • PlayMedia – Startet ein Medienelement
  • PauseMedia – Pausiert ein Medienelement
  • TogglePlayPauseMedia – Wechselt zwischen Play und Pause hin und her
  • RewindMedia – “Spult” ein Medienelement automatisch zurück
  • StopMedia -  Stoppt ein Medienelement

Trigger

  • MouseGestureTrigger – Triggert ein Ereignis, wenn der Benutzer eine Gestik mit der Maus auf einem Element macht. Die Gestik selber kann man in Blend über die Eigenschaften definieren
    MouseGestureTrigger.png
  • MouseEventTrigger – Löst ein Ereignis aus wenn z.B. ein Doppelklick oder ein Klick mit zeitgleich gedrückter Taste getätigt wurde
    MouseDownEventTrigger.png
  • StateChangedTrigger – Wird ausgelöst wenn sich ein Zustand ändert

Daten Behaviors

 

  • CallDataMethod – Aufruf einer Data Context Methode
<i:EventTrigger EventName="Click">
    <si:CallDataMethod Target="{Binding ShoppingCart.CurrentItem}" Method="Remove"/>
</i:EventTrigger>

  • InvokeDataCommand – Aufruf eines Data Context Commands
<i:EventTrigger EventName="Click">
      <si:InvokeDataCommand Command="{Binding ShoppingCart.CheckOutCommand}"/>
</i:EventTrigger>
  • DataEventTrigger – Löst eine Aktion aus, wenn ein Ereignis des Data Contextes ausgelöst wird.
<si:DataEventTrigger Source="{Binding User}" EventName="MessageSent">
      <im:PlaySoundAction Source="Bell.wma"/>
</si:DataEventTrigger>
  • SetDataProperty – Zuweisen von Eigenschaften
<i:EventTrigger EventName="Click">
      <si:SetDataProperty
Binding='{Binding ItemCount, Mode=TwoWay}'
Increment='True'
Value='1'/>
</i:EventTrigger>
  • DataStateBehavior – Wechselt zwischen verschiedenen Visual States
<DataTemplate x:Key='User'>
      <Grid>
            <VisualStateManager.VisualStateGroups>
                  ...
            </VisualStateManager.VisualStateGroups>
            <i:Interaction.Behaviors>
                  <si:DataStateBehavior
Binding='{Binding IsLoggedIn}'
Value='True'
TrueState='LoggedInState' FalseState='LoggedOutState'/>
            </i:Interaction.Behaviors>
      </Grid>
</DataTemplate>

  • DataStateSwitchBehavior – Definiert die Art der Zustandsübergänge bei Visual States wechsel
<si:FluidBindProperty
Binding='{Binding Population}'
PropertyName='Height'
Duration='0:0:0.1'>
      <si:FluidBindProperty.Ease>
            <ElasticEase EasingMode="EaseOut"/>
      </si:FluidBindProperty.Ease>
</si:FluidBindProperty>

  • PropertyChangedTrigger – Feuert wenn ein Ereignis eintritt
<si:PropertyChangedTrigger Binding="{Binding IsActive}">
	<si:PlayMedia/>
</si:PropertyChangedTrigger>

Additional Behaviors

  • ClippingBehavior – Beschneidet ein beliebiges Element in ein Rechteck mit runden Ecken
  • GoToNextState – Navigiert zum nächsten Zustand im Visual State Manager
  • GoToPreviousState – Navigiert zum vorherigen Zustand im Visual State Manager
  • SetProperty – Setzt eine Eigenschaft bzw. kann Werte erhöhen oder verringern
  • ShowMessageBox – Zeigt eine Nachricht in einem Standard-Fenster an

Prototyping Behaviors

  • ListBoxAddOne – Fügt ein Element zu einer Liste hinzu
  • ListBoxRemoveOne -  Entfernt ein zufälliges Element aus der Liste
  • ListBoxRemoveThisItem – Entfernt das selektierte Element aus der Liste

Effects

This contains many of the effects from the WPF FX (http://www.codeplex.com/fx) project packaged up with full design-time support inside of Blend.

Social:
  • Print this article!
  • del.icio.us
  • Facebook
  • Twitter

Designer, Developer, Silverlight