`
love19820823
  • 浏览: 935460 次
文章分类
社区版块
存档分类
最新评论

[WP7] PerformanceProgressBar in depth 深入了解进度条

 
阅读更多

原文地址http://www.windowsphonegeek.com/articles/WP7-PerformanceProgressBar-in-depth


今天想研究一下WP7进度条的使用,进度条是Silverlight for Windows Phone toolkit提供的一个组件,就是5个点滚动显示的进度条效果,很多应用都使用了,用法下面说的很明白了,我也懒得翻译了。



by WindowsPhoneGeek

In this post I am going to talk about the PerformanceProgressBar from the Silverlight for Windows Phone toolkit in depth.

NOTE: Previously we covered all controls from the WP7 toolkit in a series of : 21 WP7 Toolkit in Depth articles covering all controls. So now it is time for a follow up. In the latest Feb 2011 update of the toolkit along with some fixes two new controls were added : PerformanceProgressbar and TiltEffect.

Basically PerformanceProgressBar is an animated indeterminate progress bar, which is used in situations where the extent of the task is unknown or the progress of the task cannot be determined in a way that could be expressed as a percentage or similar. This bar uses animated dots to show that progress is taking place, rather than using the size of the filled portion to show the total amount of progress. It is actually the well known PerformanceProgressBar provided by Jeff Wilcox, which uses the compositor thread exclusively for animation, instead of the UI (user interface) thread.

73-2PerformanceProgressBar is a kind of progress bar implementation for a smoother appearance of the indeterminate states, with the added behavior that after the behavior is no longer needed, it smoothly fades out the dots for a less jarring experience. No exposed Value property. Important - this control is not intended for regular progress bar use, but only indeterminate. As a result, only an IsIndeterminate set of visual states are defined in the nested progress bar template. Use the standard ProgressBar control in the platform for determinate scenarios as there is no performance benefit in determinate mode. For example it can be very useful when implementing animated splash screen.

NOTE: One of the reasons that this is so important is that performance is always an issue when there is a progress bar visible (whether you're parsing data, processing layout changes, or performing network requests), so any issues with bogging down the user interface thread will be more obvious.

NOTE: PerformanceProgressBar is different from the standard ProgressBar. There is an unfortunate performance issue with the default way the PerformanceBar is constructed in the WP7 SDK. To achieve the effect of the dots flying across the screen the standard control actually uses 5 slider controls (where the thumb of the slider is actually styled to be the dots). This generates a lot of work for the UI thread, when in actual fact we want to off load tasks such as animation to the Compositor thread where ever possible and leave the UI thread for things like layout passes and our application logic. (reference:Tips for ProgressBar Performance in WP7).

VisualStructure

73-0NOTE: PerformanceProgressBar derives from Control and its ControlTemplate consists of a customized ProgressBar with some additional elements so that it fits in the Metro UI concept.

NOTE: The RelativeAnimatingContentControl which is in the default ControlTemplate is a very special primitive control that works around a limitation in the core animation subsystem of Silverlight: there is no way to declare in VSM states relative properties, such as animating from 0 to 33% the width of the control, using double animations for translation.

It's a tough problem to solve property, but this primitive, unsupported control does offer a solution based on magic numbers that still allows a designer to make alterations to their animation values to present their vision for custom templates. This is instrumental in offering a Windows Phone ProgressBar implementation that uses the render thread instead of animating UI thread-only properties. This control is not supported other than that it is used by the performance progress bar control. It should not be used elsewhere!


Key Properties

  • ActualIsIndeterminate

This is a dependency property of type bool. It gets or sets the value indicating whether the actual indeterminate property should be reflecting a particular value.

  • IsIndeterminate

This is a dependency property of type bool. It gets or sets a value indicating whether the control is in the indeterminate state.

Sample Usage

To begin using PerformanceProgressBar first add a reference to the Microsoft.Phone.Controls.Toolkit.dll assembly which is installed with the toolkit and you can find it in :
C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Toolkit\Feb11\Bin\ Microsoft.Phone.Controls.Toolkit.dll.

To use the PerformanceProgressBar in the XAML you will have to add the following namespace declaration ("toolkit" prefix declaration):

xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

Here is an example of how to use a PerformanceProgressBar declared in XAML. We will use a ChackBox to show/hide the progress bar (the IsIndeterminate is bound to the IsChecked).

1
2
<CheckBox Content="Show PerformanceProgressBar" IsChecked="{Binding IsIndeterminate, ElementName=performanceProgressBar, Mode=TwoWay}"/>
<toolkit:PerformanceProgressBar x:Name="performanceProgressBar"/>

NOTE: For more info about the ElementBinding check this post: WP7 Element Binding samples

You can declare a PerformanceProgressBar in code behind as well:

1
2
3
4
5
6
7
private void btnGenerate_Click(object sender, RoutedEventArgs e)
{
ProgressBar bar = new ProgressBar();
bar.IsIndeterminate = true;
this.ContentPanel.Children.Add(bar);
}

73-2

NOTE: The property responsible for the color of the animation effect is "Foreground"!

1
<toolkit:PerformanceProgressBar x:Name="performanceProgressBarCustomized" Foreground="Red" Background="Red" IsIndeterminate="True"/>

73-1

That was all about the Silverlight for Windows Phone 7 Toolkit PerformanceProgressBar in depth. The full source code can be downloaded here:

I hope that the article was helpful.

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics