Archive

Archive for the ‘Silverlight’ Category

Simple, Blendable, DI driven ViewModels

November 19, 2010 3 comments

I hope you won’t think less of me, but I need to admit something: Dependency Injection still confuses the heck out of me.  The first time I met my good friend Kevin Hazzard he was talking about Castle Windsor with someone at an after party for a Microsoft event in Washington, D.C.  I was new to the community scene and had never met Kevin or most of the people in the room.  Wanting to fit in with the crowd I made the mistake of asking “what’s Castle Windsor?” which soon led to me asking “What’s Dependency Injection?” which even sooner led to my eyes glazing over and my brain retreating to its happy place.  I spent the next hour bobbing my head up and down, pretending to keep up with the conversation, but truthfully I was completely lost.

In the years since I’ve tried to learn DI: I’ve read articles, downloaded samples, gone to presentations, and had conversations until I was blue in the face.  I’ve made progress but I am still not totally comfortable with the whole idea.  Don’t get me wrong: I believe there is value there, and I have used it successfully in a couple of projects, but there is no guarantee I’ve done it properly.  It still feels like Black Magic but I figure if I keep plugging away it will eventually sink in.

On a side note, isn’t “Dependency Injection” a terrible name?  Almost as bad as “Inversion of Control”.  Neither one of these really describes what’s happening.  It sounds like what we are doing is injecting dependencies, meaning actually inserting dependencies, which would create more dependencies!  Really, we are resolving dependencies, or injecting dependent objects, but I guess Dependent Object Resolution is a little long winded.

The ViewModelLocator Pattern

I watched the video of John Papa’s PDC10 presentation Kung Fu Silverlight: Architectural Patterns and Practices with MVVM and RIA Services with great interest.  I’m working primarily in Silverlight now, using RIA Services and of course MVVM.  I downloaded the source code and have been working through it primarily focused on the ViewModelLocator pattern.

I’ve been aware of the pattern for a while but never understood how it worked before, so I wanted to give it a try.  The approach certainly works but it felt heavy and confusing, I’m sure that would pass as I grow more familiar with the pattern. Then again, it could just be me, but it seems there are lots of moving parts and misdirection.  Let me see if I can map it out for you as I understand it:

ServiceProviderBase: this is an abstract class that holds a static instance of the active ServiceProvider.

– A ServiceProvider is a class that inherits from ServiceProviderBase that has a reference to a Data Service instance (the class that manages all the data interactions via RIA services).  For this exercise there are two Service Providers, one for Design time and one for Run time.  It’s a little confusing, but the run time class is simply named ServiceProvider.  The design time class is called DesignServiceProvider.

Let me stop here for a second: ServiceProviderBase is inherited by the two Service Provider classes, and it’s primary function is to decide which class to instantiate and return from a static method, which upcasts the results to itself:

public abstract class ServiceProviderBase
{
    public virtual IPageConductor PageConductor { get; protected set; }
    public virtual IBookDataService BookDataService { get; protected set; }

    private static ServiceProviderBase _instance;
    public static ServiceProviderBase Instance
    {
        get { return _instance ?? CreateInstance(); }
    }

    static ServiceProviderBase CreateInstance()
    {
        // TODO:  Uncomment
        return _instance = DesignerProperties.IsInDesignTool ?
            (ServiceProviderBase)new DesignServiceProvider() : new ServiceProvider();

        // TODO:  Comment
        // return _instance = new ServiceProvider();
    }
}

This strikes me as convoluted, but let’s move on.

– The ViewModelLocator, the namesake of the pattern, is a class that holds a set of ViewModel properties.  These ViewModels require (or have a dependency on) the Data Services that are stored in the ServiceProvider instance returned from ServiceProviderBase.  When a ViewModel is requested from the ViewModelLocator, it uses ServiceProviderBase to retrieve the current Data Service and uses it in the constructor to create the ViewModel.  This is a form of Dependency Injection called Constructor Injection and is the most popular by far since many people use it without realizing they are using DI!

Here is the code from the sample:

public class ViewModelLocator
{
    private readonly ServiceProviderBase _sp;

    public ViewModelLocator()
    {
        _sp = ServiceProviderBase.Instance;

        // 1 VM for all places that use it. Just an option
        Book = new BookViewModel(_sp.PageConductor, _sp.BookDataService);
    }

    public BookViewModel Book { get; set; }
    //get { return new BookViewModel(_sp.PageConductor, _sp.BookDataService); }

    // 1 new instance per View
    public CheckoutViewModel Checkout
    {
        get { return new CheckoutViewModel(_sp.PageConductor, _sp.BookDataService); }
    }
}

This is more understandable, like a central repository of ViewModels for the entire application.  This approach assumes that they all use the same Data Service, but I’m totally cool with that because it is extremely likely.  What’s nice here is that the ViewModel is always the same regardless of which Service Provider is currently active.  The bad news is that it breaks some aspects of Blendability because there is no empty constructor, but more on that later.

– Now we need to access the ViewModelLocator, so create a ResourceDictionary that contains an instance declaration of the locator and add a reference to the dictionary in the App.xaml MergedDictionaries section.

<local:ViewModelLocator x:Key="Locator" />
...
<ResourceDictionary Source="Assets/ObjectResourceDictionary.xaml"/>

– Finally, bind the UserControl’s DatContext to the correct ViewModel property in the ViewModelLocator.

DataContext="{Binding Book, Source={StaticResource Locator}}"

If you are confused after reading the above, don’t worry because you are not alone.  I struggled for some time to sort this out and I’m not entirely convinced I ever totally got it right.

 

What I came up with

I know it’s easy to play desk chair quarterback, so before I begin let me say that it took people a heck of a lot smarter than me to come up with this and it works, so if you are already successfully doing this I’m not telling you to switch. 

Trying to grok what was going on, I just kept staring at it and thinking there should be a cleaner way, so I played with it until I came up with what I’ll share in the next section.  It’s quite possible that my approach has serious problems, so please feel free to leave comments below.

I basically set out to do two things: first, I prefer to see the DataSource listed in the Data tab in Blend.  Using the above approach you have to add the reference to the ViewModelLocator StaticResource defined in the ObjectResourceDictionary manually. The idea is that the ViewModelLocator acts as a Singleton, because there is only one instance created for the entire application.  Unless you NEED to enforce a Singleton, then this is not necessary in my mind. 

Because it is a Static Resource, the bound DataContext object will not show up as a Data Source in the Data tab. It will, however, show the appropriate properties in the DataContext panel on the bottom of the Data tab, which may be sufficient for you.

If you want to use the Data tab in Blend, however, you can remove the UserControl DataContext reference and create a local instance of the ViewModelLocator object using the standard Create Object Data Source tool in Blend.  Then you can drag the appropriate ViewModel property and drop it on the LayoutRoot to bind it to the DataContext.

The result of the second approach is that I can see ALL the ViewModel objects, which I may or may not want.  It also requires an extra level of nesting to get to the desired ViewModel object.  To get back to the more traditional Blend approach, we need to be able to bind directly to a local instance of the ViewModel itself.  Of course, doing so breaks the ViewModelLocator pattern, but I’m no purist. 🙂

 

The Non-locator Locator Pattern

My solution does away with the ServiceProviderBase and ViewModelLocator classes.  My reasoning is pretty straight forward: all I really need to be able to do is change what Data Service class my ViewModel uses based on certain scenarios.  I want a dummy service for design time but the real deal to execute at run time.  And I may want to create a special service for testing scenarios.  Getting back to how I started this post, this sounds like a job for Dependency Injection!

Since I’m writing a Silverlight application I need to make sure the IoC container I choose supports it.  I’ve been using StructureMap but it doesn’t support Silverlight yet (rumor has it V3 will add Silverlight support). Unity 2.0 for Silverlight does however, so I’m using this project as an excuse to try it out.  It shouldn’t matter what framework you use.

I added the following code to the Application_Startup method in App.xaml.cs:

var iocContainer = new UnityContainer();
if (DesignerProperties.IsInDesignTool)
{
    iocContainer.RegisterType<IClientService, ClientServiceMockData>();
}
else
{
    iocContainer.RegisterType<IClientService, ClientService>();
}
Resources.Add("IocContainer", iocContainer);

This creates a UnityContainer and registers the appropriate Data Service.  I then add the container as an Application level resource, so I can retrieve it from anywhere in the application.  This uses the same DesignerProperties. IsInDesignTool approach that the previous ViewModelLocator used.  Now we head to the ViewModel itself.

The ViewModel

In the ViewModel I add a property for IClientService with a backing field.  In the get block, if the backing field is null, I access the IocContainer application resource and use that to extract the IClientService

private IClientService _clientService;
protected IClientService ClientService
{
    get
    {
        if (_clientService == null)
        {
            var ioc = Application.Current.Resources["IocContainer"] as UnityContainer;
            _clientService = ioc == null
                ? new ClientServiceMockData()
                : ioc.Resolve<IClientService>();
        }
        return _clientService;
    }
    set { _clientService = value; }
}

