Realizza ProgressRing in MahApps.Metro Smaller

Question

Sembra che il controllo ProgressRing di MahApps.Metro abbia come valore predefinito una dimensione minima di 60x60.

Esiste una proprietà per ProgressRing chiamata "IsLarge", ma anche quando è impostata su "False" non sembra avere alcun effetto sulla possibilità di apportare a ProgressRing inferiore a 60x60.

In modo obliquo, la modifica delle proprietà Altezza e Larghezza non influisce su questo.

Considerando GitHUb come il codice C# effettivo per ProgressRing, sembra che ci siano diverse proprietà che influenzano il diametro dell'ellisse, ecc., Ma queste proprietà sono proprietà private e non possono essere impostate da chiamate esterne.

Come posso renderlo più piccolo? Dì 20x20 o 30x30?

Nel codice qui sotto ho specificare IsLarge = False, e impostare la dimensione di 30x30, ma il valore di default ancora a 60x60.

<Window x:Class="WpfApplication3.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro" 
     Title="MainWindow" Height="350" Width="525"> 
    <Window.Resources> 
     <ResourceDictionary> 
      <ResourceDictionary.MergedDictionaries> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colours.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Orange.xaml" /> 
       <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" /> 
      </ResourceDictionary.MergedDictionaries> 
     </ResourceDictionary> 
    </Window.Resources> 
     <Grid> 
      <Controls:ProgressRing IsActive="True" IsLarge="False" Height="30" Width="30"></Controls:ProgressRing> 
     </Grid> 
</Window> 

Qui di seguito sono frammenti di codice dal file "ProgressRing.cs" riportati sulla GitHub - MahApps.Metro

namespace MahApps.Metro.Controls 
{ 
    [TemplateVisualState(Name = "Large", GroupName = "SizeStates")] 
    [TemplateVisualState(Name = "Small", GroupName = "SizeStates")] 
    [TemplateVisualState(Name = "Inactive", GroupName = "ActiveStates")] 
    [TemplateVisualState(Name = "Active", GroupName = "ActiveStates")] 
    public class ProgressRing : Control 


     private void SetMaxSideLength(double width) 
     { 
      MaxSideLength = width <= 60 ? 60.0 : width; 
     } 

     private void SetEllipseDiameter(double width) 
     { 
      if (width <= 60) 
      { 
       EllipseDiameter = 6.0; 
      } 
      else 
      { 
       EllipseDiameter = width * 0.1 + 6; 
      } 
     } 

     private void UpdateLargeState() 
     { 
      Action action; 

      if (IsLarge) 
       action =() => VisualStateManager.GoToState(this, "Large", true); 
      else 
       action =() => VisualStateManager.GoToState(this, "Small", true); 

      if (_deferredActions != null) 
       _deferredActions.Add(action); 

      else 
       action(); 
     } 

EDIT: MainWindow.xaml

<Grid> 
    <Controls:ProgressRing x:Name="PRing" IsLarge="False" MinHeight="15" MinWidth="15" Height="15" Width="15"></Controls:ProgressRing> 
</Grid> 

EDIT: MainWindow.xaml.cs

public partial class MainWindow : Window 
    { 
     public MainWindow() 
     { 
      InitializeComponent(); 
      PRing.EllipseDiameter = 5; 
     } 
    } 

Answer 1

dovete trovare uno stile per ProgressRing e impostare voi stessi il Width e Height. Per me, lo stile si trova in: MahApps.Metro master \ MahApps.Metro \ Themes \ ProgressRing.xaml:

<Style TargetType="{x:Type Controls:ProgressRing}"> 
    <Setter Property="Foreground" Value="{DynamicResource AccentColorBrush}"/> 
    <Setter Property="IsHitTestVisible" Value="False"/> 
    <Setter Property="HorizontalAlignment" Value="Center"/> 
    <Setter Property="VerticalAlignment" Value="Center"/> 
    <Setter Property="MinHeight" Value="30"/> 
    <Setter Property="MinWidth" Value="30"/> 

... 

Per impostazione predefinita, non ci sono Width e Height di 60. Per quanto ho capito, il set semplice Width e Height riguarda direttamente solo le ellissi.

EDIT:

Che cosa farebbe l'anello ancora più piccolo, si può giocare con i parametri EllipseDiameter e EllipseOffset tramite il codice, perché un XAML che non sarà disponibile (come privato).

private void SetEllipseDiameter(double width) 
{ 
    if (width <= 60) 
    { 
     EllipseDiameter = 3.0; // as default 6.0 
    } 
    else 
    { 
     EllipseDiameter = width * 0.1 + 6; 
    } 
} 

private void SetEllipseOffset(double width) 
{ 
    if (width <= 60) 
    { 
     EllipseOffset = new Thickness(0, 12, 0, 0); // as default 24 
    } 
    else 
    { 
     EllipseOffset = new Thickness(0, width * 0.4 + 12, 0, 0); 
    } 
} 

EDIT2:

Per impostare il diametro del Ellipse può essere fatto come segue. Abbiamo proprietà EllipseDiameter setter pubblica:

public double EllipseDiameter 
{ 
    get 
    { 
     return (double)GetValue(EllipseDiameterProperty); 
    } 

    set // default as private 
    { 
     SetValue(EllipseDiameterProperty, value); 
    } 
} 

In SetEllipseDiameter stanno controllando delle dimensioni del Ellipse, se il Width è inferiore a 60 quindi impostare 6.0.Commentiamo

private void SetEllipseDiameter(double width) 
{ 
    //if (width <= 60) 
    //{ 
    // EllipseDiameter = 6.0; 
    //} 
    //else 
    //{ 
    // EllipseDiameter = width * 0.1 + 6; 
    //} 
} 

E nel Style impostare il diametro di Ellipse così:

<Setter Property="MinHeight" Value="30"/> 
<Setter Property="MinWidth" Value="30"/> 
<Setter Property="EllipseDiameter" Value="3.0" /> 

Lo stesso vale per EllipseOffset. Anche lui, in un primo momento privata, e fare controllare per un Width minore di 60:

private void SetEllipseOffset(double width) 
{ 
    // you can drop this check 
    if (width <= 60) 
    { 
     EllipseOffset = new Thickness(0, 24, 0, 0); 
    } 
    else 
    { 
     EllipseOffset = new Thickness(0, width * 0.4 + 24, 0, 0); 
    } 
} 

forgiatura queste operazioni con questi parametri, è possibile configurare il Width e Height di ProgressRing controllo.