The Progress Bar - DevExpress XPF Blog

May 2011 - Posts

• Performance Improvements of DevExpress Silverlight Controls in 2011.1

  In my yesterday’s post, I discussed the compatibility of our upcoming 2011.1 controls with the Silverlight 5 platform as well as the memory consumption improvements that developers and end-users will benefit from. That is however not the only improvements you are bound to see... thanks to a multitude of optimizations applied to our core products, you will notice dramatic performance improvements as well as decreased memory utilization across the board. What are the performance improvements? Loading themes on demand _ Themes for dependency features will no longer be loaded automatically unless they corresponding control is invoked within the application. As an example, if you have an application with a DXGrid control and have also included the ability to print/export the grid, only theme resources for the DXGrid control are loaded. The themes for the dependency features – in this case the printing library – will only be loaded when the end-user actually attempts to preview and print the grid control. While I used our Silverlight Grid control as an example, note that this is implemented across the board for all of our Silverlight products. _ Refactoring _ We have thoroughly refactored our XAML markup to improve the loading performance of our controls. _ Unlinked themes _ The code for theme libraries has been greatly improved so that theme modules can be unlinked, delivering outstanding performance and end-user experience. _ Test bed Configuration To compare the memory consumption of our Silverlight controls between each version, we used a machine with the following specifications: CPU: Intel Core 2 Duo 3.00 GHz Memory: 4GB OS: Windows 7 Enterprise, SP1, 32-Bit Browser: Internet Explorer 9 Silverlight Runtime Version: 4.0.60310.0 DevExpress Silverlight Controls: 2010.2 and 2011.1 For the scenarios, we created two sample applications that were put through rigorous tests, gradually increasing memory allocation. The standard memory consumption was measured at launch and then repeated every time another theme was applied to the application. Results The first test was a simple application with a DevExpress Silverlight Grid control bound to a data source. You can see the double-digit memory utilization decrease when themes are applied at runtime: The second test application was designed to mimic the look and feel of Microsoft Outlook, combining the use of the DevExpress Silverlight Grid, Silverlight Ribbon, and the Silverlight NavBar controls. As you’ll see in the chart below, memory consumption was still noticeably lower than the 10.2 version of the controls: Posted May 13 2011, 03:38 PM by Emil Mesropian (DevExpress) with no comments Filed under: Silverlight, v2011.1, Memory, Performance

• DevExpress Silverlight Controls and Silverlight 5

  What do we do when a new Silverlight version is announced and made publicly available as a beta? We make sure that our controls not only work in the new release, but also provide outstanding performance! That’s exactly what we have done with our upcoming 2011.1 Silverlight controls and the Silverlight 5 Public Beta. Following several compatibility testing runs and performance comparisons, we are proud to announce that our 2011.1 release of Silverlight products will be compatible with the Silverlight 5 platform! While there remain a few minor issues – reproducible only in very specific scenarios - that are introduced as part of the currently available build of Silverlight 5, we’ll continue to work with Microsoft to ensure those are resolved and have no affect on our products’ overall functionality and stability. But, we wouldn’t rest with just compatibility. Using our controls with Silverlight 5 also produced some amazing results in terms of memory consumption. Let’s take a look at some numbers... Here we have a sample application using our Silverlight Grid Control bound to a sample data source: You can see the dramatic improvement in memory consumption compared to Silverlight 4 when the application is loaded as well as when any of our themes are applied to our application. We then took this a step further and created another sample application – one mimicking the look and feel of an Outlook-style application. This application was using our Silverlight Grid, Silverlight Ribbon, and Silverlight NavBar controls: Using the same measurement criteria, we see similar results in terms of improved memory consumption. So, how do you – the developer – benefit from this? You get an existing suite of advanced Silverlight controls that are not only compatible with the new Silverlight 5 platform, but also use up to 21% less memory in typical application scenarios. Posted May 12 2011, 04:35 PM by Emil Mesropian (DevExpress) with 1 comment(s) Filed under: Silverlight, v2011.1, Memory

• Silverlight and WPF Splash Screen

  Splash screens... with the powerful computers and devices on the market, one may argue that they are no longer needed. While certainly a valid argument with regards to native application performance, the need for some sort of an automated loading/splash screen is increasingly becoming relevant again thanks to ever-expanding rich internet applications. As developers, we all know that not all of our customers are bound to have high-end machines or top-of-the line internet connectivity, as such providing a good user experience during application startup is a crucial component. Splash Screens are easy to implement, but we at DevExpress decided to make it even easier for implementation within your Silverlight and WPF applications. Thus we are introducing the DXSplashScreen for Silverlight and WPF in the upcoming 2011.1 release of DXperience. How does it work in Silverlight? The DXSplashScreen can be added to your Silverlight application’s web project using a new item template: Click image for a larger version. Once selected, the required XAML and JavaScript content are generated and also added to your project. This will make sure that the splash screen is automatically run during application startup. When loaded, the default splash screen will look as follows: How does it work in WPF? The WPF version of DXSplashScreen can be added to the project in the same manner: Click image for a larger version. Following selection, the splash screen XAML file is generated and added to the project. You can then use a single line of code to invoke the splash screen at application startup and then use another line of code to close it once resource loading has been completed. The default splash screen features a marquee progress bar, but of course, this can be easily changed through code. Furthermore, since the splash screen is rendered using standard XAML markup, you can completely customize it to match your application’s look and feel. This is what the standard splash screen design looks like: Posted May 12 2011, 04:10 PM by Emil Mesropian (DevExpress) with 24 comment(s)

• Silverlight Grid – Design Time Enhancements

  The upcoming 2011.1 release of DXperience introduces powerful design-time support for our Silverlight Grid control within Visual Studio 2010 and Expression Blend. The enhancements include the intuitive Quick Customization Panel that enables lightning-fast access to required objects, changing the view type as well as modifying its settings, populating a view with columns and finally, assigning column data editors. The screenshot above shows that column headers can now be clicked to select the column and set its properties. The following short clip shows how the design-time functionality can be used to add new columns, set their editors, and finally delete them. Keep in mind that when a column or view within the grid is selected, its lists of properties and events are exposed through the Properties panel within Visual Studio. Posted May 11 2011, 04:59 PM by Emil Mesropian (DevExpress) with 1 comment(s)

• Silverlight and WPF Grid – Group Intervals for DateTime Columns in Server Mode

  Following my last announcement about enhanced server mode functionality, there is another feature coming up in the 2011.1 release of DXperience that I wanted to briefly mention. In the next major release of the DevExpress Silverlight and WPF grid controls, Group Intervals for DateTime columns can be calculated on the server-side when Server Mode is enabled in the grid. This means that you won’t notice a difference nor need to take any precautions when implementing group intervals in a grid bound using Server Mode. Here is a screenshot of data grouped by a DateTime column and its group intervals displayed within the group header rows: Click image for a larger version. Posted May 10 2011, 10:02 AM by Emil Mesropian (DevExpress) with 7 comment(s)

• Silverlight and WPF Grid – Custom Expressions for Unbound Columns in Server Mode

  The upcoming 2011.1 release of DXperience will include support for populating unbound grid columns in server mode using custom expressions. These expressions can be specified through code, at design-time, or at runtime using the DevExpress Expression Editor built into the DXGrid for Silverlight and WPF. The Expression Editor can be used by you or your end-users at runtime to create an expression using any of the available functions and operators. These expressions can reference other columns and then calculate a new value on the server-side before displaying them within your unbound column. Here is a screenshot of the Expression Editor launched for an unbound “Total” column in DXGrid for WPF: Click image for a larger version. Thanks to our common-codebase initiative – XPF – this feature has also been simultaneously developed for our Silverlight Grid. Here is a screenshot of the same demo in Silverlight: Click image for larger version Posted May 10 2011, 09:44 AM by Emil Mesropian (DevExpress) with 1 comment(s)

