Tag Archives: Silverlight

Create a Simple Report with Intersoft ClientUI Reporting

In the previous posts, I’ve wrote about the overview and features of our new ClientUI reporting lineup. Now that we’ve released the Reporting lineup, you can download a copy of the new 2013 release here and test drive the much anticipated Reporting for yourself.

In this blog post, I will explain how to create a simple report using Intersoft Reporting. To get started, run the standalone Report Designer application which can be found in the Intersoft Premier Studio 2013 program group. The complete shortcut path can be found below.

C:\ProgramData\Microsoft\Windows\Start Menu\Programs\Intersoft Premier Studio 2013 R1\WebUI Studio for Silverlight 5\Reporting

Once launched, you will see the Report Designer running in the browser that looks like the following:

Report Designer

Reporting is all about presenting data from a specific datasource. So before we started designing a report, let’s define the data source and related data definitions first.

Defining Data Definitions

Before performing data definitions tasks, it’s important to understand the ClientUI reporting data management concept. At the heart of the ClientUI reporting is the entity-based data source, which can be any objects – a simple POCO object or a complex domain model object. This means that it doesn’t coupled to any specific data providers. You can simply get the data the way you want and throw in into the report’s data source. The report viewer will take care the rest.

Back to the report designer. You can easily define data source by simply navigating to the Report Explorer tab, then click the AddDataSource button. This will launch a dialog to add a new data source. See the following illustration.

Define Data Definition

You need to specify the name and type of your data source. Actually there are 3 data source types you can use here, such as Entity (table), Method (Stored Procedure), or View. In this scenario, an Entity will be provided as a data source. Also don’t forget, you need to specify the properties owned by your data source, including it’s name and type.

Add Data Source

After added, now your Report Explorer tab will look like the following:

After Add Data Source

Designing the Report

Most functionalities you need to design a report can be easily accessed from the ribbon. From the ribbon, you can easily insert a title, logo, watermark, band, or report component into the design surface.

Design Ribbon Tab

First, let’s insert a ReportHeaderBand into the design surface. A report header will be printed once in a report, so it’s the best place for the report’s title or logo. You will notice that a visual adorner is attached to the left side of the band. The adorner allow you to re-positioning the band by using drag-drop. Besides that, you will also find a resize grip at the bottom side of the visual adorner. See the following screenshot.

Insert ReportHeaderBand

Next, insert the logo. Simply click the ‘Logo’ button and a file dialog will be appeared which require you to specify an image file. Then click the ‘Title’ and ‘Date & Time’ button to insert the report’s title and date. Suppose you need to customize it, you can done these easily from the property grid.

Insert Title

The next step is to display data in a report. Drag the data source which has been created before and drop it into the design surface. See the illustration below.

Drag Data Source

A dialog will be appeared, require you to specify which columns will be displayed in the report. Also you can define filter, sort, or group definitions in there by using drag-drop. See the following screenshot.

Create Data Band

Once the dialog is committed, a DataBand and it’s related band, such as HeaderBand, FooterBand, GroupHeaderBand, and GroupFooterBand, will be inserted automatically.

Auto Generated DataBand

Last, we will printed an image at the bottom of every report pages. In this scenario, a PageFooterBand will be used because page footer will be printed at the bottom of every pages.

Insert PageFooterBand

Insert an Image to the PageFooterBand, like the screenshot below.

Insert Image

Double click on the Image, then a dialog will be appeared and you need to provide the image source. See screenshot below.

Provide Image Source

After following those steps, your final report document will actually look like the following screenshot. Try to preview the report or open it using Intersoft ReportViewer, and don’t forget to save the report document for further usage.

Report Document

Displaying Report with Intersoft Report Viewer

In this section, we will open the saved report document using Intersoft Report Viewer. First, you need to create a simple Silverlight application. Then define the ReportViewer in your View like the following code:

<Intersoft:ReportViewer x:Name="ReportViewer"
                        ReportUri="{Binding ReportUri}"
                        ReportDefinition="{Binding ReportDefinition, Mode=TwoWay}"
                        ReportDataProvider="{Binding ReportDataProvider}"/>

Then provide the ViewModel. See the following code:

public class MainPageViewModel
{
   private Uri _reportUri;
   private ReportDefinition _reportDefinition;
   private ReportDataProvider _reportDataProvider;

   public Uri ReportUri
   {
      get { return _reportUri; }
      set
      {
         if (_reportUri!= value)
         {
            _reportUri= value;
            this.OnPropertyChanged("ReportUri");
         }
      }
   }

   public ReportDefinition ReportDefinition
   {
      get { return _reportDefinition; }
      set
      {
         if (_reportDefinition != value)
         {
            _reportDefinition = value;
            this.OnPropertyChanged("ReportDefinition");
         }
      }
   }  public ReportDataProvider ReportDataProvider
   {
      get { return _reportDataProvider; }
      set
      {
         if (_reportDataProvider != value)
         {
            _reportDataProvider = value;
            this.OnPropertyChanged("ReportDataProvider");
         }
      }
   }  public MainPageViewModel()
   {
      this.ReportUri = new Uri("Reports/SimpleReport.xaml", UriKind.Relative);
      this.ReportDataProvider = new NorthwindDataProvider();
   }
}

And don’t forget to define the report data provider. You need to derive it from ReportDataProvider class, and implement the ProvideData method. Make sure the provided data reflect the one which have been defined in your report document.

In this sample, we create a NorthwindDataProvider class which derives from the ReportDataProvider. The following code is provided for the sake of simplicity, you can obviously refactor it into a generic class and easily define the logic to get the data source using the preferred data service, i.e., WCF RIA Service or DevForce Service.

public class NorthwindDataProvider : ReportDataProvider
{
   List<Func<INotifyCompleted>> operations = new List<Func<INotifyCompleted>>();

   foreach (ObjectDataSource objectDataSource in reportDefinition.DataDefinitions.ObjectDataSources)
   {
      if (objectDataSource.IsRequired && !objectDataSource.IsLoaded)
      {
         Func<INotifyCompleted> op = this.GetQuery(reportDefinition, objectDataSource);
         if (op != null)
            operations.Add(op);
      }
   }

   Coroutine.StartParallel(operations, (op) => { this.MarkAsCompleted(); });
}

private Func<INotifyCompleted> GetQuery(ReportDefinition reportDefinition, ObjectDataSource objectDataSource, QueryDescriptor queryDescriptor = null)
{
   if (queryDescriptor == null)
      queryDescriptor = new QueryDescriptor();

   queryDescriptor.SuspendQueryChanged = true;

   if (objectDataSource.ParsedFilterDescriptors.Count > 0)
      queryDescriptor.FilterDescriptors.Add(objectDataSource.ParsedFilterDescriptors);

   queryDescriptor.SuspendQueryChanged = false;

   if (queryDescriptor.FilterDescriptors.Count > 0)
   {
      CompositeFilterDescriptorCollection collection = queryDescriptor.FilterDescriptors.OfType<CompositeFilterDescriptorCollection>().FirstOrDefault();
      List<FilterDescriptor> sorts = collection.OfType<FilterDescriptor>().Where(o => o.PropertyName == "SortBy").ToList();
      if (sorts != null && sorts.Count > 0)
      {
         foreach (FilterDescriptor sort in sorts)
         {
            queryDescriptor.SortDescriptors.Add(new SortDescriptor() { PropertyName = sort.Value.ToString() });     }

         queryDescriptor.FilterDescriptors.Remove(collection);
      }
   }

   Action<IEnumerable> initializeData = this.InitializeData(reportDefinition, objectDataSource.Name);

   switch (objectDataSource.Name)
   {
      case "Customer":
         queryDescriptor.SortDescriptors.Add(new SortDescriptor() { PropertyName = "CustomerID" });
         return () => this.DataManager.Customers.ExecuteAsync(queryDescriptor, initializeData);
   }

   return null;
}

private void AddDataSource(ReportDefinition reportDefinition, string objectDataSourceName, IEnumerable dataSource)
{
   if (!reportDefinition.DataSources.ContainsKey(objectDataSourceName))
      reportDefinition.DataSources.Add(objectDataSourceName, dataSource);
   else
      reportDefinition.DataSources[objectDataSourceName] = dataSource;
}

private Action<IEnumerable> InitializeData(ReportDefinition reportDefinition, string dataSourceName)
{
   Action<IEnumerable> action = (results) =>
   {
      this.AddDataSource(reportDefinition, dataSourceName, results);
   };

   return action;
}

Run the ReportViewer, and the result will look like the following screenshot.

Simple Report

Conclusion

In this post, I have explained how to create a simple report using Intersoft Report Designer and open it using Intersoft Report Viewer. Once you have the provider and ViewModel ready, you can rapidly create reports and present them in your application. Now feel free to try and make your own report. Should you find any difficulties or have any feedback, feel free to drop us a line in the comment box.

Warm Regards,
Jack

Advertisements

The new Intersoft Studio 2013 is here!

Finally, the wait is over! We’re very excited to announce the new Intersoft Studio 2013 release today. You can start your download here. I strongly suggest you to take a few minutes to read the press release which includes a number of important announcements – such as the Intersoft’s branding and edition changes as we’re expanding our portfolio to new market segments. You can also discover new products that are released in this milestone, and several new joint product bundles that are made available through collaboration with our partners.

Despite of the two-month delay, we trusted that the 2013 release truly worth the wait. It’s a commit of nearly 15 months of extensive research and development, putting together everything we do best across the existing lineups – from ASP.NET, Silverlight and WPF – to the new mobile development lineup. We’re pleased to announce our first version of Mobile Studio which marks a truly important milestone in our roadmap. Next, we also delivered the new Reporting lineup which is a huge addition to the existing Silverlight and WPF portfolio. Furthermore, we did not skip the ASP.NET lineup – four major upgrades are introduced in this release, making the mark of HTML5 support on all existing ASP.NET components.

On the much awaited Mobile Studio, we’re very excited to complete the first milestone which includes comprehensive cross-platform development toolset supporting four leading mobile platforms at once – iOS, Android, Windows Phone 8 and Windows 8. We’ve successfully unified the development experiences on both Mac and Windows which enable you to work with a single solution on both operating systems without worrying the references or compatibility issues. And for the first time in our release history, we shipped the most comprehensive product guide consisted of 300 pages covering the best practices, walkthroughs and concepts for building highly scalable enterprise mobile apps. We also shipped nearly 150 samples across all the four platforms. And yes, we now provided installers for both Windows and Mac OS, so you can start building great apps with the environment and tools you love the most.

