Developing For .NET

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!

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!

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.

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]

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.

And here is the XAML:

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.

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. 

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.

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!

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.

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:

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: