2013-07-21 9 views
6

Wygląda na to, że kontrolka MahApps.Metro ProgressRing ma domyślny minimalny rozmiar 60x60.Wykonaj ProgressRing w MahApps.Metro Smaller

Jest właściwość dla ProgressRing o nazwie "IsLarge", ale nawet gdy jest ustawiona na "Fałsz", wydaje się, że nie ma ona wpływu na to, że ProgressRing ma mniejszy rozmiar niż 60x60.

Obli zmiana właściwości wysokości i szerokości również nie ma na to wpływu.

Patrząc na GitHUb jako aktualny kod C# dla ProgressRing, wygląda na to, że istnieje kilka właściwości wpływających na średnicę elipsy, itp., Ale te właściwości są właściwościami prywatnymi i nie można ich ustawić z zewnątrz.

Jak mogę to zmniejszyć? Powiedz 20x20 lub 30x30?

W poniższym kodzie podaję IsLarge = False i ustawię rozmiar na 30x30, ale nadal będzie to domyślne 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> 

Poniżej znajdują się fragmenty kodu z pliku "ProgressRing.cs" znalezione na 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; 
     } 
    } 

Odpowiedz

7

Trzeba znaleźć styl dla ProgressRing i ustawić sobie Width i Height. Dla mnie styl znajduje się pod adresem: 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"/> 

... 

Domyślnie nie są Width i Height z 60. O ile rozumiem, łatwe ustawienie Width i Height wpływa bezpośrednio tylko na elipsy.

EDIT:

Co może sprawić, że pierścień nawet mniejszy, można poeksperymentować z parametrami EllipseDiameter i EllipseOffset za pomocą kodu, ponieważ XAML nie będzie dostępna (jak prywatnej).

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:

Aby ustawić średnica Ellipse Można to zrobić w następujący sposób. Robimy mają właściwości EllipseDiameter setter publicznego:

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

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

W SetEllipseDiameter sprawdzają się na wielkości Ellipse, jeśli Width jest mniejsza niż 60, a następnie ustawić 6.0.Komentujemy.

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

I Style ustawić średnicę Ellipse tak:

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

To samo dotyczy EllipseOffset. On też, na pierwszy prywatnej, i sprawdzić, czy Width mniejszy niż 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); 
    } 
} 

Kucie te operacje z tych parametrów można skonfigurować Width i Height z ProgressRing kontrolą.

+0

Ustawienie MinHeight i MinWidth wydawały się działać, ale teraz limit wydaje się wynosić 30x30! Jeśli spróbuję i pójdę mniejszy niż to, pozostaje taki sam i zgaduję, ponieważ musi być minimalna wysokość/szerokość wymagana ze względu na średnicę kółek w elipsie? ;-) –

+0

Dodatkowo, próbowałem również ustawić wysokość i szerokość, a także minheight i minwidth na 20x20, i nadal pozostawał przy 30x30. –

+0

@J P: Musisz zmniejszyć szerokość/wysokość elipsy? Lub ustawić szerokość/wysokość mniejszą niż 30x30? Jeśli mniej, to ile? –