在WPF进度条样式老气。增量在酒吧。如何实现与Vista或Windows 7黑幕辉光效果的进度条？ [英] Progress bar style in WPF is old fashioned. Increments in Bars. How to implement a progress bar with vista or windows-7 shady glow effect?
本文介绍了在WPF进度条样式老气。增量在酒吧。如何实现与Vista或Windows 7黑幕辉光效果的进度条？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
在WPF进度条样式老气。增量在酒吧。如何实现与Vista或Windows 7黑幕辉光效果的进度条？
即使签出进度的属性。但是，有没有到发光效果效果相关的属性。
此外，有没有任何动画什么的正常进度条/
$ B不同$ b
在进阶感谢。
编辑
中的代码
<进度HEIGHT =41的HorizontalAlignment =左保证金=372,215,0,0NAME =progressBar1VerticalAlignment =评出的WIDTH =150>
< /进度>
解决方案
滚你自己应该不会太难。
创建具有标准进度条的特性的用户控件
价值
最大
最低
您可以创建一个派生属性，它计算的大小填充$ b -
ProgressBarWidth =（价值/（最大值+最小值）* ControlWidth）：使用一个公式吧$ b 当值，最大值或最小值更新
上的变化
在你的进度条控件模板绑定这个以吧的宽度 - 当Value属性更新，进度条将调整这样
如何使你的酒吧看起来是你的，但我猜你只是想看中的负载填充/渐变/发光效果 - 你可以混合添加这些
免责声明：公式可能是不正确的！
如果你想尝试推出自己的，这里有一个我刚怀孕了，这似乎工作确定
公共部分类MyProgressBar：用户控件
{
公共MyProgressBar（）
{
的InitializeComponent（）;
加载=新RoutedEventHandler（MyProgressBar_Loaded）;
}
无效MyProgressBar_Loaded（对象发件人，RoutedEventArgs E）
{
更新（）;
}
私人静态只读的DependencyProperty MaximumProperty = DependencyProperty.Register（最大的typeof（双），typeof运算（MyProgressBar），新PropertyMetadata（100D，OnMaximumChanged））;
公共双最高
{
{返回（双）的GetValue（MaximumProperty）; }
集合{的SetValue（MaximumProperty，值）; }
}
私人静态只读的DependencyProperty MinimumProperty = DependencyProperty.Register（最小的typeof（双），typeof运算（MyProgressBar），新PropertyMetadata（0D，OnMinimumChanged）） ;
公共双最少
{
{返回（双）的GetValue（MinimumProperty）; }
集合{的SetValue（MinimumProperty，值）; }
}
私人静态只读的DependencyProperty ValueProperty = DependencyProperty.Register（值的typeof（双），typeof运算（MyProgressBar），新PropertyMetadata（50D，OnValueChanged））;
公共double值
{
{返回（双）的GetValue（ValueProperty）; }
集合{的SetValue（ValueProperty，值）; }
}
私人静态只读的DependencyProperty ProgressBarWidthProperty = DependencyProperty.Register（ProgressBarWidth的typeof（双），typeof运算（MyProgressBar），NULL）;
私人双ProgressBarWidth
{
{返回（双）的GetValue（ProgressBarWidthProperty）; }
集合{的SetValue（ProgressBarWidthProperty，值）; }
}
静态无效OnValueChanged（DependencyObject的0，DependencyPropertyChangedEventArgs E）
{
（O作为MyProgressBar）.Update（）;
}
静态无效OnMinimumChanged（DependencyObject的0，DependencyPropertyChangedEventArgs E）
{
（O作为MyProgressBar）.Update（）;
}
静态无效OnMaximumChanged（DependencyObject的0，DependencyPropertyChangedEventArgs E）
{
（O作为MyProgressBar）.Update（）;
}
无效更新（）
{
// -2是边界 - 有可能是因为你这样做的更好的方法//可能希望你的模板具有可变比特像边框宽度等等，你会使用
// TemplateBinding为
ProgressBarWidth = Math.Min（（价值/（最高+最低
）* this.ActualWidth） - 2，this.ActualWidth - 2）;
}
}
在XAML
<用户控件X：类=WpfApplication1.MyProgressBar
的xmlns =http://schemas.microsoft。 COM / WinFX的/ 2006 / XAML /演示
的xmlns：X =http://schemas.microsoft.com/winfx/2006/xaml
的xmlns：MC =HTTP：//模式。 openxmlformats.org/markup-compatibility/2006
的xmlns：D =http://schemas.microsoft.com/expression/blend/2008
MC：可忽略=D
D ：DesignHeight =300D：DesignWidth =300X：NAME =UC>
<网格和GT;
< BORDER =背景白>
< BORDER = BorderBrush灰了borderThickness =1>
<网格和GT;
< Grid.Background>
<一个LinearGradientBrush终点=0.5,1StartPoint可以=0.5,0>
将;渐变停止颜色=＃FFE5E5E5偏移=0/>
<渐变停止颜色=白偏移量=1/>
< /一个LinearGradientBrush>
< /Grid.Background>
<电网WIDTH ={结合ProgressBarWidth，的ElementName = UC}的HorizontalAlignment =左>
< Grid.Background>
<一个LinearGradientBrush终点=1,0.5StartPoint可以=0,0.5>
将;渐变停止颜色=＃FFCBFFD0偏移=0/>
将;渐变停止颜色=＃FF62EF73偏移=1/>
<渐变停止颜色=＃FFAEE56D偏移量=0.39/>
< /一个LinearGradientBrush>
< /Grid.Background>
< /网格和GT;
< /网格和GT;
< /边框>
< /边框>
< /网格和GT;
< /用户控件>
结果：
就像我说的，这样的事情是很容易的，但仍然认为重新定义模板，或因为它不支持在合适的操作系统
下面glowyness使用原来它后，我加入了百分比依赖属性并绑定到，在控件模板：
代码更新百分比是
百分比= Math.Min（（INT）（值/（最大+最小）* 100），100）;
编辑2：
我搞砸填充和增加了一个白色的内边框使其看上去更加有光泽。唯一缺少的是有光泽的动画
顶一个是我的控制，下一个是默认的WPF有一个
记住，这一切可能只是通过编辑进度条控件模板
下面是更新后的XAML：
<用户控件X：类=WpfApplication1.MyProgressBar
的xmlns =http://schemas.microsoft.com/winfx/2006/xaml/presentation
的xmlns：X =http://schemas.microsoft.com/winfx/2006/xaml
的xmlns：MC =http://schemas.openxmlformats.org/markup-compatibility/2006
的xmlns：D =http://schemas.microsoft.com/expression/blend/2008
MC：可忽略=D
D：DesignHeight =300D：DesignWidth =300 X：NAME =UC>
<网格和GT;
< BORDER =背景白BorderBrush =灰了borderThickness =1>
< BORDER = BorderBrush白了borderThickness =1>
<网格和GT;
< Grid.Background>
<一个LinearGradientBrush终点=0.5,1StartPoint可以=0.5,0>
将;渐变停止颜色=＃FFE5E5E5偏移=0/>
<渐变停止颜色=白偏移量=1/>
< /一个LinearGradientBrush>
< /Grid.Background>
<电网WIDTH ={结合ProgressBarWidth，的ElementName = UC，FallbackValue = 200}的HorizontalAlignment =左>
< Grid.Background>
<一个LinearGradientBrush终点=1,0.5StartPoint可以=0,0.5>
将;渐变停止颜色=＃FF8BBA91偏移=0/>
将;渐变停止颜色=＃FF8BBA91偏移=1/>
<渐变停止颜色=＃FF9ED76A偏移量=0.8/>
<渐变停止颜色=＃FF9ED76A偏移量=0.2/>
< /一个LinearGradientBrush>
< /Grid.Background>
< /网格和GT;
< BORDER>
< Border.Background>
<一个LinearGradientBrush终点=0.5,1StartPoint可以=0.5,0>
将;渐变停止颜色=＃89E2E2E2偏移=0/>
<渐变停止颜色=＃C1FFFFFF偏移量=0.5/>
<渐变停止颜色=透明偏移量=0.52/>
< /一个LinearGradientBrush>
< /Border.Background>
< /边框>
< TextBlock中的HorizontalAlignment =中心VerticalAlignment =中心文本={结合率，的ElementName = UC}>< / TextBlock的>
< /网格和GT;
< /边框>
< /边框>
< /网格和GT;
< /用户控件>
Progress bar style in WPF is old fashioned. Increments in Bars. How to implement a progress bar with vista or windows-7 shady glow effect ?
Even checked out the properties of the Progressbar. But, there is no properties related to glowy effect.
Also, is there any animations or something different from normal progress bar/
Thanks in Adv.
Edit The Code
<ProgressBar Height="41" HorizontalAlignment="Left" Margin="372,215,0,0" Name="progressBar1" VerticalAlignment="Top" Width="150">
</ProgressBar>
解决方案
Roll your own shouldn't be too hard.
Create a usercontrol which has the properties of a standard progress bar
Value
Maximum
Minimum
You can create a derived property which calculates the size of the bar by using the a formula:
ProgressBarWidth = (Value / (Maximum + Minimum) * ControlWidth) - Padding
Which changes when the Value, Maximum or Minimum is updated
Bind this to the Width of the 'bar' in your progress bar control template - this way when the Value property is updated, the progress bar will resize.
How your bar looks is up to you, but I guess you just want a load of fancy fills/gradients/glow effects - you can add these in Blend
Disclaimer: Formulas may be incorrect!
In case you want to try and roll your own, here's one I just knocked up which seems to work ok
public partial class MyProgressBar : UserControl
{
public MyProgressBar()
{
InitializeComponent();
Loaded += new RoutedEventHandler(MyProgressBar_Loaded);
}
void MyProgressBar_Loaded(object sender, RoutedEventArgs e)
{
Update();
}
private static readonly DependencyProperty MaximumProperty = DependencyProperty.Register("Maximum", typeof(double), typeof(MyProgressBar), new PropertyMetadata(100d, OnMaximumChanged));
public double Maximum
{
get { return (double)GetValue(MaximumProperty); }
set { SetValue(MaximumProperty, value); }
}
private static readonly DependencyProperty MinimumProperty = DependencyProperty.Register("Minimum", typeof(double), typeof(MyProgressBar), new PropertyMetadata(0d, OnMinimumChanged));
public double Minimum
{
get { return (double)GetValue(MinimumProperty); }
set { SetValue(MinimumProperty, value); }
}
private static readonly DependencyProperty ValueProperty = DependencyProperty.Register("Value", typeof(double), typeof(MyProgressBar), new PropertyMetadata(50d, OnValueChanged));
public double Value
{
get { return (double)GetValue(ValueProperty); }
set { SetValue(ValueProperty, value); }
}
private static readonly DependencyProperty ProgressBarWidthProperty = DependencyProperty.Register("ProgressBarWidth", typeof(double), typeof(MyProgressBar), null);
private double ProgressBarWidth
{
get { return (double)GetValue(ProgressBarWidthProperty); }
set { SetValue(ProgressBarWidthProperty, value); }
}
static void OnValueChanged(DependencyObject o, DependencyPropertyChangedEventArgs e)
{
(o as MyProgressBar).Update();
}
static void OnMinimumChanged(DependencyObject o, DependencyPropertyChangedEventArgs e)
{
(o as MyProgressBar).Update();
}
static void OnMaximumChanged(DependencyObject o, DependencyPropertyChangedEventArgs e)
{
(o as MyProgressBar).Update();
}
void Update()
{
// The -2 is for the borders - there are probably better ways of doing this since you
// may want your template to have variable bits like border width etc which you'd use
// TemplateBinding for
ProgressBarWidth = Math.Min((Value / (Maximum + Minimum) * this.ActualWidth) - 2, this.ActualWidth - 2);
}
}
The XAML
<UserControl x:Class="WpfApplication1.MyProgressBar"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300" x:Name="uc">
<Grid>
<Border Background="White">
<Border BorderBrush="Gray" BorderThickness="1">
<Grid>
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFE5E5E5" Offset="0" />
<GradientStop Color="White" Offset="1" />
</LinearGradientBrush>
</Grid.Background>
<Grid Width="{Binding ProgressBarWidth, ElementName=uc}" HorizontalAlignment="Left">
<Grid.Background>
<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
<GradientStop Color="#FFCBFFD0" Offset="0" />
<GradientStop Color="#FF62EF73" Offset="1" />
<GradientStop Color="#FFAEE56D" Offset="0.39" />
</LinearGradientBrush>
</Grid.Background>
</Grid>
</Grid>
</Border>
</Border>
</Grid>
</UserControl>
The result:
Like I said, something like this is pretty easy but still consider redefining the template or using the original since it does support glowyness on the right OS
Here it is after I added a 'Percent' dependency property and bound to that in the control template:
Code for updating Percent was
Percentage = Math.Min((int)(Value / (Maximum + Minimum) * 100), 100);
Edit 2:
I messed with the fills and added a white inner border so it looks more shiny. The only thing missing is the shiny animation
the top one is my control, the bottom one is the default WPF one
Bear in mind, all of this may be possible just by editing the progress bar control template
Here's the updated XAML:
<UserControl x:Class="WpfApplication1.MyProgressBar"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300" x:Name="uc">
<Grid>
<Border Background="White" BorderBrush="Gray" BorderThickness="1">
<Border BorderBrush="White" BorderThickness="1">
<Grid>
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFE5E5E5" Offset="0" />
<GradientStop Color="White" Offset="1" />
</LinearGradientBrush>
</Grid.Background>
<Grid Width="{Binding ProgressBarWidth, ElementName=uc, FallbackValue=200}" HorizontalAlignment="Left">
<Grid.Background>
<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
<GradientStop Color="#FF8BBA91" Offset="0" />
<GradientStop Color="#FF8BBA91" Offset="1" />
<GradientStop Color="#FF9ED76A" Offset="0.8" />
<GradientStop Color="#FF9ED76A" Offset="0.2" />
</LinearGradientBrush>
</Grid.Background>
</Grid>
<Border>
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#89E2E2E2" Offset="0" />
<GradientStop Color="#C1FFFFFF" Offset="0.5" />
<GradientStop Color="Transparent" Offset="0.52" />
</LinearGradientBrush>
</Border.Background>
</Border>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding Percentage, ElementName=uc}"></TextBlock>
</Grid>
</Border>
</Border>
</Grid>
</UserControl>
这篇关于在WPF进度条样式老气。增量在酒吧。如何实现与Vista或Windows 7黑幕辉光效果的进度条？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
