Aktionsleisten und App-Leisten (Android-Apps im Vergleich zu Windows Store-Apps)

Applies to Windows and Windows Phone

Hier erfahren Sie, wie Sie von der Aktionsleiste in Android-Apps auf die App-Leiste in Windows Store-Apps für Windows 8 umstellen.

In Android-Apps können Sie die Aktionsleiste verwenden. Dabei handelt es sich um eine Gruppe von Leisten am oberen Rand einer Aktivität (oder eine geteilte Aktionsleiste sowohl am oberen als auch am unteren Rand). Diese Leisten enthalten Steuerelemente, über die Benutzer mit kontextbezogenen Aktionen interagieren oder zwischen Aktivitäten navigieren können.

Von Windows Store-Apps wird die App-Leiste verwendet, die weitestgehend die gleiche Funktion wie die Android-Aktionsleiste erfüllt. App-Leisten können oben und/oder unten auf einer Seite platziert werden. App-Leisten sind standardmäßig ausgeblendet und können mithilfe von einfachen Benutzeraktionen angezeigt werden, z. B. per Streifbewegung vom oberen oder unteren Rand, Rechtsklick mit der Maus oder Drücken der Tastenkombination Windows+Z. Sie können App-Leisten auch mithilfe von Code anzeigen oder ausblenden.

Vergleichen wir nun Aktionsleisten in Android mit App-Leisten in Windows 8. Anschließend erfahren Sie, wie Sie ein Beispiel für eine Windows Store-App mit einer App-Leiste erstellen.

Vergleich der Schritte für die Codierung von Aktionsleisten für Android und der Schritte für die Codierung von App-Leisten für Windows Store-Apps

Wenn Sie die Aktionsleiste in Android-Apps bereits verwendet haben, wird Ihnen die Funktionalität des Steuerelements für die App-Leiste in Windows Store-Apps bekannt vorkommen. Im Folgenden werden die Unterschiede zwischen den Plattformen erläutert:

SchritteAndroidWindows 8

Erstellen der Aktionsleiste oder App-Leiste und Hinzufügen der benötigten Steuerelemente

Legen Sie als mindestens erforderliches SDK oder Ziel-SDK für das Projekt die API-Ebene 11 (Android 3.0 Honeycomb) oder höher fest. (Wenn Sie eine geteilte Aktionsleiste verwenden möchten, verwenden Sie API-Ebene 14 oder höher.) Rufen Sie dann die onCreateOptionsMenu-Methode der Aktivität auf. Diese Methode ruft eine Menüressource auf, die Sie definiert haben, um die Liste der Menüelemente abzurufen.

Verwenden Sie das App-Leistensteuerelement, und fügen Sie der App-Leiste verschiedene Steuerelemente hinzu, beispielsweise Schaltflächen, Kontrollkästchen oder Optionsfelder. Weitere Informationen finden Sie unter Steuerungsdesign für Windows Store-Apps, Schnellstart: Hinzufügen von App-Leisten und Schnellstart: Hinzufügen von Steuerelementen und Behandeln von Ereignissen.

Optional: Legen Sie das Erscheinungsbild der Aktionsleiste oder App-Leiste fest.

Schließen Sie von Ihnen definierte Stilverweise in das Design der Aktivität ein, beispielsweise android:actionBarStyle und android:actionBarSplitStyle.

Legen Sie die Stile der Layoutpanels fest, die in der App-Leiste verwendet werden sollen. Sie können das Erscheinungsbild mit verschiedenen Stileigenschaften wie beispielsweise Background definieren. Siehe Schnellstart: Definieren von Layouts.

Optional: Legen Sie das Erscheinungsbild der Menüelemente auf der Aktionsleiste oder der Steuerelemente auf der App-Leiste fest.

Schließen Sie von Ihnen definierte Stilverweise in das Design der Aktivität ein, beispielsweise android:actionButtonStyle, android:actionMenuTextColor und android:actionMenuTextAppearance.

Sie können das Erscheinungsbild mit verschiedenen Eigenschaften anpassen, beispielsweise Foreground, BorderThickness und FontSize. Siehe Schnellstart: Formatieren von Steuerelementen und Schnellstart: Formatieren von Schaltflächen auf der App-Leiste.

Behandeln Sie Ereignisse auf der Aktionsleiste oder App-Leiste.

Deklarieren Sie den android:onClick-Wert für das Menüelement in der Menüressourcendatei. Definieren Sie die entsprechende Methode in der Codedatei der Aktivität.

Implementieren Sie einen Ereignishandler mit der Signatur void method(object sender, RoutedEventArgs e) in der CodeBehind-Datei, und legen Sie diese Methode als Click-Eigenschaft des entsprechenden Steuerelements fest. Weitere Informationen zum Behandeln von Steuerelementereignissen finden Sie unter Schnellstart: Hinzufügen von Steuerelementen und Behandeln von Ereignissen.

 

Nach oben

Beispiel für eine App-Leiste

In diesem Beispiel wird das Erstellen einer Windows Store-App mit einer App-Leiste veranschaulicht.

Hinweis  Unter Windows 8.1 ändert sich die Vorgehensweise zum Definieren von App-Leisten. Ausführlichere Informationen hierzu finden Sie im Blogbeitrag Neues zur App-Leiste unter Windows 8.1.
  1. Erstellen der App: In diesem Beispiel erstellen wir die App mit der C#-Vorlage Leere App.
    1. Öffnen Sie Microsoft Visual Studio, und klicken Sie zum Erstellen eines neuen Projekts auf Microsoft Visual C# > Windows-App > Leere App (XAML).
    2. Öffnen Sie im Fenster Projektmappen-Explorer die Datei MainPage.xaml. Wenn die XAML-Ansicht noch nicht angezeigt wird, klicken Sie auf die Schaltfläche für die horizontale Aufteilung, um sie zu öffnen.
    3. Fügen Sie in der Datei MainPage.xaml zwischen dem öffnenden <Grid ...>- und dem schließenden </Grid>-Element diesen Extensible Application Markup Language-(XAML-)Code hinzu.
      
      // Windows 8
      <Grid.RowDefinitions>
          <RowDefinition Height="70"/>
          <RowDefinition Height="*"/>
      </Grid.RowDefinitions>
      <TextBlock Text="App bar sample" Style="{StaticResource PageHeaderTextStyle}" Grid.Row="0" Margin="20,0,0,10"/>
      
      // Windows 8.1
      <Grid.RowDefinitions>
              <RowDefinition Height="70"/>
              <RowDefinition Height="*"/>
       </Grid.RowDefinitions>
      <TextBlock Text="Appbar Sample" Style="{StaticResource HeaderTextBlockStyle}"  Grid.Row="0" Margin="20,0,0,10"/>
      
      
  2. Fügen Sie der Seite ein App-Leistensteuerelement hinzu, und fügen Sie dann der App-Leiste Button-Steuerelemente hinzu.
    1. Fügen Sie in der Datei MainPage.xaml direkt vor den öffnenden </Grid> und schließenden </Page> Elementen den folgenden Code hinzu.
      
      // Windows 8
      <Page.BottomAppBar>
          <AppBar x:Name="bottomAppBar" Padding="10,0,10,0" Background="Gray">
              <Grid>
                  <StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
                      <Button Style="{StaticResource EditAppBarButtonStyle}" />
                      <Button Style="{StaticResource RemoveAppBarButtonStyle}" />
                      <Button Style="{StaticResource AddAppBarButtonStyle}" />
                  </StackPanel>
              </Grid>
          </AppBar>
      </Page.BottomAppBar>
      
      // Windows 8.1 
       <Page.BottomAppBar>
              <CommandBar>
                  <CommandBar.PrimaryCommands>
                      <AppBarButton Icon="Edit" Label="Edit"/>
                      <AppBarButton Icon="Remove" Label="Remove"/>
                      <AppBarButton Icon="Add" Label="Add" />
                  </CommandBar.PrimaryCommands>
              </CommandBar>
          </Page.BottomAppBar>
      
      
    2. Falls Sie für Windows 8 entwickeln, müssen Sie Allgemein > StandardStyles.xaml öffnen. Suchen Sie nach EditAppBarButtonStyle, RemoveAppBarButtonStyle oder AddAppBarButtonStyle, und heben Sie die Kommentierung des Abschnitts auf, in dem die Einträge definiert sind. Entfernen Sie die Markierung <!-- und --> vor bzw. nach dem Abschnitt, in dem die Einträge definiert sind. Bei Windows 8.1-Apps ist dieser Schritt nicht erforderlich.
    3. Klicken Sie auf Debuggen > Debuggen starten, oder drücken Sie F5, um die App auszuführen. Wenn Sie die App-Leiste anzeigen möchten, führen Sie eine Streifbewegung vom oberen oder unteren Rand des Bildschirms aus, klicken Sie mit der rechten Maustaste, oder drücken Sie die Tastenkombination WINDOWS+Z.
  3. Behandeln von Ereignissen der Schaltflächen in der App-Leiste: Halten Sie in Visual Studio die App an, indem Sie auf Debuggen > Debugging beenden klicken (oder indem Sie die Tastenkombination UMSCHALT+F5 drücken).
    1. Aktualisieren Sie
      
      // Windows 8
      <Button Style="{StaticResource EditAppBarButtonStyle}" />
      // Windows 8.1
      <AppBarButton Icon="Edit" Label="Edit"/>
      
      
      in der Datei MainPage.xaml mit dem folgenden XAML-Code:
      
      // Windows 8
      <Button Style="{StaticResource EditAppBarButtonStyle}" Click="EditButton_Click" />
      // Windows 8.1
      <AppBarButton Icon="Edit" Label="Edit" Click="EditButton_Click" />
      
      
      Hiermit wird festgelegt, dass der EditButton_Click-Ereignishandler aufgerufen wird, wenn ein Benutzer auf die Bearbeitungsschaltfläche auf der App-Leiste klickt.
    2. Fügen Sie am Anfang der Datei MainPage.xaml.cs den folgenden Code hinzu: using Windows.UI.Popups;.
    3. Fügen Sie direkt vor der schließenden Klammer der MainPage-Klassendefinition den folgenden Code hinzu.
      
      private async void EditButton_Click(object sender, RoutedEventArgs e)
      {
          MessageDialog dlg = new MessageDialog("Edit clicked");
          await dlg.ShowAsync();
      }
      
      
    4. Klicken Sie auf Debuggen > Debuggen starten, oder drücken Sie F5, um die App erneut auszuführen. Zeigen Sie die App-Leiste erneut an, und klicken Sie dann auf die Schaltfläche Edit. Daraufhin wird die Meldung "Edit clicked" angezeigt.

Nach oben

Verwandte Themen

Schnellstart: Hinzufügen von App-Leisten
Schnellstart: Formatieren von Schaltflächen auf der App-Leiste
Schnellstart: Hinzufügen von Steuerelementen und Behandeln von Ereignissen
Neues zur App-Leiste unter Windows 8.1

 

 

Anzeigen:
© 2015 Microsoft