07 May 2012

JSinSA 2012

jsinsa

AsHoIrXCEAA2s1YThis past weekend was the ever fantastic JavaScript in South Africa (JSinSA) conference. This year focus was on HTML 5, JavaScript & CSS 3 – easily some of the MOST important topics for developers regardless of platform to know about.

It was it’s second year and while I was very lucky to go to it as an attendee in the first year, this year I was even more lucky to be a presenter at the conference. I was also very lucky to present on a topic I am passionate about: Windows 8.

The talk provided an introduction to Windows 8 & how development works, and in the 45mins I was done, we built an application which could take a photo from a web cam and send it to Twitter (the actual photo is to the right).

You can get the slides and bits from the talk below.

AttachmentSize
File Demo Script18.56 KB
Package icon Completed Demo660.07 KB
11 Apr 2012

Windows 8 for the .NET developer

Last night I presented on Windows 8 for the .NET developer at the fantastic Developer User Group! We had a bumper crowd there which was great and really had some interesting discussions during and after the talk. Thank you to all that attended!

For those looking for the slides, demo script and demo bits they are below!

AttachmentSize
Package icon Completed Demo Files54.29 KB
File Demo script16.71 KB
30 Mar 2012

IntelliTrace vs. PreEmptive Analytics

IntelliTrace

Visual Studio 2010 introduced an amazing feature: IntelliTrace which allows for deep debugging experiences inside Visual Studio by collecting an AMAZING amount of information (basically a stack trace for every call in your code + meta data) and allowing you to use it later to replay the way the application was used. With this feature you could eliminate those “No Repro” bugs! The catch in 2010 was it was NOT allowed to be used in production. In Visual Studio 11 that has changed and we can use it in production: http://msdn.microsoft.com/en-us/library/hh398365(v=vs.110).aspx & http://msdn.microsoft.com/en-us/hh440472

PreEmptive Analytics

This change in licensing may seem to put IntelliTrace in direct competition with another great tool, PreEmptive Analytics (PA). I have mentioned this amazing tool before and with Visual Studio 11 it is included “in the box” so there seems to be a conflict brewing – but there isn’t.

Two sides of the same coin

These two tools are both part of the collect information so you can react to it later and fix bugs set of tools, but they have very different use cases. IntelliTrace is specific to the scenario of replaying an application for diagnosis and debugging purposes. It is not meant to be an always on tool and it is a tool that writes to a local file that needs to be collected some how.

PA on the other hand is a tool to always have on, it does capture error information but nothing more than the simple Exception + Stack which is not as useful, detailed or integrated into VS when compared to IntelliTrace. In addition PA allows me to do a lot of a lot of analytics on my application that are not possible in IntelliTrace:

  • what features are people using
  • where in the world are they
  • when are they using it
  • what are their machines like

In addition the PA reports get automatically sent to a server (that they run or that you can run if you have privacy/security concerns) so there is not need to waddle around collecting files.

I can also see scenarios that these two work hand in hand – PreEmptive getting higher level info that shows a lot of users having issue X, then the support guys contact some users and do a more detailed capture of the issue with IntelliTrace.

27 Mar 2012

Installing Windows Phone Developer Tools on Windows 8

The joys of being on the bleeding edge, is we are sometimes bleeding such as the fact the Windows Phone Developer tools have not worked on Windows 8… until now. However the steps to do get this working are not easy and are spread out a bit on the Internet, so this post aims to give you a one stop, quick reference way on how to get it done in five steps.

Step 1 – Get the bits

You will need THREE downloads for this:

  1. The Games for Windows Marketplace Client: http://www.xbox.com/en-US/LIVE/PC/DownloadClient
  2. The Windows Phone SDK 7.1: http://www.microsoft.com/download/en/details.aspx?displaylang=en&id=27570

    personally I would get the ISO for it from: http://go.microsoft.com/fwlink/?LinkID=226694

  3. The Windows Phone SDK 7.1.1 Update: http://www.microsoft.com/download/en/details.aspx?id=29233

This should set you back 1.1Gb in bandwidth.

Step 2 – Install the Games for Windows Marketplace Client

image

Troubleshooting notes:

Step 3 – Install .NET Framework 3.5

Now pop in your Windows 8 DVD (or mount the ISO), next open a command prompt AS ADMINISTRATOR and navigate to the \sources\sxs folder on the DVD and run the following command. My DVD was mounted on drive F so note you may need to change the underlined part of the command to match your situation: dism.exe /online /enable-feature /featurename:NetFX3 /All /Source:f:\sources\sxs /LimitAccess

image

Step 4 – Install Windows Phone SDK 7.1

Now run the installer for the Windows Phone SDK 7.1 as per normal.

imageimage

Troubleshooting notes:

  • If you get any errors about installing some components, try to copy them from the disk to the desktop – if you get a invalid MS-DOS function error, then you have a corrupt ISO and need to download it all again.

Step 5 – Install Windows Phone SDK update

Almost there, just the Phone SDK update to install!

image

Done!

And there we are, the tiles are on the start screen, Visual Studio 2010 launches (and hurts my eyes with all those colours :P ), the new emulator options are all there in the drop downs and the EMULATOR WORKS!!!!

imageimageimage

Troubleshooting notes:

  • If you have a CPU that supports SLAT (for example a Core i7) you can run Hyper-V on Windows 8, which hurts emulator performance. Turn if off it you can.
01 Mar 2012

Upgrading Visual Studio "11" Developer Preview Metro Projects to Visual Studio "11" Beta Metro Projects

76451If you created Metro style (WinRT) projects in Visual Studio “11” developer preview (alpha) and you try to open them up in the beta you will have a few load issues. These are ones I have found in my apps so it is not exhaustive, but seems like the most common.

Projects will not load

The projects themselves will not load with the following error: The imported project "C:\Program Files (x86)\MSBuild\Microsoft\WindowsXaml\v1.0\Microsoft.Windows.UI.Xaml.CSharp.targets" was not found. Confirm that the path in the <Import> declaration is correct, and that the file exists on disk. 

The solution to this is to open the project file and navigate to the <Import> node and change the path from v1.0 to v11.0 (see the highlighted extra 1 in the image below that is needed):

image

Compiler Directive

If you used the compiler directive WINRT that has been changed to NETFX_CORE so you will need to update your code.

Package fails to build

The package fails to build/deploy and complains about an InitialRotationPreference attribute. To solve this open the Package.appxmanifest file and find the <VisualElements> node and you should find an line similar to this:

<VisualElements DisplayName="AtomicMVVM Metro Style App Demo" Logo="Images\Logo.png" SmallLogo="Images\SmallLogo.png" Description="AtomicMVVM Metro Style App Demo" ForegroundText="light" BackgroundColor="#000000" InitialRotationPreference="portrait">

What you need to do is remove the InitialRotationPreference attribute from the end, so it ends like this:

<VisualElements DisplayName="AtomicMVVM Metro Style App Demo" Logo="Images\Logo.png" SmallLogo="Images\SmallLogo.png" Description="AtomicMVVM Metro Style App Demo" ForegroundText="light" BackgroundColor="#000000">

Big load failure image from: http://www.hostedfile.com/pictures/76451/big-load-failure.html

29 Feb 2012

Important changes to Express Editions of Visual Studio "11"

