Button Style Creators Update UWP

Question

Ich versuche, den Effekt der Schaltfläche wie in den Windows 10 Creators Update-Apps zu bekommen.

Beispiel Button-Bild

.

Ich habe bereits eingesetzt, um die Acryl-Effekt mit dem SDK:

MainPage.xaml Code:

<Page 
x:Class="App1.MainPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:App1" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d"> 

<Grid x:Name="BaseGrid" Background="{ThemeResource SystemControlAcrylicElementBrush}"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="300"/> 
      <ColumnDefinition/> 
     </Grid.ColumnDefinitions> 
     <Grid Grid.Column="1" HorizontalAlignment="Stretch" Background="White"> 
     </Grid> 
    </Grid> 
</Grid> 

MainPage.xaml.cs Code:

public sealed partial class MainPage : Page 
{ 
    public MainPage() 
    { 
     this.InitializeComponent(); 
     Windows.UI.Xaml.Media.AcrylicBrush myBrush = new Windows.UI.Xaml.Media.AcrylicBrush(); 
     myBrush.BackgroundSource = Windows.UI.Xaml.Media.AcrylicBackgroundSource.HostBackdrop; 
     myBrush.TintColor = Color.FromArgb(255, 202, 24, 37); 
     myBrush.FallbackColor = Color.FromArgb(255, 202, 24, 37); 
     myBrush.TintOpacity = 0.6; 
     BaseGrid.Background = myBrush; 
    } 
} 

Aber Wie ist es möglich, den "leichten" Effekt der Maus bei ihrer Passage zu haben, den Welleneffekt bei der klicken?

Sollte es ein einzigartiger Stil sein?

danke im voraus!

Answer 1

Ich bin extrem vertraut mit dem Beispiel, das Sie aus der Google Maps App gepostet haben. Der Effekt, den Sie suchen, heißt reveal. Es gibt eine Reihe von Stilen, die Sie verwenden können, um den Effekt für verschiedene Steuerelemente zu aktivieren (z. B. ButtonRevealStyle für Schaltflächen). Unter AutoSuggestBox möchten Sie den Effekt für die Elemente in der Vorschlagsliste aktivieren.

Wenn Sie eine ListView haben und in ihren ListViewItem-Elementen auch Schaltflächen oder aufrufbaren Inhalt geschachtelt haben, sollten Sie Reveal für die verschachtelten Elemente aktivieren.

Um dies zu tun, müssen Sie die ItemContainerStyle Eigenschaft auf AutoSuggestBox zu einem benutzerdefinierten ListViewItem Stil festlegen, die auf den ListViewItemRevealStyle basieren. Wenn Sie daran interessiert sind, was in diesem Stil passiert, können Sie es in generic.xaml überprüfen.