Set Icon auf SecondaryCommand von CommandBar

Ich habe eine Befehlsleiste Breite sekundäre Befehle:Set Icon auf SecondaryCommand von CommandBar

<CommandBar> 
    <AppBarButton Icon="Back" Label="Back" Click="AppBarButton_Click"/> 
    <AppBarButton Icon="Stop" Label="Stop" Click="AppBarButton_Click"/> 
    <AppBarButton Icon="Play" Label="Play" Click="AppBarButton_Click"/> 
    <AppBarButton Icon="Forward" Label="Forward" Click="AppBarButton_Click"/> 

    <CommandBar.SecondaryCommands> 
     <AppBarButton Icon="Like" Label="Like" Click="AppBarButton_Click"/> 
     <AppBarButton Icon="Dislike" Label="Dislike" Click="AppBarButton_Click"/> 
    </CommandBar.SecondaryCommands> 
</CommandBar>

Warum die Vorlieben und Abneigungen Symbole werden nicht angezeigt?

Quelle

2015-12-17 Cristian Cundari

In Windows 8.1 waren primäre und sekundäre Befehle eine Möglichkeit, die Schaltflächen links und rechts zu platzieren. Unter Windows 10 UWP werden sekundäre Befehle auf Desktop und Telefon in ein Flyout-Menü verschoben. In diesem Flyout-Menü werden standardmäßig keine Symbole angezeigt.

Die SecondaryCommands-Auflistung kann nur AppBarButton-, AppBarToggleButton- oder AppBarSeparator-Befehlselemente enthalten. Die sekundären Befehle werden im Überlaufmenü angezeigt, wenn die CommandBar geöffnet ist.

Quelle: MSDN.

Wenn Sie versuchen möchten, den Stil zu überschreiben, werfen Sie einen Blick auf die OverflowPopup Steuerung und CommandBarOverflowPresenter Stil in generic.xaml, um loszulegen.

C: \ Program Files (x86) \ Windows-Kits \ 10 \ Designtime \ CommonConfiguration \ Neutral \ UAP \ 10.0.10240.0 \ Generisches \ generic.xaml

Quelle

2015-12-17 19:29:15 Bart

Zum Beispiel, wenn Sie den Outlook-Mail-App öffnen, wenn Sie auf dem CommandBar auf „mehr“ klicken sie zeigt Symbole für jedes Element darin. [Image] (http://s8.postimg.org/x0c5hlgvp/wp_ss_20151217_0001.png) –

Es ist nicht, weil "es in Windows (Phone)" ist, dass es out of the Box für uns Entwickler funktioniert. Das ist ein Fehler, den viele Kunden von uns machen und verlangen. Aber wie bereits erwähnt, können Sie die Standardstile selbst überschreiben. – Bart

Ok ich guck mal, danke für deine Hilfe. –

ich mit einem anderen habe kommen Ansatz. Hoffe das hilft.

Die Idee besteht darin, den Checked Zustand eines AppBarToggleButton zu verwenden.

Erstellen Sie eine weitere Klasse, die erweitert AppBarToggleButton.

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using Windows.UI.Xaml; 
using Windows.UI.Xaml.Controls; 
using Windows.UI.Xaml.Input; 

namespace <YOUR_NAMESPACE> 
{ 
    sealed class SecondaryIconButton : AppBarToggleButton 
    { 
     public static readonly DependencyProperty GlyphProperty = DependencyProperty.Register(
      "Glyph", typeof(string), typeof(SecondaryIconButton) 
      , new PropertyMetadata(SegoeMDL2.Accept, OnGlyphChanged)); 

     public string Glyph 
     { 
      get { return (string) GetValue(GlyphProperty); } 
      set { SetValue(GlyphProperty, value); } 
     } 

     private TextBlock GlyphText; 

     public SecondaryIconButton(string Glyph) 
      :base() 
     { 
      IsChecked = true; 
      this.Glyph = Glyph; 
     } 

     protected override void OnApplyTemplate() 
     { 
      base.OnApplyTemplate(); 
      GlyphText = (TextBlock) GetTemplateChild("OverflowCheckGlyph"); 
      GlyphText.Width = GlyphText.Height = 16; 

      UpdateGlyph(); 
     } 

     // Force the button to always be checked 
     protected override void OnPointerReleased(PointerRoutedEventArgs e) 
     { 
      base.OnPointerReleased(e); 
      IsChecked = true; 
     } 

     private void UpdateGlyph() 
     { 
      if (GlyphText == null) return; 
      GlyphText.Text = Glyph; 
     } 

     private static void OnGlyphChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) 
     { 
      ((SecondaryIconButton) d).UpdateGlyph(); 
     } 
    } 
}

Beachten Sie, dass SegeoMDL2.Accept ist auch eine benutzerdefinierte Klasse, abgeleitet von:
https://msdn.microsoft.com/windows/uwp/style/segoe-ui-symbol-font

Jetzt können Sie dies in Ihrem XAML aufrufen mit:

<ns:SecondaryIconButton Glyph="&#xE73E;" />

Oder schaffen es hinter in Code:

new SecondaryIconButton(Glyph) { Label = Label };

Referenz:
SecondaryIconButton.cs
SegoeMDL2.cs

Quelle

2016-11-09 09:16:36 user1510539

Set Icon auf SecondaryCommand von CommandBar

Antwort

Verwandte Themen