Xpert360 Lightning FUSION CE for VS2012 RC Released

The VS2012 RC version was packaged and uploaded for preview to the Visual Studio Gallery today. The LightSwitch 2011 version needs some final integration tests running tomorrow. We tried out the extension on the LightSwitch HTML Client VHD preview and we will build a version for that too.

Here in our Xpert360 development labs we have been busy prototyping, designing, building and testing companion products for Visual Studio LightSwitch 2011 and 2012 RC. This is the first in the FUSION range that augment the LightSwitch designer capabilities. In time, we hope that similar features will be added to standard product. Meanwhile, we will support and enhance these extensions.

We have dedicated the LightSwitch Screen and Query Clone features to the Microsoft LightSwitch Team who are continuing to enhance and deliver arguably the most awesome RAD platform. Just look at that HTML Client preview!

Download from VS Gallery

Xpert360 Lightning Fusion CE in the VS Gallery

Lightning Series FUSION – Contact entity in the prototype companion designer.

Lightning Series Fusion – Clone Screen Menu Item

Clone LightSwitch Screens and Queries

Click to reload the LightSwitch LSML files, reload the designer to access the cloned screen or query.

Do make sure you take backups and report back on your successful cloning. Any problems then get back to us and we will try to diagnose and fix.

Some points of note

1. The new menu commands are available in the context menus for LightSwitch screens and queries in the solution explorer window.
2. The name of the cloned entity is taken from the original entity name with a version number appended.
3. Always make sure you take backups of your project.
4. The clone functions manipulate the Client.lsml file.
5. After cloning you will be prompted to reload the Client.lsml file, then the designer, this is normal behaviour.
6. After the project reopens you can access the cloned screen or query.
7. This extension works with VS2012 RC, not the HTML Client preview and not LightSwitch 2011.

Testing

Whilst every effort has been taken to ensure the clone functions operate correctly in a wide variety of LightSwitch projects it is up to you to test and verify that it works in your environment, with your custom LightSwitch extensions, service packs, patch levels and complexity of screens.

The Xpert360 development team have performed extensive testing against all standard LightSwitch types, custom controls and custom business types including the Pixata controls.

We are now adept at running tools to diagnose and fix corrupt Lsml files, even manual Xml edits: so you don’t have to hopefully!

What it does not do

We have not tested against custom shells and all possible custom controls from third-parties. You can help yourselves and the community by providing feedback for third-party controls that work with FUSION CE and reporting any bugs to warn others and so that we can investigate and supply fixes.

The clone functions do not clone or copy custom C# or VB code associated with a screen or query.

We are in the final stages of packaging a version that works with LightSwitch 2011.

We are working on a preview version to work with the HTML Client VHD version of VS2012 RC.

Anybody ever wanted to clone a LightSwitch Screen?

[UPDATE: 28-MAY-2012] Released VS2012 RC version http://xpert360.wordpress.com/2012/06/28/xpert360-lightning-fusion-ce-for-vs2012-rc-released/ in Visual Studio Gallery: http://visualstudiogallery.msdn.microsoft.com/c3774d50-a695-4a89-a8d0-6f0b55711ad9?SRC=Home.

[UPDATE: 22-MAY-2012] VS2012 RC version passed tests today and will be packaged and uploaded for preview to VS Gallery as soon as possible. LightSwitch 2011 version needs final tests running. Just back from a great UKWAUG Microsoft Cloud Day London so taking some refreshment.

Here in our Xpert360 development labs we have been busy prototyping, designing, building and testing companion products for Visual Studio LightSwitch 2011 and 2012 RC.

When you try these products you will know why we consider them to be the essential LightSwitch companions. We are very excited by these tools and just don’t know how we ever managed without them.

We would like to dedicate the LightSwitch Screen Clone feature to the Microsoft LightSwitch Team who are continuing to enhance and deliver arguably the most awesome RAD platform.

Lightning Series FUSION – Contact entity in the prototype companion designer.

Take the following default LightSwitch List Detail screen for the Contacts entity served-up by the Lightning Series for Dynamics CRM Online data adapter. This entity has more than 150 properties and is unwieldly to manage in the standard IDE.

