2016-09-16 14 views
0

Ich möchte einen Stil für das Raster definieren, wo ich die Randstärke des Rasters basierend auf verschiedenen Zuständen ändern möchte. Wie bei der Maus/dem Mauszeiger möchte ich die Dicke 1 und im Normalzustand (wenn der Punkt nicht über dem Gitter ist) 0,5 haben. Außerdem hat mein Grid ein Textfeld, wenn dieses Textfeld scharf ist (wird bearbeitet), sollte der Grid-Rahmen auf 1 gesetzt werden (wie Zeiger über Zustand).Visuelle Zustände für Raster

Hier ist mein Code:

<Grid> 
    <TextBox 
     BorderThickness="0" 
     Height="40" 
     Text="Text" /> 
</Grid> 

Antwort

1

Sie Stil Trigger können über Dicke in der Maus zu ändern. Für Textfeld Fokus erhalten Sie Event Trigger.

+0

Dieser Link wird Ihnen helfen, dies zu erreichen. http://www.wpf-tutorial.com/styles/trigger-datatrigger-event-trigger/ –

+0

Danke für den Link. Eigentlich gibt es keine Style.Triggers in UWP. Auch, wie ich die Grenze des Rasters nicht den Rand des Textfelds ändern möchte. Kann ich das Zielelement irgendwie an die Stelle binden, an der ich die Eigenschaft der Randstärke ändern möchte? – tavier

+0

Ich habe nach WPF erklärt. Ich denke, das sollte in UWP gleich sein. –

1

Wenn Sie auf UWP sind, können Sie die Xaml Interactivity-Bibliothek verwenden, um dies auszulösen. Ein Beispiel:

<Page> 
    <Page.Resources> 
     <Storyboard x:Name="HideTextBoxAnimation"> 
      <DoubleAnimation 
       Storyboard.TargetName="TxtBx" 
       Storyboard.TargetProperty="Opacity" 
       From="1" 
       To="0" 
       Duration="0:0:0.2" /> 
     </Storyboard> 
    </Page.Resources> 
    <Grid> 
     <i:Interaction.Behaviors> 
      <core:EventTriggerBehavior EventName="Tapped"> 
       <media:ControlStoryboardAction Storyboard="{StaticResource HideTextBoxAnimation}" /> 
      </core:EventTriggerBehavior> 
     </i:Interaction.Behaviors> 
     <TextBox x:Name="TxtBx" Opacity="1" 
      BorderThickness="0" 
      Height="40" 
      Text="Text" /> 
    </Grid> 
</Page> 

Dies ist nicht das genaue Storyboard, auf das Sie gewartet haben, aber ich denke, Sie bekommen. Ändern Sie einfach den EventName des EventTriggerBehavior und das Storyboard nach Ihren Bedürfnissen.

Ganz oben auf der Seite, die Sie diese brauchen werden:

xmlns:i="using:Microsoft.Xaml.Interactivity" 
xmlns:core="using:Microsoft.Xaml.Interactions.Core" 
xmlns:media="using:Microsoft.Xaml.Interactions.Media" 

Hoffnung, das hilft.

1

Es kann definitiv in UWP getan werden. Sie lassen Sie nicht Style Trigger verwenden (warum, ich habe keine Ahnung), aber stattdessen müssen Sie VisualState s und Storyboard s verwenden. Sie sind viel unordentlicher und komplizierter als WPF Triggers, IMHO, aber sie funktionieren und so funktionieren alle UWP-Standardstile.

Wenn Sie noch nicht haben, sollten Sie die default UWP styles and templates überprüfen. Button ist ein good place to start. Sie können genau sehen, wie sie die visuellen Eigenschaften der Button in Reaktion auf die verschiedenen VisualState s ändern. Leider - und das ist, wo Trigger nützlich gewesen wären - die Beziehung zwischen den Eingabeereignissen und der VisualState s ist alles in Code getan, also wenn die eingebauten VisualState s für die Steuerelemente, die Sie verwenden, nicht für Ihre geeignet sind müssen Sie sie manuell im Code-Behind einstellen. Sie können jedoch weiterhin verschiedene Style s für dasselbe Steuerelement verwenden, was Ihr Hauptziel zu sein scheint.

Mischung ist auch sehr nützlich für solche Sachen, wie Sie alle Ihre Storyboard s ziemlich leicht testen können.

Hoffe, das hilft. Übrigens habe ich vor etwa einem Jahr auf Windows Store/UWP verzichtet und bin wieder auf WPF zurückgekommen und habe nicht zurückgeschaut. Wenn der Desktop App Converter endlich auf dem Weg ist, sehe ich keinen Grund, UWP zu benutzen, es sei denn, Sie möchten auf der XBox sein, aber das ist Ihr Aufruf. :)