The following screenshots show the three installer options available starting from the 2013 release. The first is the Mobile Studio for Mac, while the second and third is the installer for Windows. While most customers who build ASP.NET, Silverlight, WPF and mobile apps will likely choose the Premier installer, developers targeting mobile-only platforms will find the new Mobile Studio installer more compelling.

Mobile Studio for Mac OS

Premier Studio for Windows

Mobile Studio for Windows

You’ll also appreciate the time-saving Crosslight Project Wizard for Visual Studio 2012 which lets you create Crosslight-enabled solution in a single click away. We shipped four project templates with customized themes/layout that you can easily choose from the Wizard. And suddenly, you can simply press F5 in Visual Studio and see native mobile apps in action. In few minutes time, you can already start building your own business mobile apps and show it off to your users. Too good to be true? We heard that, and it’s time to proof it yourself. Find out more information about Crosslight here.

CrosslightWizard

In addition to many new exciting product lineups, the 2013 release also ships redesigned ASP.NET live samples and hundreds of new features and enhancements across existing lineups. For details, please check out What’s new in Premier Studio 2013.

Beyond product launches, the 2013 release puts together massive branding, identity and market positioning changes to the company in holistic way. The WebUI Studio Premier branding is no longer relevant as we’re entering the mobile segment now. As such, I’m pleased to announce the new Intersoft Premier Studio. These changes, along with the brand-new Mobile Studio joining the board, exhibits fundamental adjustment to all our infrastructure such as licensing, packaging, and online store. This leads to new direction and redesign to the company’s logo – as well as complete website revamp to deliver an authentic Intersoft’s user experiences to our customers.

Intersoft Website Redesign, New Store Experience, and more

Along with the website redesign of over hundreds of pages, we also introduced new Intersoft Account portal which unifies the Intersoft ID with the Intersoft Social ID. So, instead of logging into two different sites, you can now just sign into a single Intersoft Account portal and access your licenses, download the licensed products, review purchase history, print invoice, and access to your support and forum activities. Experience it yourself, head to the new Intersoft home as your starting point, then try signing into Intersoft Account portal, or visit 2013 Tour to check out the new release.

Intersoft's new Account Portal

In summary, a lot of energy has been put to make this release happen – from the development team to the designer and marketing team – doing their best to make great products. We’d like to thanks all our customers and partners who have contributed valuable feedback and thoughts to make the 2013 release the most impactful release ever.

Last but not least, enjoy the new Intersoft experiences, and download your copy of the new Studio here.  We hope you love the new 2013 Studio as much as we love building it!

Best,
Jimmy

ClientUI Reporting is Coming in 2013 R1 – Part 2

As we are heading toward R1 release, you may expect to hear more about ClientUI Reporting. Continued from my previous post, I will expose some interesting features in our Report Designer which will ship along with the report viewer. With the built-in design tool, definitely you can create a stunning report in a short time without spend too much hard work. Our engineering team also have put so much thoughts on these, so that it has great usability and superior user experiences. Featuring industrial-standards user interface, definitely you will be more convenient with such a powerful and visually attractive design workspace.

Introducing Industry’s Most Advanced Report Designer

ClientUI Report Designer is built from the ground up with modern design workspace that emphasize on true WYSIWYG experience. Unlike traditional designers, ClientUI report designer features clutter-less surface that allows you to work with the report elements as if they were in an actual page. This means that you will not see any designer-related visual adorners getting in the way on the designer surface. Instead, we created gorgeous visual adorners on the left side of the report with distinguished colors allowing you easily recognize each report section defined in the page.

We streamlined the overall report authoring process by arranging most frequently accessed commands in three major workflows represented in the ribbon tab group: Design, Format and Arrange. The Design tab lets you easily insert new report elements, while the Format and Arrange tabs let you quickly beautify the report elements. Everything is thoughtfully designed so both end users and developers will find the report designer very intuitive and pleasant to be used. See the following screenshot for the visual details.

The industry's most intuitive report designer

As seen in the above image, the Report Explorer tab on the right will show the report’s hierarchy. Inside there, you can see the already defined data sources and parameters. All report components also will be listed here. In addition, you can also perform various operations, such as add, edit, or delete, for each data source or parameter.

Advanced Property Editing

Handling vary types of object with it’s specific editor is not an easy task. A report component has a lot of properties which is difference from each others. In this scenario, performance issue need to be considered. To overcome it without performance degradation, Report Designer employs the most advanced property editing control, UXPropertyGrid. The property grid features high-performance UI virtualization that allows blazing-fast properties listing and rendering when you select an object. See the following screenshot.

Advance Property Editing

Independent Data Source Provider

Discussing about a report, you must be aware about the data source. As stated before, there are literally no constraints about the data source you should use, so you can utilize any kinds of data. All you need here is only to define the data definitions. You can define it manually like the following illustration.

Add Data Source Manually

But it would be very inconvenient if you need to specify a lot of data definitions manually. Actually you can import the definitions from a generated WCF RIA or DevForce assembly, without specifying it one by one. See the following illustration.

Add Data Source from Assembly

Powerful Design Tool with Drag-Drop Functionality

Drag and drop is one of the key feature in report designer. Report designing task will become more easy and simple with this functionality introduced. Various complex actions, such as object positioning, object creation, data field sorting, and much more, which usually need 3 or more actions to perform it, can be achieved elegantly by using drag-drop. Thanks to ClientUI’s robust Drag-Drop Framework, so our teams can quickly provide fluid drag-drop capabilities for the Report Designer.

Drag-Drop Functionality

Precise Layouting with Guidance Ruler and Snap to Grid Feature

Layouting is the most important step while creating a report, which will affects the final result. For some scenario, guidance ruler will be very helpful, especially for object positioning. As you can see on the below screenshot, those rulers are placed on top and left side of the design surface. Besides that, you can also enable Snap-to-Grid feature, which allowed you to precisely resize or move objects to a specific location.

Precise Layouting with Ruler and Snap-to-Grid Feature

Create Report Efficiently using Smart Tag

To create a report fast and more efficiently, you can take advantage of using the smart tag. Actually the smart tag has been designed to display some actions which is basically needed in most business scenario. It can save your time a lot rather than browse it from the property list.

Work Efficiently Using Smart Tag

Undo/Redo Capability

Undo/Redo is a very useful feature in Report Designer. As the name explains, it allows you to undo/redo a number of recent actions. Suppose you accidentally delete an object or something else, these actions still can be reverted easily.

Preview Report at Design Time

Another important feature not to be missed is the ability to preview a report at design time, because the iterative process of perfecting a report is accomplished by moving back and forth between the Preview and Design section. Of course, the preview section will show the result exactly the same as when it is printed. See the screenshot below.

Report Preview in Design Time

Okay, I think it’s enough although there are still so much exciting stuff about the Report Designer. I’d love to hear if you have any comments, questions or feedback about our Report Designer. Thank you for reading and stay tuned for the next update.

Warm Regards,
Jack

ClientUI Reporting is Coming in 2013 R1

As announced in our roadmap here, we’re going to introduce new major lineup for Silverlight and WPF in the coming release. A standalone reporting product is something that we’ve been working intensively since the past year.  Designed from the ground-up, ClientUI reporting is a full-fledged XAML reporting engine which includes a powerful C# style scripting support for the most demanding business reports.

Our development team have put so much hard work on the new breed of reporting solution for Silverlight and WPF, so that it has the power and flexibility you need to produce great-looking reports. It will also feature blazing-fast rendering performance, great usability and superior user experiences.

In this blog post, I will share the high level overview of the reporting’s uniqueness and its key features.

XAML-based Report Engine

Creating a business report using Intersoft reporting tools is definitely easy. It will be very familiar for Silverlight/WPF developers and won’t spend too much effort to learn it as it’s completely defined using a XAML-like report metadata. Since the reporting XAML conforms to the Visual Studio specification, you get all the productivity features you loved, such as Intellisense, property value auto completion and more.

The following example illustrates a XAML report document.

<ReportDocument Name="Report1" xmlns="http://intersoft.reporting.com/schemas" ReportUnit="Centimeters">
	<ReportDocument.DataDefinitions>
        ...
	</ReportDocument.DataDefinitions>	
	<ReportDocument.Pages>	
		<ReportPage Name="Page1" PageHeight="29.7" PageWidth="21" Margin="1,1,1,1">
			<ReportPage.Components>				
				<HeaderBand Name="InvoiceHeader" LayoutBox="0,7.4,19,0.8">
					<HeaderBand.Components>
						<TextBlock LayoutBox="0,0,2.2,0.8" Text="Product ID" TextAlignment="Center"/>
					</HeaderBand.Components>
				</HeaderBand>

				<DataBand Name="InvoiceData" LayoutBox="0,9,19,0.8" ObjectDataSourceGuid="ab5ee58b31fd440aa34aaec8735abf29">
				...
				</DataBand>

				<FooterBand Name="InvoiceFooter" LayoutBox="0,10.6,19,0.8">
				...
				</FooterBand>			
			<ReportPage.Components>		
		</ReportPage>
	</ReportDocument.Pages>
	<ReportDocument.Styles>
        ...
	</ReportDocument.Styles>   
</ReportDocument>

The XAML report document introduces numerous great benefits, such as it support property value inheritance, an interesting feature introduced in Silverlight/WPF XAML, which enables child elements in report tree to obtain the value of a particular property from parent elements, inheriting the value as it was set in the nearest parent element. To make the report even more neat and simple, it also support style which can be shared by all of the elements inside the report.

Full Client Rendering. Datasource Agnostic.

Talking about a report solution, many developers are concerned about the datasource support. Does it support SQL Server? How about Oracle? And so on. Unlike many reporting solutions which are server-based reporting, it’s important to understand that our reporting solution fully runs on client-side, from the data source population to the pixel-identical report generation and rendering. This means there are literally no constraints on the datasource, so you can retrieve data from domain service, web service, WCF service, or virtually any kind of objects that can be serialized over the wire.

The independence to the server allows our reporting engine to perform many tasks by its own in the client-side. There are numerous great benefits associated to this design, such as faster and more responsive user experience in the client-side. And more importantly, the authored report document is truly self-contained, which means that a single report document is all you need to deploy for user consumption. And since the report is a XAML file, you can quickly deploy a report by uploading the file to the website – it’s that easy.

C# Style Scripting Engine

One of the key features of Intersoft report engine is the powerful scripting engine. Scripting is essential to any reporting solution, so we want to make sure that we have the best-of-breed scripting engine that is intuitive to developers and require minimal learning curves. The engine has to be dynamic enough to evaluate complex, multi-line syntax – not only a single line expression – to support the most demanding business report authoring.

I’m pleased to introduce our C# style scripting engine, the industry’s first report scripting engine that supports complex C# style statements and syntaxes. Moreover, you have access to full .NET library and classes, you can get or set a property of an object, or even create new objects – all within the report scripting. And the best of all, our script engine performs nearly as fast as the compiled runtime execution – thanks to the full DLR integration and expression binding implemented in our scripting engine.

The following example demonstrates the basic usage of the scripting.

<TextBlock Text="@[Invoice.ShipPostalCode + ' ' + Invoice.ShipCity + ' ' + Invoice.ShipCountry]"/>
<TextBlock Text="@[string.Format('{0:C2}', (Invoice.UnitPrice * Invoice.Quantity * (1-Invoice.Discount)))]"/>

In addition, the report engine also supports scripting in the report events which can be authored directly in the report document. This allows you to accomplish dynamic report authoring without requiring code compilation. The following example shows what you can do in the Printing event of a TextBlock using our C# style scripting engine.

// TextBlock_Printing(object sender, EventArgs e)
var totalAmount = Math.Ceiling([Order.Order_Details.Qty] * [Order.Order_Details.UnitPrice]);
var highestAmount = Math.Max(totalAmount, [AllOrderAmount]);

if (highestAmount > [Customer.CreditLimit])
{
	e.Text = "Over limit";
	sender.Foreground = Colors.Red;
}
else
{
	e.Text = "Good";
	sender.Foreground = Colors.Black;
}

Enterprise-Grade Report Viewer

Of course, the report document is useless without the viewer that can render it. In this release, ClientUI will ships a viewer that can render the report document. What makes it truly set apart is its unique capability in handling large report document without performance bottleneck, thanks to the bare-metal virtualization implementation. It employs the most advanced rendering technique that prevent application from being freezed when rendering a lot of report pages.

In general, report rendering can be done in two ways, which can be set easily through the LoadingMode property. By default, all of pages will be rendered when report is loaded. Then busy indicator will be shown, prevent the report viewer from being accessed, until report is completely rendered. This is the mode that implemented in most reporting solutions in the market.

Rendering whole report document when report is loaded

Freezing the report viewer while the report is being processed may sound just fine for reports with only a handful of pages. The main problem here is you may not have ideas how many pages that your report may eventually generate. It could be dozens of pages, or hundreds of pages, depending on the business data size. In this case, users will notice the significant slowness of the report generation, and worse, thinking that the application has crashed after waiting for minutes.

This is where our innovative background report generation comes to rescue. We invented very sophisticated techniques that allow the report generation to be done in the background, while updating the user interface without sacrificing performance. This makes the user interface truly responsive and thus translates to great user experiences. With this mode, users can view the report as soon as the first page is rendered, and scroll down as more pages are rendered in real-time. See the screenshot below.

Rendering report document on background

Not only displaying report from the supplied data, it’s also possible to display a report based on user input at run-time. Our ReportViewer has provide a mechanism to generate and display the parameter dialog based on the report document. It’s really not an easy task to create the parameter dialog that handle different parameter type for each report you have manually.

Displaying report document based on user input at run-time

As you can see in the figure above, the report viewer also implement the sophisticated viewing features already invented in ClientUI’s document viewer, such as printing, precise text selection, copy to clipboard, zooming, and searching. On the left panel, users can easily preview pages in a thumbnail form and navigate throughout the report pages. Actually the thumbnail will be rendered exactly same with the real page’s appearance. See the screenshot below.

Preview report pages in a thumbnail form

To navigate through the section in a report, you can browse it using bookmark feature in ReportViewer.

Navigate through the section in a report using bookmark

In addition, our ReportViewer also provides a mechanism to display a report list which can be retrieved through many ways, such as directories lookup, from XML file, and etc. It also can be easily customized to overcome some specific scenario.

Displaying the list of available report document

Modular and Extensible Architecture

ClientUI will ship the report engine with various built-in report controls, which generally used in most of line-of-business scenarios. Unlike other reporting solutions, Intersoft reporting engine is designed with highly modular pattern, instead of being bundled in a huge code base. You only need to include what you need, so you can maintain the solutions to be lightweight. Built with extensible capability, it’s also possible for you to add a custom report control to overcome your business specific scenarios.

That’s all for now. Hopefully this blog post gives you a high level overview of our upcoming reporting. On the next post, I will share more interesting features, the report designer parts, and much more. Thanks for reading, and stay tuned!

Regards,
Jack

DevForce 2012 Support in ClientUI for Silverlight & WPF

Since 2010, we’ve partnered with IdeaBlade to provide our customers with a comprehensive and robust solution for building highly scalable line-of-business applications. The successful integration between IdeaBlade’s DevForce and our flagship ClientUI toolset significantly improves developer’s productivity – allowing them to leverage the MVVM pattern to build beautiful interface and at the same time enjoying the client-side LINQ query capability as well as many other advanced features available in DevForce.

As DevForce 2012 is now officially released to the market, we’re committed to continue supporting the latest DevForce version and leverage its new features in our toolset.  DevForce 2012 is the sevent-generation of the DevForce n-tier architecture released by IdeaBlade. This version has supported some noteworthy features such as .NET 4.5 asynchronous programming support, Entity Framework 5 support, and Windows Store Apps support. For more details, please visit DevForce 2012 information page.

DevForce 2012 Support

The latest suite of Intersoft WebUI Studio 2012 R2 ships with DevForce 2010 (version 6.1.7.0). In the next release, we’ll include full support for DevForce 2012. However, we’ll make available the new DevForce 2012 support assemblies so you can start using them today. In this blog post, I’ll share how to implement DevForce 2012 support in your existing applications.

We provide two kind of support for DevForce 2012 which are detailed in the following sections.

Using Backward Compatibility

This solution is intended for existing DevForce 2010 .NET and Silverlight projects which uses the “operation/callback” asynchronous API.

Migrating from existing DevForce 2010 projects to DevForce 2012 are made easy by applying the following rule.

  • Add a using/Imports statement to your code file for IdeaBlade.EntityModel.Compat.
  • Add a using/Imports statement to your code file for the new Intersoft data provider of DevForce 2012, Intersoft.Client.Data.Provider.DevForce2012.
  • Add a using/Imports statement of Intersoft.Client.Data.Provider.DevForce2012.Compatibility.

With this approach, you don’t need to change a single line of code in your project, while enjoying the benefits and new features available in DevForce 2012 and Entity Framework 5. I recommend you to go with this approach if your existing application is considerably large and you prefer to do the transition in progressive fashion.

Click here to browse the sample project which was created using Intersoft ClientUI MVVM Data Application using DevForce 2010. The project was later modified by migrating the DevForce 2010 to DevForce 2012.

Using Native DevForce 2012 API

Asynchronous patterns

The Task-based Asynchronous Pattern (TAP) is based on the Task and Task<TResult> types in the System.Threading.Tasks namespace, which are used to represent arbitrary asynchronous operations. TAP is the recommended asynchronous design pattern for new development.

DevForce 2012 has implemented the use of TAP. By implementing this, we are able to use the await keyword, which makes asynchronous method calls feel synchronous when we’re writing code.

Instead of writing callback, lambda expressions, or coroutines, we now use await. Here is an example about the implementation of await.

Using lambda expression in DevForce 2010

public virtual void GetData(Action<IEnumerable> onSuccess, Action<Exception> onFail)
{
    if (Intersoft.Client.Framework.ISControl.IsInDesignModeStatic)
        return;

    var query = this.EntityQuery;

    query.ExecuteAsync(
        op =>
        {
            if (op.CompletedSuccessfully)
            {
                if (onSuccess != null)
                    onSuccess(op.Results);
            }
            else
            {
                if (onFail != null)
                {
                    op.MarkErrorAsHandled();
                    onFail(op.Error);
                }
            }
        });
}

Using await in DevForce 2012

public virtual async Task<IEnumerable> GetData()
{
    if (Intersoft.Client.Framework.ISControl.IsInDesignModeStatic)
        return null;

    var query = this.EntityQuery;

    IEnumerable results = await query.ExecuteAsync();
    return results;
}

GetData() method which previously doesn’t return anything (void) now returns Task. The lambda expression is replaced with following line of code.

IEnumerable results = await query.ExecuteAsync();
return results;

onSuccess and onFail parameters – the callback to invoke when the operation succeeded or failed – are no longer available. You handle them in the same way and manner as you wrote synchronous code, that is by wrapping them in a try-catch syntax.

We now provide a new version of DevForce data provider that supports async and await operations which conforms to DevForce 2012 native API. For example, you can now use the following code to query a list of customers from the repository.

private async void LoadCustomers()
{
    try
    {
        var customers = await this.CustomersSource.GetData();
        this.Customers = customers;
        this.IsCustomersLoaded = true;
    }
    catch (Exception ex)
    {
        this.Presenter.ShowErrorMessage(
                "An exception has occurred during data loading\n." +
                "Message: " + ex.Message +
                "Stack Trace: " + ex.StackTrace);
    }
}

Click here to browse the sample project in github which was created using Intersoft ClientUI MVVM Data Application using DevForce 2012. Note that the new DevForce support assemblies can be found in the sample project.

Definitely there are so much exciting stuff in the continuing collaboration of ClientUI and DevForce 2012. Let me know if you have any questions or feedback about the DevForce 2012 support, or how we can improve it better for you.

Warm Regards,
Yudi

Announcing Intersoft 2013 Product Roadmap

We’ve recently completed the product planning and strategy for the rest of the 2013 fiscal year. There are a lot of new exciting direction in our product lineup which is exactly what I want to share in this blog post. Many of our roadmap will be based on your feedback – thanks for participating with our 2013 product survey. If you haven’t aware with the survey, please click here to participate and let your voice be heard.

Flashing back at a glance, 2012 was such an amazing year as we delivered hundreds of new controls to various .NET development platforms. We delivered major line-of-business controls which include a high-performance tree list, a multitude of data-aware controls such as pageable combobox, multiple selection combobox, innovative query builder; Windows 8 style navigation controls as well as the industry’s first charting suite with full MVVM and data binding support. In addition, all flagship ASP.NET components have been updated to support latest browsers, and several have been redesigned to support HTML5.  As you can see, it was really one of our most aggressive releases in our release history.

