Bryant Likes

The current Silverlight application that I’m building has a Login view. One of the things that bugged me when I started using the application is that you would have to click the Login button after typing your password. I wanted to duplicate the default button behavior of HTML forms where when you hit the enter key it would trigger the default button on the form. I did some googling on the subject and came across this post by Patrick Cauldwell which is one way to solve the problem. However, in my case I had a username Textbox, a password Passwordbox, and a company Combobox and didn’t want to specify the button for each control.

So I create a simple solution of creating a content control that attaches to all the KeyUp events of all the child FrameworkElements in the content. To do this I used the FindChildren<T> extension method from the Avanade Silverlight Accelerator which is a toolkit we use internally at Avanade to speed up Silverlight development. The ContentControl exposes a DefaultCommand property which you then bind to the ICommand property on your ViewModel.

Below is a trimmed down example of the Login view. I’m using a variant of the RelayCommand/DelegateCommand as the LoginCommand here (see Laurent’s post on the RelayCommand for a good overview of Commands in Silverlight).

<ctrls:FormControl DefaultCommand="{Binding LoginCommand}">   
  <TextBox Text="{Binding Username, Mode=TwoWay}" />
  <PasswordBox Password="{Binding Password, Mode=TwoWay}" />
  <Button IsEnabled="{Binding LoginEnabled}" 
          cmds:ButtonClickCommand.Command="{Binding LoginCommand}" 
          Content="Login" />
</ctrls:FormControl>

There are many other things you could add to this but this is all the functionality that I needed and I decided to keep it simple. Download the class file (plus the extension method) below. Let me know if you find it useful!

About six months ago I decided to take a break from blogging without feeling bad about it. It was a nice break, but really my lack of blogging was mostly due to the type of work I was doing. I was working on an interesting project for a large media and entertainment company that combined Microsoft Excel and Project Server 2007 with lots of .NET 3.5 goodness like WCF and WF. While it was an interesting project, I wasn’t really working with the technology that really interests me: Silverlight.

But I’m excited to announce that Avanade has gotten serious about UX and has created a UX practice in the west region (where I work). I’m very fortunate to get to be a part of the leadership team for this practice and I’m excited to see where things are headed. So I’m now a User Experience Developer and I get to work with the technologies that I’m passionate about like Silverlight and WPF.

So what does it mean to be a User Experience Developer? Well, I feel like that is something that I still have to figure out. I know that putting User Experience in front of Developer doesn’t suddenly make you better at UX. However, I think it is much like when you first start out as a developer, you don’t really know what it means yet, but you’re setting out to become a developer. So hopefully by focusing on becoming better at UX I will in the process become a true UX developer and I’ll be bringing this blog along for the ride.

I’ve actually been working on a Silverlight project for the last couple of months and have some blog posts in the works already. So keep an eye out from some Silverlight related posts coming soon.

Two collegues of mine at Avanade, Hong Tan and Greg Ferguson, did a demo of WPF for the students at UCI. For the demo they took the Kevin Button and modified it with pictures of Hong. They also created a javascript only version of the button to see how it compared to the WPF version. I took it a step further and created a WPF/E version of the Hong Button.

I made use of some of the new features in the Feb CTP like the downloader object, resizing, and  ActualWidth and ActualHeight properties. I also borrowed some of the code from the WPFEPad sample which has also been updated to use these features. However, this is a much simpler example than WPFEPad, so if you're interested in learning about the downloader object check out the javascript.

The reason for the download object in this case was that each of the images is around 34k. While that isn't very big, if you don't download them prior to running the aplet (what do we call a WPF/E application?) then you get a delay when you mouse over the polygons. I also found that if I just switched the Source of the main Image in the MouseEnter event that it would run slowly as well. So I ended up creating an array of states that each has an associate image. I then set the opacity to 1 for the active image and 0 for the inactive image. This seems to work pretty well and is pretty fast. For the reflection I just set the Source of the image to the Source of the active image.

One thing is for sure, the more WPF/E work I do, the better my javascript skills get. In digging through the WPFEPad example I found that pretty much all the code was done using javascript objects. So I followed that same design pattern and I think it makes the code much easier to use. Hopefully it is easy to read as well.  

One of my side projects at work has been a social website for the SoCal solution developers. I decided the site would be a great chance to learn more about WPF/E as well as ASP.NET AJAX so I've been making heavy use of both on the site. One of the last version 1.0 features that I wanted to finish was the login page which was pretty ugly (until today). I was hoping to use a pure WPF/E solution for the login itself, but WPF/E doesn't support things like textboxes yet, so I had to use plain old HTML as well. I also tried to make use of dog ears in the animations and I think that I succeeded.

You can give it a try and see the animations in action (but you shouldn't be able to log in :). I'm planning on creating a demo version of the site that can be used for demos that won't have real people's info in it, but for now you'll just have to get back on the invalid login example. I built the buttons in notepad but I followed Lee's demonstration on how to create animated buttons in WPF and just tweaked it to use in WPF/E. I didn't complete the button down animations yet, but the mouseover animations work great.

For the dog ears effect of the text flying in and out I used my DoubleAnimationUsingKeyFrames technique from my previous post and just added a little bit of bounce to the animation. I think it works. For the AJAXish wait icon I downloaded an icon from this site, converted it to a PNG file, and then added a RotateTransform with an animation (using the CenterX and CenterY properties to make it spin).

Inside the site I've also used a lot of ASP.NET AJAX and WPF/E, but for now I'm going to keep that under wraps. But I will make a demo site soon. Let me know what you think of the login.

I've always thought that Flash was cool. When I was in college I purchased a copy of Macromedia studio at the academic price and tried to create some Flash animations for a website. However, I'm not a designer and the learning curve was too much for me at the time, so Flash didn't stick with me.

A couple of projects back I spent a lot of time with WPF since the client portion of the application was going to be built with WPF. Armed with a basic knowledge of WPF, I thought I would give WPF/E a try. One of the big advantages of WPF/E is that if you like what someone else has done you can just take a look at their XAML. So to get started on my WPF/E project I took a look at the WPF/E Egg Timer (via Tim) and the WPF Blog's Header. You can download the XAML and the JavaScript for both to see how they work. I also read through this article on getting started with WPF/E which includes IIS configuration information.

One of the projects that I've been working on in my spare time is a social website for the Avanade solution developers in Southern California. So far I don't have much to show except a cool url and now a very simple WPF/E animation. You can check it out at http://wsup.la.

It is just a place holder for now, but it was still fun to create. In addition to the links above, I also used:

• Urban People Images from Iconoholic
• Victoria's Vertical Centering

Since WPF/E is so easy to create (and edit) I'm guessing we will be seeing a lot of it in the near future.

I now have another blog in addition to my main blog. My new blog is hosted by Avanade and I'll be cross-posting to both when it makes sense. There are a bunch of other Avanauts blogging on the new site, take a look and you will find some valuable stuff there...

In my life as a developer I have somehow never been on a project where I was creating a windows forms application (or a VB6 UI for that matter) AFAIR. Somehow I was always doing either ASP, ASP.NET, or some backend application with no real UI. My current project is different in that it is a smart client application. However, the client really wants to use WPF for the UI.

The more I understand WPF, the more I feel like I'm building a web application more than a forms application. The UI is all based on markup and you have databinding that seems very ASP.Net like. The line is blurred even more when you add in XBAPs which means you can run the WPF directly in the browser. However, WPF application development seems to blast past ASP.NET development at this point.

On my last project I built a really simple management UI using ASP.Net and Atlas. As much as Atlas tries to integrate AJAX into ASP.Net, I still felt like I was back in my ASP spaghetti code days. Kyle Huntley, a fellow Avanuat, makes a similar observation:

Atlas / Ajax does not represent any “Best Practices” in development from a purely technical standpoint; there are better ways to do it all. It is the unfortunate reality that the industry has been unable to settle on a single well-conceived runtime environment and has instead taken a drunkard’s walk to arrive at a very unappealing, but relatively standard, programming environment. Ajax is simply a way of trying to paper over the “poor” client characteristics of the browser / markup technology rootstock.

WPF can give you a richer experience than AJAX and without all the spaghetti mess. As another fellow Avanuat TSHAK says:

In the midst of all of the hype around the cool hacks that you can with a web browser, it is important not to ignore the innovation happening around application development on the Windows platform.

I definitely agree that WPF is taking us in the right direction and gives us a much cleaner development story than ASP.NET/Ajax. However, you might not have the option of assuming .NET 3.0 on the client for quite some time. But if you do have control over what is on the client, then WPF is a great choice for smart client applications (or is it a rich client?). Then you have the choice of running in the browser or not which gives you lots of great options.

So I personally think the runtime is the way to go, whether or not you run it in the browser. Now it is just a question of how well Microsoft drives WPF adoption and how Microsoft developers adapt to this new paradigm of client UI development.

Technorati Tags: WPF - .NET - ASP.NET

Well I'm back from vacationing in New York and Connecticut for a week (which was great) and I just found out that I passed the 553 and 554 exams which I took while they were in beta. Passing these two exams not only gives you a MCPD:EA cert, it also gives you three others! Add that to my other recent certification and my existing ones and I could have quite a signature. :)

From a new avablogger comes a first look at the Avanade Enterprise Library Integration Pack:

I've been working on a small side project to integrate Enterprise Library with Visual Studio.  The end result of the project, tentatively named Enterprise Library Integration Pack, provides the functionality of the Enterprise Library Configuration Console as an editor in Visual Studio 2005.  Here's a first look:

From what I see in the screenshots this looks very cool. I've been using Enterprise Library in a few of my personal projects and it would be nice to have this kind of functionality. 

Update: Wow, that was fast. It has now been released (and slightly renamed)!

From  Andy May:

OK, so again it's nothing to do with Sharepoint but I've got to give a shout to Flagr which just has to be my favourite Googlemap mashup to date. Very easy to use and very cool.

That is a very cool site. I played with it a little yesterday. This site would be especially nice for consultants rolling onto a new customer site. You can post the great places to eat and stay around the site for the other guys on the team.