NOTE: I do want to share a problem I had here: ideally, ioc.Resolve<IClientService>() should work for both Design and Run time.  This solution works as desired at run time, but at design time the IocContainer resource is null.  To solve this and get run time data I hardcoded the creation of ClientServiceMockData class if the resource is null.  This of course adds a dependency on the ClientServiceMockData class, so if you have any suggestions on how to solve this problem I would appreciate hearing them.

This approach is probably wrong somehow, but I’m accessing the IoC container from inside the object that has the dependency.  I suppose this adds a dependency on the container class itself.  I did it this way to complete the Blendability.  In order for Blend to recognize the ViewModel as an Object Data Source at run time it has to have an empty constructor, so the ViewModel now has two constructors:

public ClientViewModel()
{
    LoadData();
}

public ClientViewModel(IClientService clientService)
{
    ClientService = clientService;
    LoadData();
}

You can see that the second constructor still allows Constructor Injection, so if you wanted to use special data for testing all you would have to do is pass in a specific Data Service to the constructor.

At this point we now have a completely Blendable ViewModel that supports design time data in far fewer objects and steps, and as an added bonus it can increase your geek factor because it uses Dependency Injection!

 

Conclusion

It seems to me that this is a much simpler way to achieve the same result, but I’m sure the Patterns and Practices folks will be able to spot the holes in it.  I’d really like to learn this stuff better so please feel free to leave your comments below.  What is wrong about this idea?  What is good?  Is there an even simpler way to achieve it?  Let’s hash it out: enquiring minds want to know. 

Silverlight Book Sample Chapter

April 28, 2010 2 comments

I recently posted about “Silverlight 4 Business Application Development: A Beginner’s Guide” by Frank LaVigne and Cameron Albert.

I’m happy to announce that PACKT has made a sample chapter available for free download.  So be sure to check it out: I’m sure you’ll find this a fun and valuable resource in your Silverlight adventures!

Categories: Silverlight

New Silverlight Book

April 7, 2010 3 comments

I was honored last year to be asked to be the Technical Editor/Reviewer for Frank LaVigne’s new Silverlight book “Microsoft Silverlight 4: Business Application Development.”  Cameron Albert also contributed a couple of chapters and is listed as a co-author, but my image below does not show his name.

I’m happy to announce that PACKT Publishing has just released the book!

9768_MockupCover

Buy this Book!

I’m not going to give an official review, since I’m a little biased – but I will say that this book takes a different approach to Silverlight.  This is not another reference book.  Instead, the book guides you through the hands-on development of several applications and shows you how to incorporate typical features as well as some really cool not-so-typical ones.

Of course the book covers entry level material, like introducing XAML and the tools you will want to use.  The book has a fair mix of Visual Studio and Blend.  Within just a few chapters though, you are adding media, interfacing with Bing Maps, using Isolated Storage, etc.  Some of the highlights for me are Data Validation, RIA Services, Charting, and more.

I would definitely recommend this book for anyone getting started with Silverlight.  You can find and purchase it on the PACKT website.

Inside the Ropes

This was my first opportunity to be inside the ropes on a book under development and I learned an awful lot along the way.  I mostly learned that writing a book is a serious endeavor and takes a lot of work by a lot of people.  Knowing what I know now, it is kind of amazing to me that any technical books get published in a timely manner.  My hat is off to the published authors in our midst because you have really accomplished something.

I would like to thank Frank for asking me to help with the book, it means a lot to me.  I would also like to thank the great folks at PACKT for nursing me through my first such project and dealing with my performance anxiety.  In the end my part was small: I can only imagine what coordinating the whole process must be like.

My Own Book

Many people have asked me when I plan to write an Expression Blend book.  I know I don’t blog about it much, but I spend a lot of time presenting on Expression Blend and I’m always eager for the chance to introduce it to WPF and Silverlight developers.  It really has been my technical passion the last couple of years – my Twitter tag lists me as a “self-described Blend Evangelist.”  I also have another site devoted to Blend under development, but as always Time is the Enemy.

I have seriously considered writing a book.  Knowing my time issues of the last couple of years, I’ve also had plenty of published friends warning me about the time commitment.  Until now, I wasn’t sure what I was getting myself into, so I haven’t seriously pursued it.  Having worked on this project, however, I truly have an appreciation for the effort involved: it really is a work of heart.

Fortunately, I have some scheduling changes happening soon that will free up some time for me to begin looking at this in earnest.  With that in mind, along with my experiences on Frank’s project, I feel prepared now to begin my own book.  If not prepared, than at least better informed.  If you have any advice or recommendations for a first time author, I’d love to hear from you.  And of course, I will keep you all informed.

Conclusion

In the meantime, congratulation to Frank and Cameron on a unique Silverlight book.

