What's new in NetAdvantage for Silverlight Line of Business 11.2 Release

[Infragistics] Mihail Mateev / Friday, October 28, 2011

This blog is an overview of the new features, released in the 11.2 Silverlight LoB product.

NetAdvantage for Silverlight vol.2011.2 has a lot of new controls and new features of the existing controls. This article presents the important  features in this new release. I’m glad to announce a lot of new  things in this product. Most of XAML LoB components are cross-platform (supported in the both Silverlight and WPF products), but this post covers exactly new features for Silverlight.

XamGrid

Grid is probably the most important component when we talk about line of business  controls. In the new NetAdvantage for Silverlight Line of Business Vol.2011.2 XamGrid comes with many new features.

  • Editor Behaviors

Three columns in the XamGrid control – DateColumn, ComboBoxColumn and CheckBoxColumn can be configured to be always in edit mode. This means they are always accessible, visible and available for editing without any further user interactions or the editing mode being enabled in the XamGrid control.

By using the EditorDisplayBehavior property, you can configure the DateColumn, ComboBoxColumn and CheckBoxColumn to be always in the edit mode. It is possible to change the default edit mode between “Default” “Always” and “EditMode”.

 

  • Export to MS Excel

Starting with the 11.2 release, you can export the XamGrid data to Microsoft Excel files.
Excel export supports using of filtering, sorting, summaries  group by and formatting of the exported data.

 

 

  • Selection – Select All Rows

