Wow… is it 2016 already? It seems just like yesterday I was talking about all the great stuff we did in the last 15.2 release of Infragistics WPF. Now, it’s time to see all the goodies we have been working on over the last few months since. Well to be honest, in 16.1, we really out did ourselves. We added some of the most mind blowing, face melting, eye popping features that will make you want to slap your mama! In order to prevent your heart from stopping, I’ll start slow and then work my way up to the coolest feature.
Gauge Needle Dragging
First up is a small, but very useful, feature for both the xamLinearGauge and xamRadialGauge controls. The gauge controls have always been a popular, and simple way, to visualize certain types of data. If you have used these controls, you know that they even have a nice little needle element that allows you to indicate a value on the scale. This is really helpful. The problem is that while they look great and those needles do their job of pointing out the value, your first instinct in interacting with the control is to use your mouse to click and drag the needle position. You soon realize that YOU CAN’T! Say what? You’re kidding right? I’m serious as a heart attack. The needles did not have built-in functionality to be dragged and repositioned. I mean, technically we had a sample in the WPF sample browser that you could copy and paste about 100 lines of code to do it manually, but that’s just crazy.
Thankfully, we has some customers report this to me and we got it fixed. You can now set the brand new IsNeedleDraggingEnabled property to enable needle dragging by interactively dragging the needles using the mouse to indicate new values. You can now rest easy knowing that you will no longer have the red mark on your forehead from your palm every time you want to add needle dragging to the WPF gauge controls.
XamTabControl Tab Dragging
Another reason you may have a red mark on your forehead from face palming, is the fact that our xamTabControl doesn’t support the ability to click and drag a TabItem with your mouse to reorder it. I mean, come on… this is the year 2016 right? This is standard tab control stuff we’re talking about here. Why didn’t we have this feature earlier? Good question! Heck, even I didn’t even know this. I just assumed it had it this whole time. Once again, a customer reported this limitation to me, and we got it fixed!
As of 16.1, if you’re using the xamTabControl, you can now reorder tab items by clicking and dragging a tab item with your mouse to a new position. To enable this feature, simply set the TabDragMode property to the desired behavior.
The TabDragMode has three options:
- None – dragging is disabled. (this is the default behavior)
- Deferred – dragging is deferred until the tab is dropped. You’re shown a visual insertion indicator while you are dragging the tab.
- Immediate – tabs are reordered while the tab is being dragged. Tabs are shifted to the left or right to indicate the new position of the tab being dragged.
Right about now, your forehead should start feeling much better.
XamDataGrid Improvements
Ahhhhhh… the data grid! Just about every developer that has ever written an app knows that the data grid is the heart of all line of business applications out there. It is by far the most widely used control in our industry. So it should be no surprise that every release of Infragistics WPF will include updates to our xamDataGrid to help make your life easier. I had some great conversations over the last few months with customers to find your pain points in the xamDataGrid’s editing experience, the limitations you face laying out your fields (columns), and hearing the screams of anguish trying to load even more and more data into your applications. You let me know where we could help, and that’s exactly what we did.
Auto Edit Mode
Since the first release of the xamDataGrid, its editing behavior has been pretty much remained unchanged. Select a cell and press F2, or double click, in order to enter edit mode. While this works, it is not always the most intuitive approach to editing. A lot of apps require a much richer, some would say easier, editing experience that is closer to how Microsoft Excel works. Right now, the editing experience is a little annoying. What you want to do it select a cell, and start typing. BAM, you’re editing! No double clicking… no F-keys… no hassles! Well keep your fingers off those “F’n” keys! In 16.1, we have added a new property to the xamDataGrid FieldSetting object called IsAutoEditModeEnabled. When IsAutoEditModeEnabled is set to true, you can select a cell and just start typing. BAM!!! You’re in edit mode in a blink of an eye! Editing, tabbing, committing changes all without having to click a mouse button.
Field Grouping
So we got our editing in check. You’re cruising right along. Now we need to address another issue you guys told me about. Grouping your fields! I got an email from a customer asking, “Brian, why can’t I group my fields so that I can make more sense of the data and show how it’s related to the other fields in the xamDataGrid?”. I’m like, “What do you mean? Show me!”. So they did, and it made total sense. Once I say what they wanted to achieve, I was like “let’s do this!”.
So we did! In 16.1, we added the ability for you to create field groupings which allow you to group multiple fields together under a single common header. This allows your end user to quickly see which field falls under similar categories. We actually had to change the way we defined FieldLayouts all together. Now, don’t worry… we didn’t break you, but we did change the API to support this. We added a brand new property called FieldItems which now accepts both Field objects (TextField, ComboBoxField, NumericField, etc.) as well as a new FieldGroup object. If you are using the FieldLayout.Fields property, your app will still work, but going forward you should be using the new FieldItems property to add Fields and FieldGroups to.
So what can you do with these FieldGroups besides group your fields together?
- Nesting - grouped fields can be nested within each other infinitely. Meaning that you can have a parent grouped field which contains other grouped fields.
- Moving - grouped fields can be moved to a new position as a whole, or you can move individual fields within a group. (Note: by design we don’t support dragging a Field or FieldGroup outside of its parent group or into any other group.
- Pinning - you can pin a grouped field so that its position does not change as you scroll the xamDataGrid. (Note: By design you can only fix Fields or FieldGroups that are at the root level, i.e. they don’t have a ParentGroup.)
Oh, and one more little feature that is pretty freaking cool. When we completed this feature, the customer was like “Dang son… this is sick! Do you know what would be even better?”, and I’m like “what’s that?”, and they said “if we could collapse the field group to hide all the child fields, but have an option to show only select fields”. I though about it a little and said, “hell yeah, that would be awesome”. So we did that too!
- Collapsing – Field groups allow you to display an expansion indicator that will collapse a field group to show less detail. It essentially hides all the fields in the collapsed grouped field. This comes in handy when you have many grouped fields and need to de-clutter the view. You can also control which fields remain visible when collapsing a group.
Virtualized Data Source
While those features are cool and all, we have something even better up our sleeve. I met with a customer one day, and they were having a hard time loading data from their OData service asynchronously, and having the xamDataGrid stay responsive, and continuously load data as they scrolled. The problem was that they had literally millions of records being served up by this OData feed, but obviously they didn’t want this data loaded all at once in the xamDataGrid. So we chatted about it for awhile and thought, “hey, why don’t we create a virtualized data source that will let you simply point it at an OData service, set how many records you want to bring down at a time, how many records you want to cache, and just bind that to the xamDataGrid. Then, the xamDataGrid could do all the work for you and asynchronously load the data as you scroll it?”. So that’s exactly what we did!
I am really excited to announce that in Infragistics WPF 16.1, we are shipping a brand new data source that will give the xamDataGrid (xamDataPresenter) the ability to asynchronously load data from an OData service. This means that data can now be loaded on a separate thread to keep the UI responsive. The data will appear in the grid as soon as it has been fully loaded regardless of scroll position. The best part, is all you have to do is point it at an OData feed. That’s it. You’re done! Now, for the initial release, we will only be shipping support for OData services. Simply point the data source to an OData service URI, set the entity set, request your fields, set your page size, and you’re off to the races. The virtual data source and xamDataGrid will do the rest. I know you want more types of data sources, but we just didn’t have time.
but wait…. there’s more!
The best part about this new virtual data source is that it is completely open source and available for download on GitHub.
https://github.com/Infragistics/DataSource-Reference-Implementations
Not only is the source code for the OData virtual data source available for download, but we also provide sample applications demonstrating how to use them in your applications. You can use this OSS project to submit improvements, and add support for other data sources and clients that you need, but we don’t currently support.
Also, I would like to mention that while the default appearance of data that has not been loaded is a simple gray overlay bar, you can customize this and provide any overlay color you would like so that it aligns with your application theme and styles. You also have the ability to respond to the state of the data being loaded to show a custom loading indicator such as the xamBusyIndicator to give the end-user a visual indication that an asynchronous operation is being executed. Simply use the xamDataGrid.IsAsyncDataPending property to check the state of the data loading process.
A New 3D Surface Chart
While I know your brain is still trying to recover from the previous feature announcements and may still have a feeling of numbness, it’s time for sensory overload! The brand new xamScatterSurface3D chart. That’s right! This was the number 1 most highly voted for idea on our Product Ideas website. Not only was it the most highly voted idea, we had more customers email us about this than any other feature request.
This new xamScatterSurface3D chart is perfect for those scenarios where you need to visualize price volatility plots I the financial services industry, instrument measurement, and equipment testing, process simulation, modeling, and monitoring applications. Basically anyone building specialized hardware for use in biotech, materials science, component testing would need such a surface plot to visualize multivariate data from testing/measurement. I mean, this thing is sick!
Even though it’s a V1, this control has it all.
- Surface Area Series Support – this is the single series type available in the control, which allows mapping of any x/y/z value set, such as terrain mapping, price volatility plots, etc.
- Zooming – uses scaling to enlarge or shrink the surface chart
- Touch support – the control uses standard touch gestures to initiate operations such as rotation and zooming.
- Chart Surface Texture customization– allows more control over the material of the surface, from material used to color properties.
- Tooltips – mouse tracking to show data, related to the currently hovered point.
- Rotation – allows rotating the surface along all three axes – X, Y and Z.
- Gridlines– horizontal and vertical gridlines along all sides of the Surface Cube for better usability and pointer tracking, when crosshairs are enabled.
- Data Pint Markers – enable customizable data point markers for each point in the surface. Each marker is customizable to allow shape and template customization.
- Crosshairs – allows matching of mouse position over the sides of the Surface Cube.
- Color Palettes – offers a set of predefined color ranges, which can be modified and applied to the value ranges on the surface.
- Axis labels – supports an array of features, related to the labels along the axes – step, formatting, customization, styling and templating.
You really have to download the WPF Sample Browser and play with this thing. It’s an awesome 3D chart control. Honestly, this is one of the few types of charts where 3D actually makes sense. Most of the time, 3D charts are a novelty control that add no value to your data. As you can see, that is not the case with the one.
Let’s Wrap this Baby Up!
I hope you are as excited as I am about these new controls and features. As you can see, your feedback played a vital role in this 16.1 release of Infragistics WPF. Every one of these features was because you let us know what you wanted and needed in order to be successful. Everything from fixing annoying things like needle and tab item dragging, to creating an entirely new 3D chart control. Besides all the new features I mentioned in this post, we are delivering much more that I didn’t get a chance to talk about. We have tons of other smaller features, and bug fixes that are part of our newest 16.1 release.
If you have ideas about new features we should bring to our controls, important issues we need to fix, or even brand new controls you’d like us to introduce, please let us know by posting them on our Product Ideas website. Follow and engage with us on Twitter via @infragistics. You can also follow and contact me directly on Twitter at @brianlagunas. Also make sure to connect with our various teams via our Community Forums where you can interact with Infragistics engineers and other customers.
If you are not using our WPF controls yet, remember that a free evaluation download is only a click away.
Lastly, when you do build something cool with our controls, please make sure to let us know.