Categories: Book Reviews, Silverlight

Another Silverlight Centering Trick

December 15, 2009 5 comments

Not too long ago, I posted about how to center a Silverlight Application within an HTML page.  Last weekend, I was working on a Silverlight application and I wanted to stretch the background brush across the entire browser, but retain the content in a fixed space in the middle of the screen.  I could have done this by creating a gradient and then applying it as the background in my HTML/CSS, but I wanted the ease of design and flexibility that I have within Silverlight.  Here is what I did to accomplish the trick.

Sizing the UserControl

To begin with, we have to set the width and height properties of the UserControl so that the UserControl will stretch to fill all available space within the browser.  We’ll start by setting Width and Height of our UserControl to Auto and the LayoutRoot container to a fixed size with a Background color so we can see it along with our Background work.  This way we can tell what effect we are actually having. 

[Note: click on the images for full size]

Content1

So far, it seems like we are centering, so all we should need to do is add a Background to the UserControl, right?  Unfortunately, that will not do what we want.  Adding a Background to the UserControl gives us the exact same results.  Since the screen shot is the same, I won’t repeat it, but if you are following along at home try it and you should get the same result. 

Also, not to be picky, but this is not actually centering: this is setting the HorizontalAlignment and VerticalAlignment properties to their default values of Stretch.  The Grid is actually stretching to fill up the available space, but it is still limited to its fixed size, so it gives the appearance of centering.  Not to worry, it’s a minor technicality.

Setting the Background

Our goal is for the Background, in this case a GradientBrush, to stretch across the entire surface of the browser window.  Above we saw that fixing the LayoutRoot to the size of our desired content won’t allow this to happen.  Instead, we’ll need to set the LayoutRoot Width and Height properties to Auto, and set the Background of the LayoutRoot element to the desired Gradient. 

Running the application at this point will show our Background filling the entire browser space.

StretchedGradient 

And here is the XAML:

StretchedGradientXAML

Centering the Content

Now that we have our Background properly visible across the entire surface of the browser, we need to center the Content inside our LayoutRoot Grid.  This is easily done by adding another Container to the LayoutRoot to act as a wrapper for our fixed size content.  This example shows a Grid, but I initially did it with a Canvas. I’ve added a Black Background color so you can see the content Grid.

ContentOverStretchedGradient

Now set the HorizontalAlignment to Center.  I think the default VerticalAlignment value of Top looks best, but of course you could center it or add some Margin around the content Grid to suit your preference. 

CenteredContentOverStretchedGradient

Now just add your content to the internal Grid, and you will have an automatically sized Silverlight page with centered, fixed size content.

Adding a Clipping Region

One last thing you should be aware of: if you are doing any animations with content off screen, using this method will make them visible outside the bounds of your content.  While this has some interesting potential, it is probably not the behavior you want. 

To correct this, you need to add a Clipping Region to your content Grid.  This will ensure that child elements of that Grid are only visible inside its visual boundaries. Since you can’t do this visually, you’ll need to edit the XAML directly.  The key here is to set the Clipping geometry, in this case a Rectangle, to be the same width and height as the content Grid.

ClippingRegionXAML

Conclusion

It’s important to note that since we are letting Silverlight do all the work, you do NOT want to use the HTML and CSS from the previous Centering post.  Doing so will result in only the width defined in the CSS being displayed.  Instead, just use the default HTML and CSS settings.

I like this approach better since it gives my application an integrated background.  It gives me more creative options and more control.  Let me know how it works for you!

Categories: .NET, Silverlight

Wrox Silverlight 3 Programmer’s Reference Book Review

November 19, 2009 2 comments

In July, I was offered the opportunity to review Wrox Publishing’s newly released “Professional Silverlight 3”, a massive full-color book covering nearly ever aspect of Silverlight 3.  I’ve long been a Wrox fan and as a WPF developer with a web background I have a keen interest in all things Silverlight, so naturally I jumped at the chance to review this new book.  Unfortunately, life did what it always does and prevented me from completing the review until now. 

NOTE: I finalized this article while attending PDC09, where Scott Guthrie announced Silverlight 4.  This release interval for Silverlight has been unprecedented: only three months after the official Silverlight 3 launch!  I am confident though that you will still find this book timely and valuable.

As expected, Wrox does not disappoint.  Authors J. Ambrose Little, Jason Beres, Grant Hinkson, Devin Rader, and Joseph Croney, all from Infragistics, have provided a wonderful edition that should capture the attention of both fledgling and experienced Silverlight developers.  In fact, the introduction and first four chapters should be mandatory reading: they provide the perfect overview to this game changing technology all .Net professionals should understand whether or not their particular interests run towards Silverlight.

