wpf 使 MahApps.Metro 中的 ProgressRing 更小

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17774185/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-13 09:15:35  来源:igfitidea点击:

Make the ProgressRing in MahApps.Metro Smaller

c#wpfmahapps.metro

提问by J P

It looks like the MahApps.Metro ProgressRing control defaults to a Minimum size of 60x60.

看起来 MahApps.Metro ProgressRing 控件默认为 60x60 的最小尺寸。

There is a property for the ProgressRing called "IsLarge", but even when it is set to "False" it seems to have no effect on being able to make to ProgressRing smaller than 60x60.

ProgressRing 有一个名为“IsLarge”的属性,但即使将其设置为“False”,它似乎也无法使 ProgressRing 小于 60x60。

Obiviously changing the Height and Width properties do not affect this either.

显然,更改 Height 和 Width 属性也不会影响这一点。

Looking on GitHUb as the actual c# code for the ProgressRing, it looks like there are several properties to affect ellipse diameter, etc, but these properties are private properties, and can not be set from outside calls.

在 GitHUb 上查看 ProgressRing 的实际 c# 代码,看起来有几个属性会影响椭圆直径等,但这些属性是私有属性,不能从外部调用中设置。

How can I make this smaller? Say 20x20 or 30x30?

我怎样才能使这个更小?说 20x20 还是 30x30?

In the below code I specify IsLarge=False, and set the size to 30x30, but it still defaults to 60x60.

在下面的代码中,我指定 IsLarge=False,并将大小设置为 30x30,但它仍然默认为 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>

Below are snippets of code from the "ProgressRing.cs" file found on GitHub - MahApps.Metro

以下是GitHub 上的“ProgressRing.cs”文件中的代码片段- 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

编辑: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

编辑:MainWindow.xaml.cs

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

采纳答案by Anatoliy Nikolaev

You have to find a style for ProgressRingand set yourself the Widthand Height. For me, the style is located at: MahApps.Metro master \ MahApps.Metro \ Themes \ ProgressRing.xaml:

你必须找到一种风格ProgressRing并为自己设置WidthHeight。对我来说,样式位于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"/>

...

By default, there are Widthand Heightof 60. As far as I understand, easy set Widthand Heightdirectly affects only the ellipses.

默认情况下,也有WidthHeight60。据我了解,简单设置WidthHeight直接影响椭圆。

EDIT:

EDIT:

What would make the ring even smaller, you can play around with the parameters EllipseDiameterand EllipseOffsetthrough code, because a XAML they will not be available (as private).

什么会使环更小,您可以使用参数EllipseDiameterEllipseOffset通过代码进行操作,因为 XAML 它们将不可用(作为private)。

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:

EDIT2:

To set the diameter of the Ellipsecan be done as follows. We do have properties EllipseDiametersetter public:

Ellipse可以按如下方式设置直径。我们确实有属性EllipseDiametersetter public

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

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

In SetEllipseDiameterare checking on the size of the Ellipse, if the Widthis less than 60 then set 6.0. We comment out.

SetEllipseDiameter检查 的大小Ellipse,如果Width小于 60,则设置 6.0。我们注释掉。

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

And in Styleset the diameter of Ellipselike that:

并在Style设置直径Ellipse这样的:

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

The same goes for EllipseOffset. He, too, at first private, and have check for a Widthsmaller than 60:

也是如此EllipseOffset。他也一开始是private,并且检查了Width小于 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);
    }
}

Forging these operations with these parameters, you can configure the Widthand Heightof ProgressRingcontrol.

锻造这些操作这些参数,您可以配置WidthHeightProgressRing控制。