Blogs

The Progress Bar - DevExpress XPF Blog

September 2010 - Posts

  • Silverlight Ribbon Control (Coming in v2010 Vol 2)

         

    DevExpress_Silverlight_Ribbon

    That was a great way to start the post right? Well, it fits well into the context... the theme is the new DevExpress Ribbon Control for Silverlight and what better way to introduce its features than by showing you a complete ribbon mimicking the one found in Microsoft Word.

    The Ribbon Control is scheduled to be released with the 2010.2 version of DXperience and will be identical to its WPF counterpart. In addition to full support for the Office 2007 and 2010 Ribbon Styles, the DevExpress Ribbon Control for Silverlight includes the following features:

    • Regular and Contextual Pages
    • Application Button and Menu
    • Quick Access Toolbar – QAT
    • Minimizing Ribbon
    • In-Ribbon Galleries
    • Dropdown Galleries
    • Gallery Hover Images
    • Automatic Layout Adaptation When Resizing the Container
    • Ribbon Status Bar

    Ribbon_ApplicationMenu

    Ribbon_Galleries

    The control fully complies with the Microsoft Ribbon UI guidelines, providing support for all the required features outlined in that document. And of course, there is also a fully-functional status bar with independent left and right regions for placement of controls as well as a size grip.

    DevExpress_Silverlight_Ribbon_Status_Bar

  • New DevExpress Book Control for WPF (Coming in v2010 Vol 2)

         

    Alright, so for the past few weeks, I’ve received several inquiries as to when the Silverlight Book Control will be ported to WPF. So I set out on a mission to find out… And, as you’ve already deduced from the title of this post, the DevExpress Book Control for WPF will ship with the upcoming 2010.2 release of DXperience.

    The Book Control for WPF is the second product to be announced that was made possible due to the merger of our Silverlight and WPF teams earlier this year. The control is identical to its Silverlight counterpart, providing you with all the features and functionality currently found in the AgBook control. For those currently not familiar with the Book control, here’s a brief introduction...

    I’m sure all of you have come across an online version (or preview) of a book or digital magazine that you could flip through and see it’s content just like the real thing. Most of what I’ve seen was flash-based, but that doesn’t provide a solution for us .NET/Silverlight/WPF developers out there. So, the Book Control for WPF and Silverlight gives you the ability to bind to a data source and populate pages from existing records. You can then flip the pages at runtime to browse through the data. This data can be anything from standard employee or customer contact information (an address book), to sophisticated magazine-style designs. And the best part is, you can now not only provide this capability in your web-based Silverlight application, but also create an equivalent client in WPF and using the Book Control reproduce the look and feel and functionality of the web-based version.

    Here’s what the Book Control for WPF looks like...

    DevExpress_WPF_Book_Control

    DevExpress_WPF_Book_Control_Flip_Page

    DevExpress_WPF_Book_Control_Page

    Keep an eye out on this blog for more information about upcoming Silverlight and WPF products as well as video demos demonstrating some of the cool new functionality included in them.

  • Announcing the New Data Grid Control for Silverlight (Coming in v2010 Vol 2)

         

    Back in April of this year, we announced that we had merged our WPF and Silverlight development teams. Consequently, the UI controls for both platforms were being merged as well, creating a common codebase for the DevExpress WPF and Silverlight components. During this time, porting our WPF Grid Control (DXGrid) to the Silverlight platform has been at the forefront of this transition. The DXGrid for Silverlight, as the new product will be called, is nearly complete and scheduled for release in the 2010.2 version of DXperience.

    DevExpress_Silverlight_Data_Grid_Editors
    Click image for a larger version

    Why?

    Here are several compelling reasons why we decided to not continue to maintain an independent Silverlight Grid (i.e. AgDataGrid) and instead port our WPF Grid Control to the Silverlight platform:

    • Quick and Easy Cross-Platform Development

      Despite their common appearance and visual functionality, the AgDataGrid and DXGrid were developed very differently. This translated into additional time and resources to develop, update and enhance each product independently. Considering the fact that we have committed to a single “XAML platform” Codebase, the transition will enable us to maintain and support the WPF Grid on both platforms.

    • Feature Exchange

      Using a single codebase allows us to migrate existing features and roll out new ones faster. Functionality that is already available in our WPF Grid is easily ported for use on the Silverlight platform. These include, but are not limited to: CardView Layout, Data Printing and Exporting, Horizontal Scrolling Virtualization, Serialization, Interval Grouping and More...

    • Performance

      By using a more advanced data rendering and visualization engine, the DXGrid Control for Silverlight provides a significant performance improvement over its predecessor.

    • Themes

      Both the WPF and Silverlight Grid Controls will include more themes that can be used interchangeably between each platform.

    • Common UI and Documentation

      The DXGrid will provide you with a common user interface, development API’s and product documentation for both platforms. Create a WPF application using our grid control and easily port your project to Silverlight!

    • Cross-Platform Development of Grid-Based Controls

      We will be able to accelerate the release of new grid-based controls for each platform. Such planned releases include the Look-Up control for 2010.2 and the TreeView Control for 2011.1

    Migration

    DevExpress is committed to making the transition from the existing AgDataGrid Control as smooth as possible. To that effect, the current version of the AgDataGrid Control will also be included in the upcoming installer to allow developers to install the new version and successfully load their existing projects for migration to the new control. We will also prepare a complete feature comparison table as well as step-by-step documentation, demo applications, and video tutorials to guide you through the upgrade process. As always, our online technical support team will also be available to answer your questions and assist you along the way.

    Features

    The following table outlines the major features and their availability for each grid control. You’ll notice that DXGrid for Silverlight provides numerous features that were up until now absent from the AgDataGrid control. Click on the image for a larger version...

    DevExpress_Silverlight_Grid_Feature_Comparison_Table

    What’s Next?

    As we approach the release of v2010 Vol 2, we’ll be providing more insight into the new grid control and demonstrate some of its features. Keep an eye on this blog as well as the DevExpress Channel for more upcoming announcements and demos.

    For now, feel free to leave a comment with any questions or suggestions you may have.

  • WPF Data Grid Server Mode and WCF Web Services

         

    Using server mode along with WCF Web Services is one of the many ways that you can bind the WPF Data Grid Control to a data source. So why would you want to use Server Mode? Let’s assume you have a data source that contains more than 50,000 records. Normally a grid would attempt to connect to the data source and retrieve all the records at once. No matter how efficiently the grid utilizes its resources, there is always the bottleneck of network communication or database server load. You probably don’t want to make the end-user wait for one million records to be retrieved and loaded into the grid control. Using the Server Mode feature, the records are retrieved and displayed immediately in small portions. The remaining data is quickly loaded as the user scrolls up or down in the view. Another key feature of server mode is the ability to perform data-aware operations on the server side... this means that operations such as sorting, grouping, filtering and summaries are performed without the need to load all the records on the client’s machine.

    The server mode can be used with the WCF Web Services to connect to and retrieve data from a remote data server. This will guarantee the best performance when used with large data sources for passing data from the server to the WPF Grid Control on the client-side. Let’s look at the steps required for a sample implementation:

    First and foremost, we’ll be using the open source InterLINQ library in this example, so make sure your application complies with its licensing terms before using it.

    Now let’s see what we need...

    1. To get started, we’ll need to create a library that contains the implementation of the data objects. This library should be referenced by both the Web Service and the Client-Side applications to provide information on the structure of data to be displayed by the WPF Grid Control.
    2. Of course, a WCF web service is also required. This web service should be publicly accessible and needs to have private backend access to a local database server.
    3. The client-side application that will contain the WPF Grid control operating in server mode and obtaining its data from a WCF web service.
    4. To use the DevExpress WPF Grid’s server mode feature, we need to send LINQ queries to the WCF Web Service and back. Therefore, it is necessary to have the ability to serialize/de-serialize LINQ queries. This is why we’ll be using the InterLINQ library (as noted above).
    5. Finally, we can further improve performance by using the GZIP library to compress the data sent to the WCF web service and back. For this example, we’ve used the library that’s provided as part of the WCF samples, recommended by Microsoft for creating solutions that work with the Windows Communication Foundation.

    Again, the last step is completely optional, however it provides an additional speed improvement over the existing efficiency at which the DevExpress Server Mode feature operates. Here’s a quick overview of how the solution will work:

    WPF_Grid_WCF_Web_Service_Server_Mode

    You may learn the details of how such an example is implemented by downloading and studying the related CodeCentral Example: http://www.devexpress.com/Support/Center/e/E2000.aspx

  • New Scrolling and View/Item Orientation for the WPF and Silverlight Navigation Bar Control (Coming in v2010 Vol 2)

         

    In the upcoming release of DXperience 2010.2, we’re introducing two new features for the WPF NavBar and Silverlight NavBar Controls:

    New Scrolling Mode

    This feature will be new to both the WPF and Silverlight versions of the Navigation Bar Control. Up to now, you could only provide scrolling functionality in the NavBar control by using scroll buttons at the top and bottom of the NavBar’s view or items panel. This new feature allows you to use a scroll bar instead of the scroll buttons. This can be switched easily using the new ScrollingSettings.ScrollMode property.

    Here’s an example of the scroll bar being used for a NavBar control’s entire view:

    Silverlight_Navigation_Bar_View_Scroll_Bar

    And of course, scroll bars can be used within a NavBar group to provide scrolling functionality to a set of items:

    Silverlight_Navigation_Bar_Items_Group_Scroll_Bar

    Silverlight_Navigation_Bar_Items_Scroll_Bar

    Ability to modify the orientation of the NavBar Control’s view and items flow

    This feature is available in the current version of the WPF Navigation Bar Control and will be introduced for its Silverlight counterpart in the 2010.2 release of DXperience. Using this feature, you can change (1) the orientation of the Navigation Bar’s view and (2) the orientation of items flow. The former can be set using the view’s Orientation property and the latter using the view’s ItemsPanelOrientation property.

    Let’s look at a few screenshots demonstrating this feature using the Silverlight Navigation Bar Control...

    Silverlight_Navigation_Bar_Explorer

    Silverlight_Navigation_Bar_NavPane

    Silverlight_Navigation_Bar_SideBar

    Silverlight_Navigation_Bar_Default(Vertical)Orientation

    If you are an existing customer, you can try this feature using the current version of the WPF Navigation Bar Control. If not, feel free to grab a free evaluation copy from our website and see the wealth of DevExpress components available for WPF and Silverlight.

  • Overview of the new Gallery Control for WPF and Silverlight (Coming in v2010 Vol 2)

         

    As you may recall, I announced the upcoming release of the new Gallery Control in a previous post. There, the general features of the control were introduced and a few example screenshots demonstrated the powerful customization capabilities of the control. There was great interest shown in this product, therefore we decided to provide a more detailed overview of what the control is designed to do and describe some of the features in greater detail.

    The Gallery control’s main purpose is to display images which are categorized into groups. In other words, the control consists of gallery groups which contain gallery items. Each gallery item is displayed as an image with a title and a description. Here’s an example of the Gallery control containing four groups of images:

    WPF_Silverlight_Gallery_Control_Groups_Images

    By clicking the header of the Gallery control, the filter menu is invoked. This is essentially a context menu that allows the user to select which groups to be displayed:

    WPF_Silverlight_Gallery_Control_Filter_Menu

    If you notice from the above screenshots, item captions and description are by default located to the right of the image. Thanks to the Gallery control’s advanced customization features, you have several properties at your disposal which can be used to control the positioning of basic elements with respect to each other. For example, the following screenshot shows the text and description displayed below each image:

    WPF_Silverlight_Gallery_Control_Text_Positioning

    If the included properties do not satisfy your layout needs for positioning items, then you can further customize the elements in any way you like using custom templates and structure for each gallery item. If necessary, the template of an item’s border can also be changed.

    Gallery group headers can also be easily modified by using a custom DataTemplate.You can see in the following screenshot that additional buttons have been added to the group headers:

    WPF_Silverlight_Gallery_Control_Customize_Group_Header

    If required, you may also hide the headers completely...

    WPF_Silverlight_Gallery_Control_Hide_Headers

    Or conditionally hide some and display others…

    WPF_Silverlight_Gallery_Control_Conditional_Hide_Headers

    Furthermore, each item supports a hover animation. Check out the following short clip that shows the animation effect when the cursor is hovered over each item:

    In addition to displaying gallery items, the Gallery Control can also be used as an editor. For this purpose, several modes of item selection are supported:

    • Multiple – When an item is clicked, its IsSelected property is set to opposite.
    • Single – When an item is clicked, its IsSelected property value is set to true. That property is then automatically set to false for all other items (similar to the behavior found in a radio group).
    • SingleInGroup – Similar to the Single mode above, however it only functions within a single group.
  • Most Recently Used Filter list for WPF Grid (Coming in v2010 Vol 2)

         

    With 2010.2 release of DXperience, we’re introducing the Most Recently Used (MRU) Filter list functionality for the WPF Grid control. This feature was previously available in the WinForms version of our grid and is being made available to WPF developers so they can provide an enhanced runtime experience to their end-users.

    Why is this an important feature? Say you’ve developed a business application that is to be used by a person analyzing data all day long. The end-user will be spending most of their day adding different filter criteria to the view to narrow down the information for data analysis. While you may provide them with a set of existing filter conditions, there will always be the need for custom criteria. Here’s where the usefulness of the MRU list comes in.

    The MRU list keeps track of the filter conditions applied at runtime so the end-user doesn’t have to re-construct past criteria over and over again. The list can be displayed within the filter panel for criteria applied to a view or within a single column’s filter dropdown.

    Let’s take a look at a simple example… here I’m using the filter editor (invoked via the filter panel) to apply a condition to the view:

    WPF_Grid_Filter_MRU_Create_Criteria

    I then go ahead and add several more filter conditions. At any time, I can click the arrow button to invoke a list of previously used filter conditions and re-apply them to the grid’s view:

    WPF_Grid_MRU_List

    Keep an eye on this blog and the DevExpress Channel as I’ll also be covering this feature in an upcoming video demonstration.

  • WPF Layout Control – Flow Layout and Maximization

         

    As promised here, this is the first in a series of posts to demonstrate certain features of the new Layout Control for WPF.

    Just like its Silverlight counterpart, the WPF Layout Control includes a Flow Layout Control that can contain child items and arrange them into rows or columns. The arrangement is done based on the setting of the Orientation property of the control. You can allow the items to be wrapped at the edge of the container, or manually specify and item to break the automatic flow of controls displayed in specific row and columns.

    An item in the FlowLayoutControl can be maximized to give it more focus at runtime. Maximization of a single item can be specified at design-time by setting the FlowLayoutControl.MaximizedElement property to the name of the desired element. The default maximization location can be set using the FlowLayoutControl.MaximizedElementPosition property.

    In the following demo, we take a look at adding a FlowLayoutControl and populating it with several GroupBoxes. A GroupBox maximization is specified at design-time and then the minimize and maximize elements are enabled to allow end-user to change the GroupBox maximization at runtime.

    Click on the image below to watch the video tutorial:

    WPF_Flow_Layout_Control_Video

  • WPF Layout Control – Full Visual Studio Design-Time Support

         

    Thanks to the merged codebases of our WPF and Silverlight products, the WPF Layout Control provides all the functionality already available in the Silverlight Layout Control. One of these features is full design-time support in Microsoft Visual Studio 2010.

    In the following tutorial, we take a look at how to build a simple data entry form using only the design-time functionality of the WPF Layout Control. You’ll see how easy it is to create and customize a layout without having to write single line of code or modify the XAML markup.

    Click on the image below to watch the video demonstration:

    WPF_Silverlight_Editors_Video_Demo

    As the WPF Layout Control is being made available in the latest 2010.1.6 release of DXperience, you may also download a copy of the product and try the new WPF Layout Control for yourself.

    Stay tuned for more feature-highlights and video demos for the WPF Layout Control.

  • New Gallery Control for WPF and Silverlight (Coming in v2010 Vol 2)

         

    For the 2010.2 release of DXperience, we’re creating a standalone gallery control which will ship with the Toolbar and Menu System for WPF and Silverlight. In this post, I’ll highlight some of the features as well as show some screenshots of the Photo Library demo we’ve created using the WPF version of the Gallery Control.

    Highlighted Features:

    1. The Gallery Control can be fully customized using styles and templates.
    2. Group Filtering Support – When a gallery control contains two or more groups, a Group Filter panel is displayed at the top. You can learn more about this feature by visiting the help documentation article on this topic (XtraBars documentation).
    3. Customizable item content – This includes hover images, different layout for item’s text and image, SuperTips, custom group caption content and keyboard navigation.
    4. Scrolling of items
    5. The Gallery control also supports all of the features found in the Microsoft Office Gallery

    Demo Application Screenshots (Click for larger version):

    WPF_Silverlight_Gallery_Control_1

    WPF_Silverlight_Gallery_Control_2

    WPF_Silverlight_Gallery_Control_3

    WPF_Silverlight_Gallery_Control_4

    As this control is in heavy development, expect further feature announcements and demos of the Gallery Control for WPF and Silverlight.

  • Video Overview of New Editor Controls for WPF and Silverlight (Coming in v2010 Vol 2)

         

    In two earlier blog posts, I announced the new editor controls that will be introduced for WPF and Silverlight as part of the upcoming 2010.2 release of DXperience. The posts list the features in detail, so you may look them up here and here.

    Today, we’ve published a video that shows the new editors in action. Click on the image below to go to the DevExpress Channel and watch the short demo:

    WPF_Silverlight_Editors_Video_Demo

More from DevExpress
Live Chat
Have a pre-sales question?
Need assistance with your evaluation?
We are here to help.
Chat is one of the many ways you can contact members of the DevExpress Team. We are available Monday-Friday between 8:30am and 5:00pm Pacific Time.
If you need additional product information, require pre-sales assistance, or want help with your order, write to us at info@devexpress.com or call us at
+1 (818) 844-3383.