If you have never read a full color technical book, you’ll quickly find this is wonderful addition.  The numerous graphics and screen shots jump off the page, making the material easily consumable.  In addition, all code and XAML samples are in full color as well, mimicking the default IntelliSense color scheme.  This is perhaps the best part of having a .NET volume printed in full color because it allows us to read code on the page in the same manner in which we are used to reading it on screen.  I’ve always found it a bit unpalatable to read code on the printed page, but this feature makes the code imminently more readable.

The book itself is very well written and easy to follow.  The style of the authors reveals their mastery of the material without being overbearing.  This is an extremely accessible book to those new to Silverlight but contains plenty of material for the more experienced developer.  While the text is clear and concise, in no way is this a light read.  Silverlight is a very large topic and any book that attempts to do it justice needs to be sized to the task.  That being said, I would not attempt this book, or many like it, cover to cover.  While none of the chapters is superfluous, if you are new to Silverlight or WPF, beyond the requisite 4 chapters mentioned above, I would begin with chapters 7, 8, 12 and 14.  I would tackle the rest of the chapters on an as needed basis.

Another item I really appreciated in this book was the frequent inclusion of Microsoft Expression Blend. Blend is an invaluable tool for developing WPF and Silverlight applications and yet I find it frequently passed over in technical publications.  Going forward, the more complex XAML based applications become, the more imperative it is going to be for developers to learn Blend, so it is nice to see a Silverlight book give Blend the attention it deserves.

On a scale of 1-5, I give this book 4.5 stars.  This book is exactly what it needs to be, a great reference aimed at professional developers.  I know that as I get more serious about my Silverlight development efforts, I will be reaching for this book frequently.

Categories: .NET, Book Reviews, Silverlight

How to Center a Silverlight App in HTML

August 22, 2009 5 comments

I’ve written a lot of CSS over the years, so when I wanted to center my Silverlight App in my web page I figured it would be a piece of cake.  It is easy, but it gave me some frustration because it required one element that I normally would not specify.  Read on for the details.

Setting up the CSS

Here is the default CSS created by Visual Studio:

<style type="text/css">
html, body {
    height: 100%;
    overflow: auto;
}
body {
    padding: 0;
    margin: 0;
}
#silverlightcontrolhost {
    height: 100%;
}

To accomplish this little trick I need to define a wrapper DIV in my CSS.  This Div will then wrap the entire contents of the site, so now I only have to center that DIV.  We need to define the width of the content area: it makes sense that you want to set the size of something you want to center so it can be calculated.  To do this, I set the width property of the wrapper DIV to the pixel width of my Silverlight control.

Since not all browsers interpret things the same way, we need to add a couple of items in order to center our content.  First, add text-align: center; to the body tag.  This should handle the centering for IE browsers, at least older ones.  For Firefox and Safari, we need to add margin: 0 auto; to our wrapper DIV.

This is my typical set up in traditional HTML scenarios, but when I tried using this CSS the Silverlight object would not show.  I had some video in this particular example, and it was a good thing I did or I would have gone crazy trying to figure this out: I could hear the video playing, so I knew the Silverlight object was running, I just couldn’t see it.

It turns out that you need to specify the height property as well in the wrapper DIV.  It doesn’t have to be exact, just larger than your Silverlight control.  If you make it larger than 0 but smaller than your control, it will actually truncate the control, which could be an interesting effect in certain scenarios.  I don’t know the reason for this, perhaps it’s because the Silverlight control runs in an object tag, but I’m not sure.  Please post in the comments below if you know why this was required.

Here is the final CSS I used:

<style type="text/css">
html, body {
    height: 100%;
    overflow: auto;
}
body {
    padding: 0;
    margin: 0;
    text-align: center;
}
#wrapper
{
    margin: 0 auto;
    width: 800px;
    height: 800px;
}
#silverlightcontrolhost {
    height: 100%;
}
Categories: Silverlight

WCF, Silverlight 2, and IIS 6.0

November 24, 2008 2 comments

I’m ready to begin my first production Silverlight 2 project, so I needed to learn how to make a data driven Silverlight application. I pretty much already knew that the answer would involve WCF, but as I do not have much experience with such things I was not sure what to expect. I had written several Web Services in PHP using NuSOAP, but I knew basically nothing about WCF or IIS hosting of web services. So, towards the goal of understanding what all the pieces are and how they fit together, I began my research.

Getting Started with WCF

As an old procedural midrange programmer, I always like to start with the data, so the WCF end was where I chose to begin. I tried watching Michele Bustamante’s 15 part video series on WCF, but half way through the second video my eyes glazed over and the drool was beginning to stain my shirt. While I understand she is a giant in the field, this series was not for the rank amateur.

