Ikona MahApps.Metro nie pokazuje się

Question

Próbuję dodać przycisk "odświeżania" na pasku tytułowym okna, używając MahApps.Metro 0.13.1.0.

My App.xaml to:

<Application x:Class="VersionSwitcher.App" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      StartupUri="Views/MainWindow.xaml" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      d1p1:Ignorable="d" 
      xmlns:d1p1="http://schemas.openxmlformats.org/markup-compatibility/2006"> 
    <Application.Resources> 
     <ResourceDictionary> 
      <ResourceDictionary.MergedDictionaries> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" /> 
       <ResourceDictionary Source="/Resources/Icons.xaml" /> 
      </ResourceDictionary.MergedDictionaries> 
      <vm:ViewModelLocator x:Key="Locator" d:IsDataSource="True" xmlns:vm="clr-namespace:VersionSwitcher.ViewModel" /> 
     </ResourceDictionary> 
    </Application.Resources> 
</Application> 

A potem w moim MainWindow.xaml:

<Controls:MetroWindow.WindowCommands> 
    <Controls:WindowCommands> 
     <Button ToolTip="{x:Static p:Resources.Button_Refresh}" 
       Style="{DynamicResource MetroCircleButtonStyle}" Width="30" Height="30"> 
       <Rectangle Fill="Black"> 
        <Rectangle.OpacityMask> 
         <VisualBrush Stretch="Fill" 
            Visual="{DynamicResource appbar_refresh}" /> 
        </Rectangle.OpacityMask> 
       </Rectangle> 
     </Button> 
    </Controls:WindowCommands> 
</Controls:MetroWindow.WindowCommands> 

dostaję szary okrąg wewnątrz paska tytułowego, ale nie ma ikony! Każda ikona (z Resources/Icons.xaml) robi to samo.

Jeśli ikona jest umieszczona w treści okna zamiast na pasku tytułu, robi to samo.

Co przeoczyłem?

Dzięki!

Aktualizacja

I odkryli, że ustawienie szerokość i wysokość prostokąta pokazuje ikonę. Co muszę zrobić, aby zawsze wypełniać przycisk?

Answer 1

Nie widać to cos Rectangle ma swój rozmiar jak 0 dla ActualWidth i ActualHeight które można zobaczyć poprzez Snoop

Jeśli nie wiem zbyt wiele o WPF jak wspomniano w komentarzu, zacząć od zaznajomienie się z Snoop. Doskonałe narzędzie, które można zaoszczędzić od wielu drapania głowy chwil :)

tak prostym językiem, jesteśmy dodanie Rectangle jako Content z Button. Teraz przycisk ma pewne wymiary. Jednak Rectangle nie kończy się, a tym samym kończy na 0. Jeśli był to jakiś tekst, uzyskałby on domyślny rozmiar.

Aby go posortować, nadaj prostokątowi odpowiednią szerokość/wysokość.

Jeśli chcesz, aby prostokąt był wielkości przycisku, możesz użyć powiązania RelativeSource dla szerokości i wysokości, aby uzyskać je z przycisku. Jednak w twoim przypadku jest to przycisk Styled, który już używa elipsy, więc będzie potrzebował trochę dopełnienia.

MahApps.Metro z github:

ButtonsExample.xaml

pokazuje ich proponowanego podejścia: (zawartość z wyraźną wielkości mniejszej niż macierzystego Buttona)

<Button Width="50" 
     Height="50" 
     Margin="0, 10, 0, 0" 
     Style="{DynamicResource MetroCircleButtonStyle}"> 
    <Rectangle Width="20" 
       Height="20" 
       Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}"> 
     <Rectangle.OpacityMask> 
      <VisualBrush Stretch="Fill" 
          Visual="{DynamicResource appbar_city}" /> 
     </Rectangle.OpacityMask> 
    </Rectangle> 
</Button>