manualtrafficexchangetipNote: The source of this is the Visual Studio “11” beta Product Guide (http://go.microsoft.com/fwlink/?linkid=243994) so this may change by release.

Today we have five Express products: C++, C#, Visual Basic, Web and Phone however with the launch of Visual Studio “11” we will only have TWO!

These two editions of Express we will have are Web & Windows. I do not believe we will only ever have two editions, as the 2010 Express editions grew during the product so I would expect a few new ones coming along post launch.

So how does the old Express editions map to the new Express editions?

  • C++ maps to NOTHING
  • C# for WinForm/WPF/Silverlight maps to NOTHING
  • VB for WinForm/WPF/Silverlight maps to NOTHING
  • Phone maps to NOTHING
  • Web maps to Web

Let me reiterate this, if you want to build non-Metro applications (unless they are web) there is NO Express edition anymore for this! The Windows Express edition ONLY allows the building of Metro apps (including ARM). Web dev using Express editions still continue to work as before.

Both Express editions have a new enhancements too, which is a fantastic thing: The ability Version Control & Work Item Tracking with TFS is included out of the box.

For the Windows express edition it has even more enhancements

  • A subset of static analysis (fxCop) for helping developers pass Win Store evaluation
  • Performance Profiling has been added: CPU Sampling for C#/VB/C++ Metro apps and Instrumentation for HTML/JS Metro Apps

Stop/Important image from http://sitechoppers.com/why-it-is-important-to-build-your-downline/

24 Feb 2012

Charting with Lightswitch

One of the key business aspects not included with Lightswitch 2011 is a great set of charting controls and often I need to have a few for the projects I am working on. Thankfully with the Silverlight Toolkit and a touch of code I can have BRILLIANT charts for no extra costs!

Below are three charts using the Silverlight Toolkit in Lightswitch, which I think look FANTASTIC and it is fairly easy to do in four easy to follow stages.

imageimage image

For this tutorial I have a simple structure of engine parts, costs over time and purchases which looks a little like the image below and for I have already created the data structure and UI for adding those in Lightswitch.

image

Stage 1: Get the toolkit

To start off we need to switch out of the Logical View and into the Files View, to do this in Solution Explorer click the “Lie to me button” (that is what I call it) and change the view.

image

Next right click on the client project and select Manage Nuget Packages. If you do not have Nuget yet, stop, download Nuget from www.Nuget.org and install it and come back.

image

In Nuget search for the silverlight toolkit and install the Data Visualization package. Now unfortunately Lightswitch isn’t too good with Nuget, so really we are using this as a way to get the packages but they are not properly installed as you may expect.

image

Stage 2: Create the screen and add the control

Now switch back to the Logical view and add a new Editable Grid Screen, give it a nice name but do not select any Screen Data.

image

In your new screen, click the add button at the bottom and select New Custom Control. If you do not have that, you have selected the add option for the Screen Command Bar, so make sure the Rows Layout at the top is selected.

image

Now we need to add the assemblies for the Silverlight Toolkit packages, to do this press the Add Reference button in the Add custom control screen.

image

Browse to the packages folder in the root of the Lightswitch project and add the two assemblies. Once done browse the System.Windows.Controls.DataVisualization.Toolkit assembly and go to System.Windows.Controls.DataVisualization.Charting.Chart class and select OK.

image

Stage 3: Configure the chart control in Lightswitch

The control should now be listed. Next go to the properties and give the chart a name, this is important so name it something you will remember.

image

Now we change the sizing of the chart control to be Stretch for both Horizontal and Vertical Alignment. This allows the chart to use all the space on the screen!

image

Stage 4: Add some code to get the data and put it in the chart

Now we need to add the code to get the data and render the chart. We do this in the Created event for the screen (to get there, click the Write Code button in the toolbar and select the event).

image

Now we add some code to the event, which does:

  1. Find the chart control.
  2. Get the data from the DataWorkspace into a list.
  3. Set chart to use the data.
partial void CostOverTimeChart_Created()
{
    // Write your code here.
    var chart = this.FindControl("chart");
    chart.ControlAvailable += (s, e) =>
    {
        this.Details.Dispatcher.BeginInvoke(() =>
        {
            var dataPoints = (from Costs c in this.DataWorkspace.ApplicationData.CostsSet
                              group c by c.EnginePart).ToList();

            var chartControl = e.Control as Chart;
            chartControl.Dispatcher.BeginInvoke(() =>
            {
                chartControl.Series.Clear();
                foreach (var group in dataPoints)
                {
                    chartControl.Series.Add(new LineSeries()
                    {

                        Title = group.Key,
                        IndependentValuePath = "PointInTime",
                        DependentValuePath = "Cost",
                        ItemsSource = group
                    });
                }
            });
        });
    };
}

If we dive into the code:

  • Line 4: We use the FindControl method with the magic string we named the chart to find the control that wraps the chart.
  • Line 5: We attach to the event for when the chart is available.
  • Line 7: We use the dispatcher for the screen to run a call to the DataWorkspace to get the data and put it into a list. We need to dispatch this as the DataWorkspace is in a separate thread.
  • Line 12: We get the actual chart control now from the event arguments.
  • Line 13: To set the values on the control we use the charts dispatcher as it is separately threaded.
  • Line 15: We clear any existing  series and then add new series. This code is nothing special to Lightswitch, this is just normal Silverlight charting.
  • Wrap up

    It seems like a lot to do this, and it is. You could make this easier by wrapping this in a custom Lightswitch control which would give you GREAT reuse, but that is a lot of work too. In the long run if you use lots of charts you will save time by building the custom control – but if you need just one or two this is a little quicker and less learning.

    Below you will find a link to the sample product I used to create all the charts and it has all the code in it too, if you are looking for it. Make sure you have Nuget installed before you use it!

    AttachmentSize
    Package icon DemoLS.zip1.97 MB
    24 Feb 2012

    VS/TFS 11 Announcement Crib Notes

    1680.SolutionExplorer-2The last few hours have been a buzz of excitement for .NET developers as the covers have been lifted for the next releases of TFS, VS & .NET 4.5 – however there is a problem. There is SO much info wrapped in nice marketing & business talk you will spend hours trying to get through it all, so here are the crib notes. Following each note is a number in braces, this is the number of the source so you can go to it for more info if you wish:

    • .NET 4.5, VS 11 & TFS 11 beta’s will be available on the 29th Feb. [1]
    • You can use the products in production from beta (technically called a go-live licence) [2]
    • Visual Studio 11 has had a UI polish, similar layout but less toolbars by default, less colours (icons are monotone) & a touch of Metro like thinking (white space & typography) [2]
    • Five editions (or SKUs) of Visual Studio will ship: Express, Test Pro, Pro, Premium & Ultimate. Same as we have in 2010. [3]
    • TFS will have at least two editions, Express (think TFS basic but FREE) and another edition. We may have more than that. [8]
    • Visual Studio Professional and up will include Lightswitch! [3]
    • The architecture tool diagrams can now be read in professional & premium versions too (in 2010 it was premium only). Creation still requires ultimate. [4]
    • IntelliTrace is supported in production (still an ultimate only feature). [4]
    • Windows Phone 7 tools included with professional and higher editions of Visual Studio 11. [4]
    • Express will have two versions: Windows (WPF, WinRT, etc..) & Web (ASP.NET, MVC etc…). [5]
    • There are two themes for Visual Studio: Light (pictured above) & Dark which feels like a Expression Blend style. [6]
    • Quick launch is a new search feature allows you to search for any command or option in Visual Studio. [6]
    • Search has been added to most used tool windows, like solution explorer. [6]
    • ASP.NET MVC 4 has a bunch of evolutionary improvements, nothing to wet your pants on IMHO. [7]
    • ASP.NET Web API is a big new feature for both MVC & WebForms for building API’s for the web. Think services like WCF but built for the modern web. [9]
    • Visual Studio 11 is a code name – expect a name change by release. [10]
    • Workflow hubs in Visual Studio 11 allows you to focus on a task in a single place, rather than have to move around multiple windows. [11]
    • Preview tabs allow you to sneak a peek at documents without needing to actually open them. [10]
    • C# 5 (yes, it is version 5 of C# that is shipping with .NET 4.5 – who says this is confusing) has support for async. [10]
    • New code compare tool & UI that doesn’t suck. [11]
    • New code review tool support in TFS & Visual Studio. [12]
    • New mock up design tool that ships with Visual Studio/TFS that allows you to build mock user interfaces in Powerpoint. Think Sketchflow without the code or Balsamiq. [13]
    • New Visual Studio METRO’d logo [14]: VS11-Beta_h_c

    Want to see some pictures of all of this? http://www.microsoft.com/presspass/presskits/developer/imagegallery.aspx

     

    Sources

    1. http://blogs.msdn.com/b/somasegar/archive/2012/02/23/the-road-to-visual-studio-11-beta-and-net-4-5-beta.aspx
    2. http://blogs.msdn.com/b/jasonz/archive/2012/02/23/sneak-preview-of-visual-studio-11-and-net-framework-4-5-beta.aspx
    3. http://www.microsoft.com/visualstudio/en-us/products/beta-products
    4. http://www.microsoft.com/visualstudio/en-us/products/features-chart
    5. http://www.microsoft.com/visualstudio/en-us/products/beta-express
    6. http://blogs.msdn.com/b/visualstudio/
    7. http://weblogs.asp.net/scottgu/archive/2012/02/19/asp-net-mvc-4-beta.aspx
    8. http://blogs.msdn.com/b/bharry/archive/2012/02/23/coming-soon-tfs-express.aspx
    9. http://weblogs.asp.net/scottgu/archive/2012/02/23/asp-net-web-api-part-1.aspx
    10. http://www.microsoft.com/presspass/features/2012/feb12/02-23VisualStudioBetaPreview.mspx
    11. http://www.microsoft.com/presspass/ImageGallery/ImageDetails.mspx?id=2c8135ad-fefd-48c2-888f-83b6987a4e87
    12. http://www.microsoft.com/presspass/ImageGallery/ImageDetails.mspx?id=2a0b1cf8-9d74-4603-a2d1-03d8ef989a8c
    13. http://www.microsoft.com/presspass/ImageGallery/ImageDetails.mspx?id=240cbb53-9dd5-4262-b0cc-cdb9a57485d3
    14. http://www.microsoft.com/presspass/imagegallery/images/products/developer/vs/logo_vs11beta_print.jpg

    Pages