I surfed around Google for a while and came up with several decent examples and a couple of videos. At some point, once I understood the basics, I stumbled across an example of the new Silverlight-enabled WCF Service item type which greatly simplified things. I hooked up a Linq to SQL project to my WCF service and was able to return Linq classes (or subsets as necessary).

I was able to hook up a simple WCF test inside a Silverlight 2 application and consume my new Services. All was well, but I had done everything inside the Silverlight project. It made more sense to me to break the WCF out into its own Solution. To accomplish this, I followed these steps:

  1. Create a WCF Service Application
  2. Delete the default Service1 files
  3. Add a new “Silverlight-enabled WCF Service” item
  4. Create the services as needed

Deploying the Service to IIS 6.0

I’m unfortunately still stuck with IIS 6.0. I don’t know if the experience is any different on IIS 7.0, but I went through some trials getting this to work properly. To be fair, I’m sure that most of the trials were caused by my own ignorance.

At first, I was trying to deploy the Services as part of an existing ASP.NET application. This got hairy pretty quickly, since I wasn’t sure how to properly merge the two projects together on the server. I tried deploying the Services to a subdirectory, but I could never get it to work. At that point I decided that it would probably be best if I put the services on their own subdomain, so I created a new subdomain for the Services.

I was able to deploy the Service site to the new subdomain and the WSDL page displayed properly. (Actually, it didn’t right away: I had apparently screwed something up trying to merge it with the other ASP.NET application, so I recreated the Service application from scratch which only took a few minutes. It was that page that displayed properly.)

So at this point I thought I should have been able to simply switch out my Service Reference in my Silverlight application, but it didn’t work. I messed around with it but couldn’t get it to respond. When I ran the application in debug, I received a message indicating that the WCF Service was not configured for cross domain access. Since the Service was now live on the domain but my application was running on localhost, my requests were being rejected by the server. To solve this, I added a clientaccesspolicy.xml file. At this point, the test Silverlight application running on my local machine began functioning again.

Deploying the Silverlight Application

Now, with my Service installed, configured, and running as desired, and with my Silverlight 2 application consuming that Service, I figured I was ready to deploy it to the server. I created my new ASP.NET web site on IIS 6.0 and deployed the Silverlight application’s test ASP.NET page. I pointed my browser to the test page and… nothing.

And by nothing, I mean I received the dreaded blank page. Even worse, when I tried to right-click to view the source, all I got was the “Silverlight Configuration” prompt. At first I was really bummed, but then I realized that if I was getting the Silverlight prompt, then that meant the browser recognized my content as Silverlight! I was actually closer to success than I originally imagined!

Once more unto the Google breach, and I found that, at least in IIS 6.0, you have to configure a MIME type for .xap files! I navigated to the MIME settings on my Silverlight domain and added a Type for extension “.xap” with a content type of “application/x-silverlight-app”. I restarted the web site and went to my page and Viola! I had a Silverlight 2 application running on IIS 6.0 that consumed WCF Services!

What’s next

So now that I have the basic structure down, I have a bit of work left to do. First, I need to test all my Services. Then I need to read up on performance for WCF: I believe there are some lazy loading techniques I can use to make sure my users are getting immediate access and not waiting around for a bunch of data to load. After that, it will be back to Blend 2 for some serious design work. I don’t have anything particularly juicy in mind for this application, but I do want something a little beyond the ordinary. Along the way, I’m hoping to upgrade to Server 2008, Sql Server 2008, and IIS 7.0. And in January I am taking Computer Graphics classes at the local community college. All in all, it looks like I’m going to be having a lot of fun in the near future!

Categories: IIS 6.0, Silverlight, WCF

Live Blogging VSLive! Austin – Day 1

November 12, 2007 Comments off

9 am:

Today, VSLive! Austin begins with a session by Billy Hollis entitled “Maximizing WPF & Silverlight”. I’ll be updating this post throughout the day with interesting tidbits from the presentation. The problem is that there is no power in the room, so I can only run for so long before I need a recharge. If I have any complaints about VSLive!, this is it: know your audience – we need power!

I’ve been to several of Billy’s presentations in the past, and he is a real GUI Guru, so I look forward to today’s presentation. If Silverlight promises as delivered, it will finally be the technology to realize the goals of Java Applets and Flash. Should be fun!

9:48am update:

  • WPF is hard technology to learn: it is not unusual for developers to flounder for several weeks or even months while in the learning process
  • WPF is Vector based, rather than Bitmap based. This should bring the end of developing for specific screen resolutions
  • WPF is optimized for integrated media
  • Silverlight is a subset of WPF. Small install, runs in a browser not unlike Flash. Cross-platform capable. As such, it cannot do everything WPF can, such as 3D.
  • For more robust web apps, WPF can be run inside the browser. This requires WPF to be installed on the machine, and so it will only work on Windows, and currently only in IE (although other browser support on Windows is expected). If you see a web page with an “.xbap” extension, this is WPF running a browser.
  • Having the same skill set from Silverlight to full WPF GUIs allows developers to leverage the same skills to do many different UIs
  • Silverlight 1.0 is limited to JavaScript: no code-behind capabilities. Billy says that writing rich code in JavaScript is like “frosting a cake with a Ping-Pong paddle. It can be done but it ain’t pretty!”
  • Silverlight 1.1 (now in testing) will allow code-behind and will distribute a mini-CLR. This means you can write and execute C# code in ANY browser on ANY platform.
  • WPF has a greatly enhanced ListBox control: complete control over the graphics and implementation of each individual item. Allows dynamic formatting and sizing.
  • WPF and XAML are a move towards declarative programming. Simply declare what you want, instead of defining how to create it, and the system does the rest.

10:07am update:

  • XAML is very friendly for Code Generation – Billy showed a tool he wrote in a few minutes similar to my own PropertyBuilder (see Free Code)
  • A quick note: the new language versions (like VB9) have embedded XML tools and object
  • Designing XAML: you can use either Visual Studio or Expression Blend
  • VS is designed for developers – gives full access to code but cannot do all the design work, such as gradients
  • Blend is designed for Designers: great graphics tools, but no access to code
  • Blend can execute code that is already present
  • The two can be used simultaneously: both open and use the same .proj files – a change in one will be detected and prompted in the other
  • Blend XAML does not have Intellisense, but VS does
  • Blend is a separate license, but is part of an MSDN subscription
  • CONCLUSION: use Blend to develop the XAML, and VS to edit it manually and write code

10:50am update:

  • WPF Window class is the root visual element
  • Very much like the Form class: same properties and events
  • Managed by the Application class as part of Window collection

A good question was asked about the future of Windows Forms. This was Billy’s response:

  • Forms are not going anywhere: will be supported for a long time to come
  • BUT there will be no significant enhancements: all future development will be for WPF
  • WPF is more expensive to develop for right now: more resources, more time, high learning curve
  • Eventually, WPF will be as easy or easier than Forms
  • WPF does not make Forms obsolete
  • New applications should be designed in such a fashion that Forms can be replaced by WPF (good separation of UI and Code) or developed for WPF up front (biting the bullet)

WPF Elements:

  • Element is the catch-all term for everything in WPF, like we treat Control today in Forms
  • A Control is anything that interfaces with the User: buttons, checkboxes, etc.
  • A Container is an Element that contains other elements
  • Like Panel (which is an abstract class in WPF) – used for layout and management: there are four basic Panels – StackPanel, Canvas, Grid, and DockPanel – all used for layout
  • Or Decorator (such as Borders and the like)
  • Item Controls – lists of other elements
  • There is no DataGrid in WPF
  • Containers have Child element collections
  • Controls are limited to a single Content property
  • Content can be ANY .Net object – including Containers
  • So any Control can be essentially anything
  • Non-WPF objects are displayed as their .ToString() implementation

1:30pm update:

Getting back from lunch, here is a quick update from the last session.

  • Content items can be very complex: one example would be making the content of a tooltip a video box
  • Buttons traditionally fire their click event upon release, but WPF introduces the ClickMode Enumerator: release, press, and hover.
  • TextBlock is the most lightweight text control, even more so than Label (it is missing a lot of events, properties, and methods)
  • Menus and Toolbars are ItemControls, managing a list of other controls
  • Measurement Units replace pixels – they are device independent, theoretical units – their actual size is relative to system DPI settings
  • The Canvas panel type uses absolute positioning and appears to make the most sense to typical Form developers – don’t fall into the trap! It should be used sparingly sense it does not handle Resizing (one of the main goals of WPF)
  • There is no Forms to WPF conversion
  • Forms can be used in WPF
  • Silverlight 1.0 only supports the Canvas panel type, but later versions are supposed to incorporate other panels
  • In WPF all Colors become Brushes – this means that whereever there is Color, you can use Gradients, images, shapes, textures, etc.
  • NOTE: the new language versions support “Relaxed Delegates”. This means you do not need to define event args for event signatures if they are not needed.

Data Binding:

  • Data Binding in WPF is very good
  • Blend has some tools for assigning Data Binding
  • VS does NOT have any tools for Data Binding, you must code the XAML by hand
  • XAML uses “Markup Expressions” for variable items such as Data Binding – there is no Intellisense in Markup Expressions
  • Elements may have multiple bindings for different properties
  • Bindings are defined as Data Context properties: when data binding occurs, the elementsearches up the tree until it finds the first Data Context.
  • This does NOT mean it searches for matching properties! It just uses the first one it finds: failing to find one results in a Silent Failure, so nothing happens and there is no Exception to catch.

6:15pm update (post class):

The wireless quit working for a while, and then I ran out of power, so I missed the last two updates.

More on Data Binding:

  • Anything that implements IList can be bound to a ListBox
  • Data Binding can come from XML, ADO.NET objects like DataSet and DataTable, or a Resource List defined in XAML
  • WPF Element properties can be bound to other Elements Properties: this is a potentially very cool feature. The example Billy showed was binding a TextBlock’s FontSize property to a Slider control’s Value. Move the Slider and the Font Size of the TextBlock changes automatically

Some Miscellaneous points:

  • VS2008 Properties window has no ABC sort. I hope this is fixed in the GA version because it is awful to constantly scan the window looking for the correct property
  • As XML, XAML is case sensitive, which really bothers VB developers

XBAPS – some more on using Silverlight or WPF via a browser:

  • Like any web page, XBAPS run in a security sandbox
  • Apps delivered by the server: Software-as-a-Service
  • Can store small amounts of information in Isolated Storage. Good for configuration and cacheing.
  • Requires the .NET Framework 3.0+ – Silverlight does not.
  • XBAP takes over the entire browser window – Silverlight does not.
  • ASP.NET can deploy Silverlight components like Flash.
  • Silverlight is installed in the browser as a plug-in.

Resources – A crucial part of WPF used to define reusable items:

  • XAML can contain declared resources
  • Used partially for styling
  • Can be ANY .NET object,but is usually a WPF object
  • The name of the resource is the key in a Resources Collection
  • Can be defined at any level of the XAML: application, window, grid, panel, etc.
  • Employed like stylesheets
  • When looking for a match, walks up the tree until it finds the first one

Data Templates – a way to define layout and binding templates:

  • Helps with the separation of code and UI
  • Data should not care about how it is displayed
  • The UIElement is in charge of the display
  • A data template is used to layout data in a display
  • Data Template elements can be data bound to object properties or other information
  • Defined as a Resource
  • Templates can contain other Elements such as Panels, TextBoxes, Images, etc.
  • Template assignments can be changed dynamically: apply different templates based on different states

Animation – not just “cartoonish” or movement, animation means “changing visual properties over time”, such as color, opacity, size, position, etc.:

  • Has good and bad uses
  • Good animation should be a metaphor for a real world experience (opening a folder, for instance)
  • Real world movement is more natural than something just appearing or disappearing
  • Fading in and out “feels” more comfortable and natural
  • Establish a Path or Storyboard (use Path for movement)
  • Bind animation to an appropriate property
  • Animation classes are used to execute
  • There are different Animation classes for each data type, like DoubleAnimation for doubles
  • Namespace: System.Windows.Media.Animation

Media:

  • MediaPlayer wraps the Windows Media Player
  • MediaElement wraps MediaPlayer in XAML
  • EventTriggers respond to buttons
  • MediaElement can be the Content for any Control – you can effectively put video anywhere
  • Media can be used to create a VisualBrush

Transforms – used to alter shapes and sizes of graphics

  • A Transform is a system that maps a coordinate space to a different coordinate space
  • Unlike GDI+, you can simply declare Transforms in WPF and they “just happen”
  • TranslateTransform is used to offset hte starting coordinate
  • There areTransforms for Scaling, Skewing, and Rotating
  • MatrixTransform is used to apply multiple Transforms
  • RenderTransform will apply the transform withoutupdating the Layout
  • LayoutTransform will adjust the WPF layout to accomadate the Transform

Styles – like CSS, styles are used to change the look of Elements:

  • Declared as a StaticResource
  • Allows you to define multiple properties simultaneously
  • Styles can be assigned at any level or globally for a type
  • Styles can inherit from other styles using the BasedOn attribute

Ink – add Ink capabilities anywhere:

  • Bolted on to Windows Forms, but built in to WPF
  • Use an InkCanvas and set the background to any element
  • You can Ink over anything, including streaming video
  • Ink also has Recognition capabilities via the System.Windoes.Ink.InkAnalyzer class.

Whew!? There is more I could add, but what a day!? I think these pre and post conference seminars are the best part of VSLive!? See you tomorrow!

Categories: .NET 3.5, Silverlight