• WPF Grid Control – Video on implementing the Instant Feedback UI Mode

  In this earlier post I announced the availability of the Instant Feedback UI Mode in the upcoming 2011.1 release of DXperience. Check out the following video on the DevExpress Channel that demonstrates how to implement the Instant Feedback UI Mode in the DXGrid control for WPF. Click on the image to watch the video: Posted May 05 2011, 02:34 PM by Emil Mesropian (DevExpress) with no comments

• Silverlight Grid Control – Instant Feedback UI Mode

  In this post, I announced the new, smooth scrolling features that will ship in the Silverlight Grid Control as part of the 2011.1 release of DXperience. While that is a great addition to our Silverlight Grid Control, I wanted to put together this post to highlight another exciting and anticipated feature coming up in the 2011.1 version of the DXGrid for Silverlight. The Instant Feedback UI Mode is an advanced data binding mode that is very similar in concept to the DevExpress Server Mode, in that data is retrieved only in portions that are required to populate the view and data-aware operations are performed on the server. Instant Feedback Mode is, however, an asynchronous server mode. The difference lies in how the grid behaves when data is being retrieved and populated. When a user scrolls through the records in Server Mode, the grid first waits for the partial data to be fetched before populating the rows. Depending on the data source performance, the volume of data being retrieved, and the network connectivity, the user may notice a considerable control freeze. Instant Feedback Mode addresses this issue by continuing to respond to the user’s actions while the data is being retrieved. The user can continue to scroll through records, and even re-sort, re-group and re-filter the control’s data. If required, the control will cancel the previous request and initiate a new request to the data source. To provide visual feedback, the Instant Feedback binding mode also includes options to display an animation indicating the status of operations within the grid. The following short animation demonstrates the Instant Feedback mode in action. There are over 100,000 records being retrieved from a SQL Server database and as would be expected, it requires a short amount of time to process the Grid’s requests and retrieve data. In this quick demo, you can see that data management features such as grouping are also performed on the server and take advantage of the Instant Feedback UI functionality. Stay tuned for a video demonstrating how to implement the Instant Feedback UI Mode for the DevExpress Silverlight Grid Control. Posted May 04 2011, 02:55 PM by Emil Mesropian (DevExpress) with 4 comment(s)

• WPF Grid TreeList View and WPF Project Wizard

  Last week, I announced the new TreeList Control and TreeList View for WPF and Silverlight. This is just a quick not to let you know that the TreeList View will be available as a view option for the WPF Grid control in the DevExpress WPF Project Wizard. So if you need to quickly create a WPF application and use a TreeList View, you can do so directly from the Project Wizard without having to write a single line of code: Posted May 04 2011, 12:00 PM by Emil Mesropian (DevExpress) with 2 comment(s)

• Silverlight and WPF BackstageView Control

  Look familiar? A picture is worth a thousand words... The screenshot above is the Backstage View that you have come to see and love in Microsoft Office 2010. Only that the screenshot isn’t of an office application, but of a sample demo using the upcoming DevExpress BackstageView Control for Silverlight and WPF. The control will be available in the 2011.1 release of DXperience. While the most expected and common scenario would be to use the backstage view as part of a Ribbon Control’s application menu, it is not a limitation imposed by the BackStageView Control. The control can not only be integrated and used with the DXRibbon control, but also can be displayed as a stand-alone component. That can be useful if you want to create a user interface or a “start page” in your product that mimics the behavior of the Backstage View. The control’s structure is simple and it is easy to implement. On the left side, you can display buttons and tab items. These tab items act as tab pages within a tab control, meaning that when clicked, the content page is displayed to the right. Within the actual tab pages, there are no limitations as to which controls you can embed. You can use anything from simple buttons and editor controls all the way to complex controls such as the grid. Here is a short animation showing the BackStageViewControl in action: Posted May 04 2011, 10:35 AM by Emil Mesropian (DevExpress) with 3 comment(s)

• Silverlight and WPF Grid – New Scrolling Features

  And let’s open the floodgates! Interested in our Silverlight and WPF controls? There are lots of improvements coming your way that enhance the user-experience as well as provide robust data presentation and manipulation capabilities. In this post, I’ll talk about the new scrolling features that will be introduced for the DXGrid control in the 2011.1 release of DXperience. Thanks to the synchronous development of the DXGrid and DXTreeList controls, these features will also be available in the TreeList as well, I will however cover that in an upcoming post. So what’s new? It’s two features that we call Per-Pixel Scrolling and Cascading Data Updates. You may have already gotten a hint as to what the first one is, but allow me to explain both in detail… Per-Pixel Scrolling So what is Per-Pixel Scrolling? This feature can be enabled using the AllowPerPixelScrolling property of the grid and comes in useful when you have rows formatted to be taller than usual. While that may not appear to be an issue at first, let’s take a look at a couple of examples. First, the animation below shows the standard behavior of the grid... you can see that as I scroll up and down, the records are updated per row, meaning I won’t be able to scroll slowly to see a partial view of a row. With Per-Pixel Scrolling, rows can be scrolled smoothly and not on a “record-by-record” basis. To compare, let’s look at the same data with Per-Pixel Scrolling enabled: See the difference? A much more pleasant user experience thanks to the smoother visual scrolling of records. The per-pixel scrolling feature also offers built-in animations using the ScrollAnimationMode property. These animations can be used to enhance the visual effect and interactivity of the application as the user scrolls through numerous records: Ease Out – This animation mode gives the user the visual impression that scrolling is starting out fast but slows down to the user’s speed later on. Ease In/Out – In this mode, the scrolling experience starts out slowly, accelerate and then slows down again to match the user’s actual scrolling speed. Linear – Provides a consistent, smooth, visual scrolling experience. Custom – This mode allows you to use the CustomScrollAnimation event handler to implement a custom animation effect. To further customize per-pixel scrolling, the scroll animation length can be specified in milliseconds using the built-in ScrollAnimationDuration property. Cascading Data Updates Outstanding performance is what every developer strives to achieve in their application. When using a visually rich platform such as Silverlight or WPF, then you are sometimes left at a cross-roads: Do you decrease the data to be displayed on-screen in favor of cool animations and eye-candy, or do you sacrifice interactive UI in favor of superb performance? Those who have worked with data grid controls on Silverlight/WPF know that after a certain number of rows or columns, you sometimes have to make those difficult decisions. Well, starting with the 2011.1 release of DXperience, you no longer have to worry about the scrolling performance of your DevExpress Grid or TreeList control, regardless of how much data is being displayed. The new Cascading Data Updates are enabled using a single built-in property, AllowCascadeUpdate. In standard scrolling mode, when the end-user first scrolls the data rows, the grid synchronously loads all the rows that need to be displayed onscreen. Using Cascading Data Updates, visible rows are asynchronously loaded in the background, one row at a time. Pretty neat right? The clip above demonstrates Cascading Data Updates enabled in conjunction with the animations provided by the Per-Pixel Scrolling mode I mentioned earlier. The RowAnimationKind property can be used to specify the animation to be used when data rows are asynchronously loaded. The available options are as follows: None – No animation is displayed. Opacity – As rows are being loaded, animate them fading in. Custom – You can again implement a custom animation using the RowAnimationBegin event handler. The animation duration can also be specified in milliseconds using the built-in RowAnimationDuration property. An upcoming post will cover some of these features in the DevExpress TreeList Control for Silverlight and WPF. Posted May 02 2011, 02:50 PM by Emil Mesropian (DevExpress) with 9 comment(s)