As you may have aware, all our product lineup so far (until 2012 R2) are mainly based on Microsoft’s .NET technology and strongly focused on line-of-business application development for the Web and Desktop platforms which include ASP.NET, Silverlight and WPF. To the date, we’re proud to empowering hundreds of thousands developers worldwide with an indispensible toolset that enables them to build .NET based business applications easily, quickly, and rapidly.

While the web and desktop platforms will still be around in the foreseeable future, we learnt that the software development landscape and paradigm has shifted aggressively to target mobile devices. Of course, that’s not a new story as the mobile development ecosystem has existed since the advent of iPhone and Android devices. Back at those times, most apps were targeting consumers – and there are very little needs or demands in the business or enterprise spaces for mobile apps. However, based on our extensive research and development since the past year, and based on the demands from our enterprise customers, we’ve seen the light shed on the mobile world. Read on.

Enter the Mobile World

At Intersoft, our ultimate mission is to create incredibly powerful and easy-to-use tools that enable rapid business application development. From ASP.NET, Silverlight to WPF – we’ve accomplished our mission very well. This year, we will continue our development journey to the other side of the world – the mobile development world. I’m very excited to announce that the mobile tools development will now become our priority and we’re committed to deliver successful mobile tools – just as we’ve successfully delivered hundreds of ASP.NET, Silverlight and WPF tools.

Why entering the mobile development world, you might ask. There are a number of reasons why we finally decided to jump into the mobile bandwagon, but I’ll try to keep my answer simple: because it’s the future of computing. Sure, people will continue to use their PC at home (as in Gates vision “One PC at every home’s desk”), but today people no longer spent most of their time on the PC – thanks (or blame) to the powerful ARM-based mobile devices that allows you to do many productivity tasks on the go.

The same paradigm has now entered the small and medium business as well as larger enterprises. Ask yourself this question, why would you need a PC on your office desk if you can login to your corporate network and check your sales reports, signing documents, review executive dashboards and many more – all with the small mobile device in your hand? Furthermore, with low-cost and affordable mobile devices today, businesses have started to reveal the benefits and advantages of mobile over PC such as reduced TCO and maximized employees productivity. As businesses increase their interest and demands on mobile, that will mean one thing in the end: increased demands on business mobile application development

Ultimately, that will simply mean one thing to you: get yourself ready for mobile development. And to us: get ready to deliver mobile tools for rapid business apps development.

Mobile Development Challenges

As a third party .NET vendor, it makes sense to choose the easiest and closest route to enter the mobile development, and that would be definitely the Windows Phone or WinRT since both are still based on .NET platform. The main problem, however, is the relatively slow adoption rate which makes it less appealing on the business side. This is understandable because enterprises cannot control what mobile devices their employees and consumers use. Most requirements that we heard from our enterprise clients will be to support at least two of the most owned mobile devices. Needless to say, that will definitely fall to iOS and Android based devices. As we see it, one of the biggest challenges here is multiple mobile platforms support, just like multiple browsers support in the Web development.

Obviously, we all loved .NET and C# which has been our mother language for decades. And also to the Silverlight and the great MVVM pattern that allow us to layer our applications in a way that enables truly scalable and extensible architecture. As you discover the mobile development, you will find horrible platform divergences and unfortunately none of your favorite skills are applicable in these mobile native platforms, for examples, iOS uses Objective-C while Android uses Java. Alternatively, you may want to resort to HTML5 – only if your users afford mediocre and compromised user experiences.

If you’re Silverlight or WPF developers, you may feel – at a glance – reaching the bottom of your career. You might be unfamiliar with Objective-C or Java, yet you hated JavaScript. It’s a rather difficult choice – go learn Objective-C, Java and WinRT; or anxiously waiting for new clients wanting to build Silverlight apps. None of these choices sound appealing.

But wait a second, what if it’s possible to write native iOS and Android apps leveraging exactly the same .NET skillset that you already accustomed to? And takes it even further, what if you can build iOS and Android apps using your favorite Silverlight-style data binding and MVVM pattern? That would be too good to be true, you might think. If such “possibility” exists, that will not only save your careers and make your development life a lot easier, but more importantly, it opens up a whole new opportunities to explore and a lot of potential business apps that you can contribute for the world.

Frankly speaking, we’ve been extensively researching to look for that “possibility” in the past years. We were silent and seemingly have no progress whatsoever when it comes to mobile. That’s because we want to ensure everything before we gave you that shed of light, the news of the existence of that “possibility”. We’re almost there, read on.

Introducing Crosslight

So here we are. I’m honored to be the first to announce our mobile tool project codename “Crosslight”. Yup, Crosslight. As if it’s the reborn of Silverlight, Crosslight enables you to use the same Silverlight and MVVM skillset to create cross-platform mobile applications. And so that’s how the name was coined. I tend to think the philosophy this way “The light to the cross-platform mobile development”.

If you’ve developed MVVM-based Silverlight apps using our ClientUI library, you’ll find pretty much the same thing in Crosslight. You’ll find delegate command, event aggregator, IoC container, and everything you loved about MVVM such as ViewModel, and converter. So far, we’ve managed to revive many of the data binding capabilities found in Silverlight such as two-way data binding, converter, nested property path binding, collection binding, item templating and more – and we have recreated all those capabilities to both iOS and Android platforms.