In the 11.2 release it is possible to select all rows in the child band, all rows in the grouped area all rows or  in the XamGrid.

 

  • Summaries in Group Headers

 

   1: <ig:XamGrid x:Name="dataGrid" AutoGenerateColumns="false">
   2:           <ig:XamGrid.Columns>
   3:               <ig:TextColumn Key="SKU" Width="*">
   4:                   <ig:TextColumn.HeaderTemplate>
   5:                       <DataTemplate>
   6:                           <TextBlock Text="{Binding Path=XWG_Grid_ProductSKU, Source={StaticResource Strings}}" />
   7:                       </DataTemplate>
   8:                   </ig:TextColumn.HeaderTemplate>
   9:               </ig:TextColumn>
  10:               <ig:TextColumn Key="Name" Width="*">
  11:                   <ig:TextColumn.HeaderTemplate>
  12:                       <DataTemplate>
  13:                           <TextBlock Text="{Binding Path=XWG_Grid_ProductName, Source={StaticResource Strings}}" />
  14:                       </DataTemplate>
  15:                   </ig:TextColumn.HeaderTemplate>
  16:               </ig:TextColumn>
  17:               <ig:TextColumn Key="Category" Width="*">
  18:                   <ig:TextColumn.HeaderTemplate>
  19:                       <DataTemplate>
  20:                           <TextBlock Text="{Binding Path=XWG_Grid_ProductCategory, Source={StaticResource Strings}}" />
  21:                       </DataTemplate>
  22:                   </ig:TextColumn.HeaderTemplate>
  23:               </ig:TextColumn>
  24:               <ig:TextColumn Key="UnitPrice" FormatString="{}{0:C}" Width="*">
  25:                   <ig:TextColumn.HeaderTemplate>
  26:                       <DataTemplate>
  27:                           <TextBlock Text="{Binding Path=XWG_Grid_UnitPrice, Source={StaticResource Strings}}" />
  28:                       </DataTemplate>
  29:                   </ig:TextColumn.HeaderTemplate>
  30:  
  31:                   <!-- GroupBy Summary Definitions-->
  32:                   <ig:TextColumn.SummaryColumnSettings>
  33:                       <ig:SummaryColumnSettings>
  34:                           <ig:SummaryColumnSettings.GroupBySummaryDefinitions>
  35:                               <ig:SummaryDefinition ColumnKey="UnitPrice">
  36:                                   <ig:SummaryDefinition.SummaryOperand>
  37:                                       <ig:SumSummaryOperand/>
  38:                                   </ig:SummaryDefinition.SummaryOperand>
  39:                               </ig:SummaryDefinition>
  40:                               
  41:                               <ig:SummaryDefinition ColumnKey="UnitsInStock">
  42:                                   <ig:SummaryDefinition.SummaryOperand>
  43:                                       <ig:AverageSummaryOperand/>
  44:                                   </ig:SummaryDefinition.SummaryOperand>
  45:                               </ig:SummaryDefinition>
  46:  
  47:                               <ig:SummaryDefinition ColumnKey="SKU">
  48:                                   <ig:SummaryDefinition.SummaryOperand>
  49:                                       <ig:MaximumSummaryOperand/>
  50:                                   </ig:SummaryDefinition.SummaryOperand>
  51:                               </ig:SummaryDefinition>
  52:                               
  53:                           </ig:SummaryColumnSettings.GroupBySummaryDefinitions>
  54:                       </ig:SummaryColumnSettings>
  55:                   </ig:TextColumn.SummaryColumnSettings>
  56:  
  57:                   <!--GroupBy Item Template -->
  58:                   <ig:TextColumn.GroupByItemTemplate>
  59:                       <DataTemplate>
  60:                           <StackPanel Orientation="Vertical">
  61:                               <StackPanel.Resources>
  62:                                   <Style TargetType="ListBox" x:Key="MyListBox">
  63:                                       <Setter Property="ItemContainerStyle">
  64:                                           <Setter.Value>
  65:                                               <Style TargetType="ListBoxItem">
  66:                                                   <Setter Property="Template">
  67:                                                       <Setter.Value>
  68:                                                           <ControlTemplate TargetType="ListBoxItem">
  69:                                                               <Grid>
  70:                                                                   <ContentPresenter/>
  71:                                                               </Grid>
  72:                                                           </ControlTemplate>
  73:                                                       </Setter.Value>
  74:                                                   </Setter>
  75:                                               </Style>
  76:                                           </Setter.Value>
  77:                                       </Setter>
  78:                                       <Setter Property="Background" Value="Transparent"/>
  79:                                       <Setter Property="BorderThickness" Value="0"/>
  80:                                       <Setter Property="ItemTemplate">
  81:                                           <Setter.Value>
  82:                                               <DataTemplate>
  83:                                                   <StackPanel Orientation="Vertical">
  84:                                                       <StackPanel Orientation="Horizontal">
  85:                                                           <TextBlock FontSize="13" FontWeight="Bold" Text="{Binding SummaryDefinition.SummaryOperand.RowDisplayLabelResolved}"/>
  86:                                                           <TextBlock FontSize="13" FontWeight="Bold" Text=" :  "/>
  87:                                                           <TextBlock FontSize="13" FontWeight="Bold" Text="{Binding Value}"/>
  88:                                                       </StackPanel>
  89:                                                   </StackPanel>
  90:                                               </DataTemplate>
  91:                                           </Setter.Value>
  92:                                       </Setter>
  93:                                   </Style>
  94:                               </StackPanel.Resources>
  95:                               <TextBlock Text="{Binding Value}"/>
  96:                               <ListBox ItemsSource="{Binding GroupBySummaryLookupResults}"  Background="Transparent" BorderThickness="0">
  97:                                   <ListBox.ItemsPanel>
  98:                                       <ItemsPanelTemplate>
  99:                                           <StackPanel Orientation="Horizontal"/>
 100:                                       </ItemsPanelTemplate>
 101:                                   </ListBox.ItemsPanel>
 102:                                   <ListBox.ItemContainerStyle>
 103:                                       <Style TargetType="ListBoxItem">
 104:                                           <Setter Property="Template">
 105:                                               <Setter.Value>
 106:                                                   <ControlTemplate TargetType="ListBoxItem">
 107:                                                       <Grid>
 108:                                                           <ContentPresenter/>
 109:                                                       </Grid>
 110:                                                   </ControlTemplate>
 111:                                               </Setter.Value>
 112:                                           </Setter>
 113:                                       </Style>
 114:                                   </ListBox.ItemContainerStyle>
 115:                                   <ListBox.ItemTemplate>
 116:                                       <DataTemplate>
 117:                                           <Grid Width="200">
 118:                                               <Grid.RowDefinitions>
 119:                                                   <RowDefinition Height="20"/>
 120:                                                   <RowDefinition Height="*"/>
 121:                                               </Grid.RowDefinitions>
 122:                                               <TextBlock Text="{Binding Key}" FontWeight="Bold" FontSize="12"/>
 123:                                               <ListBox Grid.Row="1" ItemsSource="{Binding Value}" Style="{StaticResource MyListBox}"/>
 124:                                           </Grid>
 125:                                       </DataTemplate>
 126:                                   </ListBox.ItemTemplate>
 127:                               </ListBox>
 128:                           </StackPanel>
 129:                       </DataTemplate>
 130:                   </ig:TextColumn.GroupByItemTemplate>
 131:  
 132:  
 133:                   
 134:                   
 135:               </ig:TextColumn>
 136:               <ig:TextColumn Key="UnitsInStock" Width="*">
 137:                   <ig:TextColumn.HeaderTemplate>
 138:                       <DataTemplate>
 139:                           <TextBlock Text="{Binding Path=XWG_Grid_UnitsStock, Source={StaticResource Strings}}" />
 140:                       </DataTemplate>
 141:                   </ig:TextColumn.HeaderTemplate>
 142:               </ig:TextColumn>
 143:           </ig:XamGrid.Columns>
 144:           <ig:XamGrid.GroupBySettings>
 145:               <ig:GroupBySettings AllowGroupByArea="Top" DisplayCountOnGroupedRow="True"/>
 146:           </ig:XamGrid.GroupBySettings>
 147:       </ig:XamGrid>

 

  • Column specific styles