Default ListDetail screen for Dynamics CRM Online Contacts

After investing some 15 minutes frantically deleting, clicking and dragging items around in the LightSwitch screen design we are now approaching a half-usable screen design.

LightSwitch screen in design undergoes many iterations and there is no undo function!

We just invested considerable effort (in LightSwitch timescales!) modifying this read-only screen and we need a similar screen that allows the end-users to edit some of the Contact’s properties. Start again? No, just clone it!

Lightning Series Fusion – Clone Screen Menu Item

Click to reload the LightSwitch LSML files and a few quick edits…

FUSION – Cloned Screen generated and modified in a couple of minutes

1. Add LightSwitch screen – 10 seconds
2. Re-design screen – 15 minutes
3. Clone screen – 10 seconds
4. Time saved – priceless!

Community edition coming to your LightSwitch IDE desktop very soon!

So you got this far, still reading. I think I’ve got that friday feeling #FF so lets tease you some more. What if… I could transfer screens between projects. Why not include queries, entites and all my settings. What if… I could generate documentation, compare projects, mass generate screens, mass change property attributes, apply templates, localise my application in a few clicks. Yes, these are the things LightSwitch dreams are made of. What else would you want to do? What a wonderful LightSwitch world it would be! Coming soon too…

Working with SalesForce and Dynamics CRM data in Visual Studio 11 Beta

Microsoft Visual Studio 11 beta and Windows 8 Consumer Previews were made available on Feb 29th 2012. They will be valid through to June 2012.

The Xpert360 development team took the beta for a spin with the latest versions of the Xpert360 Lightning Series product builds: WCF Ria Service data source extensions for LightSwitch and .NET 4 that connect to salesforce and Dynamics CRM Online instances.

VS11 Beta Premium Applying: LightSwitch Beta Core

After the VS11 install a quick rebuild of the data extensions VSIX in VS2010 pulled in the latest software versioning as shown below:

Clip for LightSwitch Data Extension vsixmanifest

The new VSIX files now prompt for the version of Visual Studio if not already installed and within ten minutes of the VS11 install we are building our first Visual Studio LightSwitch 11 application to interact with our CRM test systems.

LightSwitch project templates in VS11 Beta

Then we create new data connections with the Xpert360 Lightning Data Extensions.

LightSwitch designer - Choose a WCF Ria Service!

… and we move on and choose some of the CRM entities exposed by the service.

LightSwitch designer - Select Data Source Objects from Dynamics CRM Online

The chosen entities appear against the data source in the LightSwitch designer and can be explored and manipulated as usual. Notice the automatically available entity relationships between the salesforce entities.

LightSwitch designer - SalesForce Opportunity Entity with chosen subset fo relationships

A few more clicks to build a list detail screen…

LightSwitch designer - Xpert360 Lightning Data Extensions

Ten minutes later we have our first CRM data from salesforce and Dynamics CRM Online.

LightSwitch - SalesForce Opportunities List Details at your disposal

Looking around in the VS11 IDE the default theme has faded to grey, perhaps its vying for an Oscar with ”The Artist”. Here are the two LightSwitch project views available in solution explorer:

LightSwitch designer - Logical and File views

If you are embarking on custom UI controls with Silverlight 5 then here are the available project templates in VS11:

VS11 Beta Silverlight project templates

We are also eagerly awaiting the VS11 LightSwitch Extensibility Toolkit which has been indicated to be ready in a few weeks by Beth Massi:

• Visual Studio LightSwitch Team Blog

The Xpert360 Lightning Series data extensions will unleash the true power of LightSwitch onto your salesforce CRM and Dynamics CRM Online data very soon. They are currently undergoing private beta testing which will now be extended to include the VS11 Beta as this platfrom has a go-live license.

If you somehow missed all the anouncements here are the links:

• Announcing LightSwitch in Visual Studio 11 Beta! – LS Team blog
• Welcome to the Beta of VS11 and .NET 4.5 – Jason Zanders Weblog
• Visual Studio 11 Beta downloads – Microsoft Visual Studio

Any feedback or enquiries welcome at mailto:info@xpert360.com

Silverlight 5 RC – Getting started with PivotViewer

[Updated 06-SEP-2011 - NEW SAMPLES]

Lovely jubbly! Silverlight 5 RC is here…

Documentation

Do download the offline help CHM or use the matching online MSDN documentation which is now available – MSDN PivotViewer class

Next step: I need some sort of “Hello world” PivotViewer application, please…

Hello New World!

Look in the “PivotViewer class” help at the bottom, and/or download my sample. I have uploaded this very basic sample for DOWNLOAD as some people seem to be experiencing problems. If this simple sample doesn’t work then likely there is something wrong with your environment. My environment is W7 64-bit Ultimate, VS2010 Sp1, Sl5 Beta (not uninstalled; I know, bad boy, but I was in a rush ;) and then Sl5 RC. Also quad-core 8GB memory, here is very simple stress test SAMPLE too, feel free to modify it. This simple works when not served from a web server.

It isn’t pretty but that is not the point. If you are having problems then get back to check out why. Happy PivotViewing! I’ll post some better samples in the next few days.

Hello world from SL5 RC PivotViewer!

Hello OLD World!

Here is a sample mixing some legacy CXML collections from Xpert360 with some Silverlight 5 RC PivotViewer and some styling for you to play with. Again feel free to modify.

DOWNLOAD SOURCECODE

And some screen shots…

PivotViewer sample Silverlight 5 RC CXML style

…

PivotViewer sample Silverlight 5 RC CXML style

PivotViewer Shorts Part 5: Invert Facet Category Selections

Silverlight PivotViewer Invert Facet Category Selections

Introduction

By default the Silverlight PivotViewer control does not support inversion of a facet category’s selections, even though internally the control has the functionality.

Some people have expressed a wish to improve the UX with a custom button to implement ‘invert selection‘.

This short post shows how to locate the UI elements for the facet manager and the view model in order to access this feature.

Locating the UI Elements

The flow of the code goes something like this:

• Locate the “PART_Container” in the tree. This is a Grid control.
• Locate the CollectionViewerView control.
• Locate the CollectionViewContainer control.
• Locate the CollectionViewerViewModel control.

Grid partContainer = (Grid)this.GetTemplateChild("PART_Container");
CollectionViewerView cvv =
    ((CollectionViewerView)(partContainer).Children[0]);
Grid container = cvv.Content as Grid;
Grid viewerGrid = container.Children[1] as Grid;
CollectionViewContainer cvc =
    (CollectionViewContainer)viewerGrid.Children[0];
CollectionViewerViewModel cvvm =
    (CollectionViewerViewModel)ViewBehaviors.GetViewModel(cvv);

The FacetManager contains a method to invert a facet category’s selection:

cvvm.FacetManager.InvertSelectionInCategory(cvc.SortCategory);

FAQ

The easiest way of accessing this feature is with a custom button though no doubt a keyboard shortcut could be conjured up.

You will need some internal Microsoft Pivot references and usings too. Depending upon the extent of your other customizations you will need these:

+

using System.Windows.Pivot;
using Microsoft.Pivot.Internal.Controls;
using Microsoft.Pivot.Internal.Model;
using Microsoft.Pivot.Internal.ViewModels;
using Microsoft.Pivot.Internal.Views;

+

Further things to do

• Xpert360 PivotViewer Blog Article Index
• PivotViewer Control – Public API
• Microsoft Silverlight Forums – PivotViewer Control
• Xpert360 Ltd – who allow time for blogging

Conclusion

This article is a brief guide to locating some visual elements of the Silverlight PivotViewer control in order to access the internal functionality that inverts the selections of a facet category. It targets the developer who has already started customizing the Silverlight PivotViewer control beyond the public API and alter the UX.

Any comments or request for future topics are welcome.

PivotViewer Shorts Part 4: Restyle the ZoomSlider child controls

Introduction

By default the SL4 PivotViewer control displays a custom control for controling the zoom-level of the tile views. A few people have expressed a wish to totally reskin the control and this is a step along that path that hints at the technique needed to dig deeper into the PivotViewer visual tree.

 

This short post shows how to locate the UI element for the control bar, the ZoomSlider, all its visual elements and then alter their background.

 

PivotViewer ZoomSlider Re-Styling

 

Locating the UI Elements

The flow of the code goes something like this:

• Locate the “PART_Container” in the tree. This is a Grid control.
• Or… go direct to the “PART_ControlBar” element.
• Locate the ControlBarView to access the child controls.
• Build a list of child controls using VisualTreeHelper.

// Locate UI Elements
    ControlBarView ControlBar = (ControlBarView)this.GetTemplateChild(“PART_ControlBar”);
    Grid ctrlBarContent = (Grid)ControlBar.Content;
    DockPanel ctrlBarDockPanel = (DockPanel)ctrlBarContent.Children[2];
    ContentControl ZoomSlider = (ContentControl)ctrlBarDockPanel.Children[2];
    ContentControl cc1 = (ContentControl)ZoomSlider.Content;
//
// Build a list of the child controls
    var ctrls = GetChildsRecursive(cc1);
//
// Pick out controls and re-style as you wish 
    foreach (UIElement ctrl in ctrls)
    {
        string s = ctrl.GetType().ToString();
        switch (s)
        {
            case “System.Windows.Controls.Button”:
            Button b = (Button)ctrl;
            b.Background = new SolidColorBrush(Colors.Orange);
            break;
        case “Microsoft.Pivot.Internal.Controls.ClickDragSlider”:
            ClickDragSlider cds3 = (ClickDragSlider)ctrl;
            cds3.Background = new SolidColorBrush(Colors.Green);
            break;
        default:
            break;
        }
    }
;

// Helper function for child controls
IEnumerable<DependencyObject> GetChildsRecursive(DependencyObject root)
{
    List<DependencyObject> elts = new List<DependencyObject>();
    elts.Add(root);
    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(root); i++)
        elts.AddRange(GetChildsRecursive(VisualTreeHelper.GetChild(root, i)));
    return elts;
}

+

FAQ

If you want to try out the code there are a few things to watch out for.

+

You will need some internal Microsoft Pivot references and usings too. Depending upon the extent of your other customizations you will need these:

+

using System.Windows.Pivot;
using Microsoft.Pivot.Internal.Controls;
using Microsoft.Pivot.Internal.Model;
using Microsoft.Pivot.Internal.ViewModels;
using Microsoft.Pivot.Internal.Views;

+

Further things to do

• Xpert360 PivotViewer Blog Article Index
• The code should be nicely wrapped up and encapsulated in the CustomPivotViewer override class.
• PivotViewer Control – Public API
• Microsoft Silverlight Forums – PivotViewer Control
• Xpert360 Ltd – who allow time for blogging

Conclusion

This article is a brief guide to locating some visual elements of the Silverlight PivotViewer control in order to customize the styling of the ZoomSlider control. It targets the developer who has already started customizing the Silverlight PivotViewer control beyond the public API.

 

Any comments or request for future topics are welcome.

 

Windows Phone Developer Tools 7.1 (Beta) install

[Updated 25-May-2011]

Introduction

The beta of the ‘Mango’ Windows Phone Developer Tools 7.1 is ready for download here: vm_web2.exe (the installer). I thought it would appear here App Hub Downloads but apparently not so far [UPDATE: download page has been refreshed]. If you have not done so you will also want to register here App Hub.

 

Final release announced on all devices in the Fall 2011. Mango developer devices to ship on July 19th. We will track the progress in this blog article until the final release.

 

Download and Install

 

You will need to exit Visual Studio and Zune applications before the installation will proceed. The full download looks to be 491 MB. You will also need VS2010 SP1 just as for the Silverlight 5 Beta.

Windows Phone Developer Tools 7.1 (Beta) Mango!

Some of the consumer features:

• Smarter Apps & Live Tiles
• Groups
• Local Scout
• App Connect
• Internet Explorer 9
• Threads
• Multi-tasking
• People-centric pictures
• Quick Cards
• Enhanced Hubs
  

  Mango - Internet Beyond the browser

 New API’s in Silverlight for Windows Phone OS 7.1 on MSDN Library – its big, very big!

New Visual Studio Project Templates

Go open up VS2010 ‘New Project’ and…

Silverlight for Windows Phone templates

 Also XNA…

XNA templates

Emulator Language Support

 

Full list is here! Now that is a whole lot better than before.

 

As promised, lots more display languages show up in the settings of the emulator, plenty more regional setting and system locales, at last…

Mango Emulator Display Languages

Plenty more…

Many more display languages in Mango

And here is an example of a warm Dutch welcome to the settings page Mango style… 

Windows Phone Settings in Dutch NL

 And if you so desire here is IE9 in the emulator running Bing search under the chinese zh-MO system setting…

WP7 Mango IE Bing Search in chinese zh-MO apparently

 

Feedback

Good things…

• Makes NoDo look like Windows Phone V0.1 software
• Wp Tools 7.0 and 7.1 work side by side @mikehole
• More app samples than you can shake a stick at
• App Connect, Local Scout and Quick Cards > location aware
• Synergy between XNA and Silverlight in hybrid apps
• Local Database for Windows Phone
• Camera Applications for Windows Phone

 

Gotchas…

• Internet Explorer Mobile 9 is DOA Without Touch Support
• Exceptions with ReSharper 9?
• Non-USA data for Local Scout?
• Debugging Xaml Data Bindings – works for SL4/SL5 not phone
• Checked French and saw some string resources not translated (yet) in settings!

 

Further things to do

We will update this blog article with news, bug details, resources links and feedback as it becomes available.

• APP HUB News Details 
• Follow on The Windows Phone Developer Blog
• Update MSDN Windows Phone Development
• MSDN documentation on New API’s
• MVVM Light Toolkit patch from Laurent Bugnion
• Culture and Language Support - MSDN
• Xpert360 Ltd – who allow time for blogging

Conclusion

This article is a brief guide to download the ‘Mango’ Microsoft Windoes Phone Developer Tools 7.1 (Beta) released on 24th May 2011.

 

Any comments or request for future topics are welcome.

 

PivotViewer Shorts Part 2: Hide View and SortBy Buttons

Introduction

By default the Silverlight PivotViewer control displays two view selection buttons and a sortby dropdown list of facet names.

Some people have expressed a wish to hide these usually because they want to replace them and control the UX with custom elements.

 

This short post shows how to locate the UI element for the control bar and the child elements in order to alter their visibility.

 

Locating the UI Elements

The flow of the code goes something like this:

• Locate the “PART_Container” in the tree. This is a Grid control.
• Locate the CollectionViewerView control.
• Locate the ControlBarView control.
• Locate the DockPanel containing the buttons.

// Locate UI Elements
Grid partContainer = (Grid)this.GetTemplateChild(“PART_Container”);
CollectionViewerView CVV = (CollectionViewerView)(partContainer).Children[0]);
Grid container = CVV.Content as Grid;
//
// For exposing the top control bar (title,views,sortby,slider)
ControlBarView ControlBar = ((UIElement)container.Children[2]) as ControlBarView;
DockPanel barDockPanel = (((Grid)ControlBar.Content).Children[2]) as DockPanel;
//
// Hide the controls
barDockPanel.Children[0].Visibility = Visibility.Collapsed; // sortby list
barDockPanel.Children[1].Visibility = Visibility.Collapsed; // view buttons

+

FAQ

If you want to try out the code there are a few things to watch out for. You will probably want to hide the controls when the collection event CollectionLoadingCompleted fires.

+

You will need some internal Microsoft Pivot references and usings too. Depending upon the extent of your other customizations you will need these:

+

using System.Windows.Pivot;
using Microsoft.Pivot.Internal.Controls;
using Microsoft.Pivot.Internal.Model;
using Microsoft.Pivot.Internal.ViewModels;
using Microsoft.Pivot.Internal.Views;

+

Further things to do

• Xpert360 PivotViewer Blog Article Index
• The code should be nicely wrapped up and encapsulated in the CustomPivotViewer override class.
• PivotViewer Control – Public API
• Microsoft Silverlight Forums – PivotViewer Control
• Xpert360 Ltd – who allow time for blogging

Conclusion

This article is a brief guide to locating some visual elements of the Silverlight PivotViewer control in order to hide the view buttons and sortby facet list. It targets the developer who has already started customizing the Silverlight PivotViewer control beyond the public API and alter the UX.

 

Any comments or request for future topics are welcome.

 

PivotViewer Shorts Part 1: Hide Filter Pane Search Box

Introduction

By default the Silverlight PivotViewer control automatically adds a search facet and displays a search box at the top of the filter pane. Some people have expressed a wish to modify the UX and remove this to prevent users performing free text search for some collections.

 

This short post shows how to locate the UI element for the search facet and then alter its visibility.

 

Locating the UI Elements

The flow of the code goes something like this:

• Locate the “PART_Container” in the tree. This is a Grid control.
• Locate the CollectionViewerView control.
• Locate the FilterPaneView to access the child controls.

// Locate UI Elements
Grid partContainer = (Grid)this.GetTemplateChild(“PART_Container”);
CollectionViewerView CVV = (CollectionViewerView)(partContainer).Children[0]);
FilterPaneView FPV = (FilterPaneView)CVV.FindName(“PART_FilterPane”);
//
// For exposing the grid containing the search facet UI elements
ContentControl searchFacetGrid = (ContentControl)FPV.FindName(“m_searchFacetGrid”);
//
// Hide search facet
searchFacetGrid.Visibility = Visibility.Collapsed;

+

FAQ

You will need some internal Microsoft Pivot references and using’s too. Depending upon the extent of your other customizations you will need these:

+

using System.Windows.Pivot;
using Microsoft.Pivot.Internal.Controls;
using Microsoft.Pivot.Internal.Model;
using Microsoft.Pivot.Internal.ViewModels;
using Microsoft.Pivot.Internal.Views;

+

Further things to do

• Xpert360 PivotViewer Blog Article Index
• The code should be nicely wrapped up and encapsulated in the CustomPivotViewer override class.
• PivotViewer Control – Public API
• Microsoft Silverlight Forums – PivotViewer Control
• Xpert360 Ltd – who allow time for blogging

Conclusion

This article is a brief guide to locating some visual elements of the Silverlight PivotViewer control in order to hide the automatically generated search facet. It targets the developer who has already started customizing the Silverlight PivotViewer control beyond the public API.

 

Any comments or request for future topics are welcome.

 

Debugging Data Bindings in XAML with Silverlight 4

[Last updated: 2011-05-24]

Introduction

Yes, you read it correctly, Silverlight 4.

 

How can I do that?

Simply install the VS2010 SP1 and Silverlight 5 Beta and you get the unexpected bonus of the XAML Parser supporting debugging your data bindings for your Silverlight 4 projects. As SL5 sits nicely in VS2010 SP1 with SL4 it is worth installing the beta just for this feature.

Debugging XAML Binding in Silverlight 4 - bonus!

I was at the @SLUGUK meeting 18th May 2011, and as Mike Taulty pointed out for other ‘features’, it is difficult to know whether such things as this were introduced by the service pack or the beta as nobody seems to have stopped to check in the rush to get the SL5 beta working

Checked against the NoDo Windows Phone 7 projects and it does not work, you can set a breakpoint but it cannot resolve the symbols. The new feature automatically creates the symbol names for you. I am optimistic that this feature will work with the Mango tooling to be released by end of May 2011 (that’s next week) [UPDATE: Mango beta no Xaml debugging for now].

No point in re-documenting the feature so:

Mike Taulty’s Blog: Silverlight 5 Beta Rough Notes – Debugging Data-Binding

Code Project: Debugging Data Bindings in XAML with SIlverlight 5 Beta

Further things to do and resources 

• PivotViewer Home – Microsoft Silverlight
• Microsoft Silverlight Forums – PivotViewer Control
• Xpert360 Ltd – who allow time for blogging

Conclusion

This article shows a nice side-effect encountered for Silverlight 5 projects after installing the Silverlight 5 Beta. Whether it is intended or here to stay we will have to wait and see but it has already proved to be a fantastic ROI.

 

Any comments or request for future topics are welcome.