At the end, you’ll be able to create business apps that are not only targeting iOS and Android, but also targeting Windows Phone 8 and WinRT. I hope you’ve got it clear at this point, Crosslight is all about modern mobile development, from iOS, Android, to Windows Phone 8 and WinRT. Along the way, we will be also introducing our new technology partner who provides non Microsoft implementation of .NET that makes Crosslight a reality. Stay tuned for the upcoming announcement.

We believe that the best and the right direction for the mobile development is to build mobile apps using the native SDK of each platform – instead of hybrid HTML5 apps. Now that you can build amazing mobile apps with C# and MVVM, there are no reasons for not building one with native SDK which offers the best, uncompromised user experiences.

Soon – hopefully before the end of March – you’ll be able to beta testing Crosslight and start building your first cross-platform, MVVM-based mobile business apps.

Silverlight, WPF, ASP.NET and HTML5

Now that we’re going to have Crosslight, what’s going to happen to Silverlight and the rest of .NET platforms? Needless to worry, we’re highly committed to the existing platforms who make the most of our customer base. We will continue to make new best-of-breed components for Silverlight and WPF – particularly the new Reporting lineup which has been in development since last year. This reporting lineup is huge and noteworthy – because we’ll bring in new technologies that weren’t possible previously. That’s mainly because most reporting players in the market didn’t build their Silverlight/WPF reporting product from the scratch, but simply porting from .NET 2.x based which used old and outdated techniques.

On the ASP.NET lineup, this year we will have major upgrades to all our ASP.NET components. And when we say “all”, we really mean it. This simply means that all ASP.NET components will be redesigned to support HTML5 and CSS3, including WebEssentials, WebInput, and WebTreeView. Also expect new version of WebScheduler with improved day light saving and time zone support, as well as new version of WebTextEditor with IE10 support and much more.

Wrapping up

At this point, you can see for yourself that 2013 is going to be a very exciting year for all of us. The new Crosslight, and new tools across Silverlight, WPF and ASP.NET will keep us busy enough throughout the year. In the upcoming 2013 R1 release, we will be the first vendor to offer toolset with the broadest platforms support– ASP.NET, Silverlight, WPF, iOS, Android, Windows Phone and WinRT.

This is probably the longest product roadmap blog that I’ve ever wrote so far. But I hope you enjoy reading and learning our roadmap, and hopefully it gives you insights about our direction, where we will spend our time and effort the most, and what you will receive as part of your on-going annual subscriptions. So the next thing that you should do is checking your account and make sure your Premier subscriptions are up-to-date for the rest of the year.

To find out more details about our 2013 roadmap, please logon to Intersoft Developer Network using your Intersoft ID to read the complete details about the upcoming products as well as the release schedules. After logged on, bring up the Home window, then click on the link in the Announcement section to open the product roadmap window.

For prospect customers who are interested in our 2013 roadmap, please send your email to sales@intersoftpt.com to request a copy. We’ll send you a copy of NDA to be signed in order to receive the roadmap details.

Best,
Jimmy

Create Drill Down Chart with UXChart

Quite often, you will need to allow your user to drill-down data from yearly data to monthly or from categories to individual items. Now it’s very easy with our new concept which gives you freedom to create unlimited levels of drill-down charts from a single data source in minutes.

In this blog post, I want to show an example of drilling down chart data, i.e. to display master-detail data in the same chart, by clicking a point of the first series will let another series shown, which represents detailed data related to the selected point. This is critical for creating interesting and fun charts to interact with. This blog entry includes basic knowledge of what you can do with our chart right out of the box. See the following screenshot for the drilling down chart that we want to create.

Drill down chart

To get started, we use the Child properties in UXChart to specify which chart that we want to display as detail of origin chart. Specifically, all charting collections must be defined in View in a first place. On first load, you are allowed to display one chart only, and the others’ visibility must be set to collapse. See the code below:

<dataVisualisation:UXChart x:Name="Chart1" Visibility="Visible" Child="{Binding ElementName=Chart2}"
                        DrillDownCommand="{Binding DrillDownCommand}">
</dataVisualisation:UXChart>

<dataVisualisation:UXChart x:Name="Chart2" Visibility="Collapsed"  >
</dataVisualisation:UXChart>

Next, we need to hook our custom command to control the drilldown action, we called it DrillDownCommand.

  public DelegateCommand DrillDownCommand { get; set; }

And then we assign DrillDownCommand to some execute the method in our ViewModel.

 this.DrillDownCommand = new DelegateCommand(ExecuteDrillDown); 

In the execute method, we can initialize the data from the data source and retrieve detail information about the chart itself.

    
private void ExecuteDrillDown(object parameter)
{
   UXChartDrillDownCommandArgs args = parameter as UXChartDrillDownCommandArgs;

   if (args.Level == 1)
   {
     Data parent = args.DataPointContext as Data;
     if (parent != null)
     {
       InitializeDataByArea(parent.Area);
     }
   }
}

In conclusion, with simple implementation, we already make drill down function very simple and effortless. Now feel free to try and make your very own drill down chart. There’s unlimited level that you can figure out and explore.

For more information about our ClientUI control in Silverlight & WPF, please refer to the online documentation. You can download our sample here. Feel free to drop us any questions or feedback.

Till we meet again.

Cheers,
Yanes