In the XamGrid now there is possible to customize the look the special rows using specific styles (FilterRowCellStyle, SummaryRowCellStyle, AddNewRowCellStyle, GroupByRowStyle, GroupByHeaderStyle)

  • XamGrid Filtering update

In the new release  now is added Excel Style Filtering (when AllowFiltering is set to ‘FilterMenu’).

 

  • Events update

ColumnAutoGenerated event
With this new event you can control the XamGrid columns auto generation process. It’s raised for each generated column. When the event is raised, you can modify the column properties or prevent the column from being added to the XamGrid.

ColumnAutoGenerated event
You can now make a cell (or whole row) to enter edit mode by just hovering it with the mouse.

XamDataChart

In addition to XamWebChart, now Data Chart is added  Silverlight LoB product. The market leading XAML Data Chart, previously only available to customers who owned out Data Visualization product, is now part of the WPF and Silverlight Line of Business products. 

All  XamDataChart features are available in the Silverlight Line of Business suite.

Polar series example

 

Custom series example: ControurAreaSeries, that inherits Series class.

 

Using of templates for the chart legend

 

  • XamPieChart

XamPieChart is also available in the new 11.2 release for Silverlight LoB.

You can enjoy the excellent features of XamPieChart as a move from summary information to detailed data drilling down and up, use explosion support and adjusting XamPieChart label positions

The Others Category in the Pie Chart control can be used to group the smallest data values into one slice

 

You could via click on a pie slice to toggle its explosion.

 

Funnel Chart (XamFunnelChart)

 Another new component in the 11.2 release is a XamFunnelChart. This control  represents a chart with a funnel shape. It displays sections in a top-down composition each representing the data as slices from largest value to the smallest value

XamTileManager

XamTimeNamager is a completely new control for NetAdvantage Vol.11.2 . This component is available for both Silverlight and WPF LoB products. You could use Tile Manager to organize tiles in the your layout as desired – in a grid, spanning columns, rows, etc.

XamTileManager main features includes:

  • Drag and Drop – supports the dragging and rearranging of tiles.
  • State Based Customization (tiles supports different states: Maximized, Normal, Minimized, Minimized-Expanded and different templates for each state)
  • Dynamic Tile Resizing
  • Build-in and Custom Animations – it is possible to set animations during the state transitions of tiles.
  • Save/Load Layout –users could save and restore their changes at run-time.

XamTileManager offers much more useful features like:

  • Adding and Removing Tiles
  • Maximized Tile Location
  • Different  Tile Settings
  • Adding and Removing Tiles
  • Easy to Use Data Binding
  • Explicit Tile Layout

You could use UseExplicitRowColumnOnTile option to create tiles of varying sizes.

 

It is possible to set at design-time or at run-time the location of the maximized tiles.

 

You could to modify tile settings by setting the NormalModeSettings and MaximizedModeSettings properties

 

 

 

 

XamInputs (XamMaskedInput, XamCurrencyInput, XamNumericInput, XamDateTimeInput)

The controls in the XamInputs group are meant to guide the users during data entry and give you an opportunity to check if the entered data meets some predefined criteria. The controls are cross-platform by design therefore you can use them in Silverlight or WPF interchangeably. The input controls can be used as standalone textboxes or in combination with other controls, for example as cells in a XamGrid control.

  • XamMaskedEditor

You can make different masks like a phone number mask with required (‘#’) or non-required (‘9’) digits like so – “(###)####-###”

 

  • XamCurrencyInput

You could to add a XamCurrencyInput control to your application configured with several common masks.

 

  • XamDateTimeInput

It is a simple text box control that uses a mask to assist end users in entering dates and/or time values in the correct format. The XamDateTimeInput also comes with one outstanding feature – a dropdown calendar that lets users pick the date right there and have it entered for them.

 

  • XamNumericInput

The XamNumericInput as the name suggest also accepts only digits and they can be restricted not only via a mask but by a minimum and maximum values.

 

 

XamMultiColumnComboEditor

The XamMultiColumnComboEditor is designed to give developers a richer display choice for dropdown data. The multi-column combo acts just like a grid; it can automatically generate columns for every property on the data object that is contained in the IEnumerable that is set on the control’s ItemsSource property

The multi-column combo supports auto-generation (and/or manual definition) of the following column types:

  • TextComboColumn
  • CheckBoxComboColumn
  • ImageComboColumn
  • DateComboColumn

XamMultiColumnComboEditor also supports a lot of useful features like resizing the dropdown, customizing the footer and the dropdown area, filtering, different selection modes.

Resource Washer

This component is a new for Silverlight LoB Vol.11.2 (ported from WPF)

With Resource Washing, you can set the color (the WashColor) on groups of resources (WashGroups) in an existing ResourceDictionary to update the color of the controls in your application. Using Resource Washing, you can take a basic looking application and re-brand it to your corporate colors, of you can set a WashColor at runtime to change the look of an application.

The main features are:

  • Set the color color (the WashColor) on groups of resources (WashGroups) in an existing ResourceDictionary to update the color of the controls in your application.
  • Wash Modes

 

XamCalculationManager

The XamCalculationManager adds Microsoft Excel-like formula support to any control on the form, including native Silverlight controls and Infragistics XAML controls.

Some of the key feature of the new calculation manager are:

  • Over 100 Functions - With over 100 built-in Microsoft Excel-like functions including arithmetic, statistical and financial functions, your end users will enjoy the powerful computational capabilities in your applications
  • Asynchronous Calculation - When there are many records to be acted upon by the it can run in asynchronous mode for greatest performance
  • Formula Editor - Use the custom Formula Editor dialog at design-time, or expose this dialog at run-time so end users can modify formulas
  • Custom Formulas - Add your own custom formulas for data-driven lookups, analytics, etc.

XamCalculationManager has the following main parts:

  • XamCalculationManager - Manages all formulas as well as getting values from sources and setting values on targets of those formulas
  • ItemCalculator – Exposes an Item property and a collection of ItemCalculations which each identify a property on the specified item that can be the source and/or target of a formula.
  • ListCalculator – Exposes ItemsSource and Items properties as well as two collections.

The ListCalculator object allows you to bind to data and perform calculations on that data.

 

   1: <ig:ListCalculatorElement x:Name="listCalcElement" CalculationManager="{StaticResource CalcManager}"
   2:                                   ItemsSource="{Binding Path=AllShippingDetails}">
   3:             <ig:ListCalculatorElement.Calculator>
   4:                 <ig:ListCalculator ReferenceId="AllShippingDetailsCalculator">
   5:                     <ig:ListCalculator.ItemCalculations>
   6:                         <ig:ItemCalculation TargetProperty="Shipping" 
   7:                                             Formula="([Price] * [Quantity])"/>
   8:  
   9:                         <ig:ItemCalculation ReferenceId="Total" 
  10:                                             Formula="([Price] * [Quantity]) + [Shipping]"/>
  11:                     </ig:ListCalculator.ItemCalculations>
  12:  
  13:                     <ig:ListCalculator.ListCalculations>
  14:                         <ig:ListCalculation ReferenceId="GrandTotal" Formula="Sum([Total])"/>
  15:                         <ig:ListCalculation ReferenceId="AverageQuantity" Formula="AVERAGE([Quantity])"></ig:ListCalculation>
  16:                     </ig:ListCalculator.ListCalculations>
  17:                 </ig:ListCalculator>
  18:             </ig:ListCalculatorElement.Calculator>
  19:  
  20:         </ig:ListCalculatorElement>

 

Formula Editor

This is a new control. that provide a full-fledged formula editing experience for the end user with the XamFormulaEditor and its intuitive FormulaEditorDialog, which offers assistance and updates dynamically while he or she types.

  • XamFormulaEditor

The formulas can be edited in the XamFormulaEditor. When you change the values for x and y the results of the calculations are updated accordingly in the text boxes

 

  •   FormulaEditorDialog

Use the FormulaEditorDialog as a stand-alone control. When the Edit Formula buttons are pressed, a FormulaEditorDialog is displayed to the user.

 

 

Excel Library enhancements

The Excel Library now  includes the following new  features:

  • Shapes Support – Support for a few simple shape types including rectangles, right triangles, line shapes, and more. These can be created in code and saved to a workbook. In addition, shapes can now be flipped horizontally and vertically and you can change their outline and fill colors.
  • Data Validations – Constraints can now be placed on the values entered by users in Microsoft Excel. All data validations, including drop down lists and custom formula validations, are supported.
  • Print Titles – Groups of rows and columns can now be set to be repeated on each printed page when the users prints the worksheet in Microsoft Excel.
  • Print Area – Rectangular ranges of cells can now be set to be printed on their own pages when the user prints the worksheet in Microsoft Excel.
  • Page Breaks – Horizontal and vertical page break can now be added to the worksheets. This will allow you to force content to move to the next page when the user prints the worksheet in Microsoft Excel

Undo/Redo Framework (CTP)

This is a new framework, available in the NetAdvantage for Silverlight LoB Vol.11.2

The Undo Framework provides the infrastructure for supporting unlimited linear Undo/Redo functionality. Some of the main features are:

  • Undo/Redo History Stacks – The UndoManager automatically manages the Undo/Redo history stacks. The collections raise change notifications and therefore may be used as a source for providing a UI that displays the entries in the history stacks.
  • Built-In UndoUnits – The framework includes a number of built in undo units that providesupport for undoing/redoing property and collection changes.
  • Delegate UndoUnit – The framework makes it easy to add a method/delegate as an operation in the undo/redo history.
  • ObservableCollectionWithUndo – The framework includes a derived ObservableCollection that makes it easier to add support for undo/redo of collection changes.
  • Transactions – Provides the ability to group one or more operations into a single history entry. One may also rollback a transaction performing the operations that were stored up to that point.
  • Custom UndoUnits – The framework allows developers to create their own custom UndoUnit to support undo/redo of other types of operations.
  • Commands – A number of built in commands are provided to make it easier to invoke an Undo/Redo operation from within your UI.

 NetAdvantage for Silverlight LoB Vol.11.2 is coming next days. This is an excellent product with many new components and many new features to existing controls. Follow news from Infragistics in http://infragistics.com/ and twitter: @infragistics for more information about new Infragistics products.