Feed Icon  


  • Bryant Likes
  • Send mail to the author(s) E-mail
  • twitter
  • View Bryant Likes's profile on LinkedIn
  • del.icio.us
Get Microsoft Silverlight
by clicking "Install Microsoft Silverlight" you accept the
Silverlight license agreement

Hosting By

Hot Topics


Open Source Projects




Posted in WPF/E at Wednesday, January 31, 2007 9:49 AM Pacific Standard Time

Just got this when I went to view a WPF/E enabled webpage (trying to figure out layering stuff and was going to view Mike Taulty's example).

I haven't found the download yet, but I'm looking.

Update: Shawn Wildermuth beat me to posting the question in the WPF/E forums (that guy is always a step ahead of me :) and here is the Microsoft response:

Yes, we are aware that this message has appeared. This is a result of a bug in our timebombing code (only affects Windows OS). You'll need to reset your clock to continue using WPF/E. We are working on getting an update out as soon as possible.

Ouch! I hope they fix this soon since it is going to crap out a couple of my sites.

Update2: Another post in the WPF/E forums annouces the release of the Feb CTP of WPF/E. Users can download it here, developers need to update their aghost.js file here.

Earlier today, you may have noticed your “WPF/E” December Community Technology Preview (CTP) control expired.  No worries though- we’ve just posted the February CTP for Windows and Mac to Microsoft's download center and updated the samples on the Channel 9 Playground to work with the new CTP.  Note that to get your samples working with the February CTP, you’ll need to change out the agHost.js file with the new one found here. Tomorrow we’ll update the website with details on what’s new in this release, and an updated SDK and samples will be available soon too.

So far I noticed that it has broken a few of my animations, but other than everything seems to be working. It will be interesting to see what was fixed.

The WPF/E Gear Keeps Turning

Posted in WPF/E at Thursday, January 25, 2007 9:19 AM Pacific Standard Time

First the SDK team created an article about generating reflections in WPF/E. Then today I read [via Mike Harsh] about Michael Schwarz extending the example to include an animation.  I also read in Mike's post about the WPF/E google group (joined!) and in the group I read Dave Campbell's post about extending the example further to roll the gear across the screen. I couldn't help myself and I took it one step further and gave the rolling motion a little twist so that it looks like the wheel accelerates and hits a wall.

This is done using a SplineDoubleKeyFrame, which allows you change how the keyframe is interpreted. I had no idea how this worked until I came across this post by Karsten where he demonstrates creating bouncing balls in WPF. I borrowed his SplineDoubleKeyFrame but when I applied it to the gear it started fast and then went slow and I wanted it to do the opposite. I didn't understand how the SplineKey worked but came across another post by Karsten where he gives you the code for the Bezier Time which is a WPF app that he wrote to better under stand the effects of the SplineKey. Unfortunately the app was written with one of the beta versions and no longer worked, but I was able to get it running after some rework (although one of the animations is broken still). Using that tool I was able to figure out how to invert the curve and get the effect that I wanted.

The SplineDoubleKeyFrame is definately the way to get the dog ears effect going, now I need to go read up on beziers and splines. :)

Download Gear.xaml

WPF/E + ASP.NET AJAX, Better Together

Posted in ASP.Net/Web Services | Avanade | WPF/E at Thursday, January 25, 2007 4:39 AM Pacific Standard Time

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.

Certifications Are Like Decorations

Posted in General | Certifications at Thursday, January 18, 2007 10:03 AM Pacific Standard Time

Jeff Atwood asks Do Certifications Matter? Personally I think there are two main uses for certifications:

  1. Inexperienced developers trying to break into that first job
  2. Experienced developers who want some decorations

In the first case, even though they don't mean a whole lot, I do feel better hiring someone fresh out of college if they are also an MCSD. While that doesn't mean they will come in at a higher level, it does mean that they have a better idea of the software development landscape and probably know more of what they don't know.

For the second case I think certifications matter even less between programmers, but probably have some impact in selling developers to a client. If I'm interviewing an experienced developer I'm definately much less interested in their certifications.

I personally like certifications. Not so much for selling myself to clients or potential employers, but as decorations. I enjoy taking tests and I don't spend anytime studying for the exams (unless I don't pass, then I generally see it as a real challenge). I also find them helpful because they help me to know what I know or don't know. If you take the beta exams, they are free, plus many times you get a voucher for passing them.

So to complete my analogy, certifications are like decorations and experience is like floorspace. If you have very little floorspace and lots of decorations, it will look cluttered and strange. The more floorspace you have, the more decorations you can have.

Do certification matter? I think so, but not as much as experience.

WPF/E CSModule Released

Posted in ASP.Net/Web Services | WPF/E at Thursday, January 18, 2007 4:27 AM Pacific Standard Time

I just posted my WPF/E CSModule that I created to display WPF/E content on Community Server blogs. You can download the module and the source code here. It will allow you to display multiple WPF/E items in a single post and puts links on the posts when they are viewed in a feed reader. The source code includes everything except my tests. You can view examples of the module in action here and here.

Dog Ears in WPF/E

Posted in WPF/E at Thursday, January 18, 2007 2:34 AM Pacific Standard Time

While working on some WPF/E stuff for a side project of mine, I came across this post by Karsten Januszewski (Note: Karsten's blog is a must read). I find it interesting that I seem to learn a lot about what you can do in WPF/E mostly by reading people's Xaml. I didn't event know that the Storyboard element had a Completed attribute or that there was such a thing as a TriggerActionCollection.

Anyhow, I was playing around with the code posted there and I was actually trying to acheive something like the cool animations that you will find in the Kevin's Zap Scroller. The zap scroller has a animation that flows and is very cool looking. It is the dog ears experience model as Kathy explains:

In the real world, we have physics. We have inertia. Things bounce and stretch and squash. We have follow through. Imagine a dog with long floppy ears sprinting for a frisbee. Now picture the dog coming to a screeching halt in front of the disc. What happens to the ears? They keep going. Then they "bounce" back. And it's a big part of what separates a good animator from an amateur.  

I knew what she was talking about because had already watched all the iPhone demos based on the advice of Walt who notes that while you watch those videos:

Then keep this is mind.

  • Every single UI trick
  • Each animation
  • Every single blended window
  • How they merge video, animation and 2D graphics
  • Every single feature in the user interface on the iPhone can be created today in WPF. 

WPF gives you the tools to build application that look and feel like these screenshots.

What are you waiting for?

Now I agree that we can build all those things in WPF, however, I've been struggling with the dog ears effect in WPF/E. It is probably just because I don't know enough about animations and physics, but that didn't stop me from trying. One of the things that I think will be needed to achieve the effect is Key Frames. Key Frames simplify things a lot when you're trying to move an object around and need to use different speeds, etc. So I started with the animation found at the beginning of this post where Hans (via Karsten) is moving a block around on the screen using multiple animations with javascript waits inbetween (see the post above for the code and xaml). However, we can achieve the same thing simply using Key Frames. So instead of three Storyboards in a TriggerActionCollection we get this:

  <DoubleAnimationUsingKeyFrames Storyboard.TargetName="Rectangle1" Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:9" RepeatBehavior="Forever">
          <LinearDoubleKeyFrame Value="400" KeyTime="0:0:1" />
          <LinearDoubleKeyFrame Value="400" KeyTime="0:0:3" />
          <LinearDoubleKeyFrame Value="200" KeyTime="0:0:4" />
          <LinearDoubleKeyFrame Value="200" KeyTime="0:0:6" />
          <LinearDoubleKeyFrame Value="0" KeyTime="0:0:7" />
          <LinearDoubleKeyFrame Value="0" KeyTime="0:0:9" />

This will produce the following WPF/E animation (again, only on the site since my add-in doesn't work in the feeds):

Note how jerky the animation is. The square starts and stops instantly. Now we can get a little better just by adding in some more key frames that cause it to start and stop slower. This is a long, long way from an iPhone type dog-ear effect, but by using key frames we can start to move in that direction.

The xaml for this just adds in a few extra key frames and this gives it a little better animation. That is as far as I can take it today, but maybe you can take it farther and create something really cool by adding more key frames. Here is the final xaml.

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Rectangle1" Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:9" RepeatBehavior="Forever">
          <LinearDoubleKeyFrame Value="10" KeyTime="0:0:0.1" />
          <LinearDoubleKeyFrame Value="390" KeyTime="0:0:1" />
          <LinearDoubleKeyFrame Value="400" KeyTime="0:0:1.1" />
          <LinearDoubleKeyFrame Value="400" KeyTime="0:0:3" />
          <LinearDoubleKeyFrame Value="390" KeyTime="0:0:3.1" />
          <LinearDoubleKeyFrame Value="210" KeyTime="0:0:4" />
          <LinearDoubleKeyFrame Value="200" KeyTime="0:0:4.1" />
          <LinearDoubleKeyFrame Value="200" KeyTime="0:0:6" />
          <LinearDoubleKeyFrame Value="190" KeyTime="0:0:6.1" />
          <LinearDoubleKeyFrame Value="10" KeyTime="0:0:7" />
          <LinearDoubleKeyFrame Value="0" KeyTime="0:0:7.1" />
          <LinearDoubleKeyFrame Value="0" KeyTime="0:0:9" />

Update: I upgraded my CSModule so that it will display multiple WPF/E files in a single post (before you only saw the red squae moving, now you should see a blue square as well).

WPF/E Reflections Tip

Posted in WPF/E at Wednesday, January 17, 2007 7:30 AM Pacific Standard Time

If you're doing WPF/E development, you should check out the WPF/E Developer Content Blog. On that blog there is a great post that explains how to add cool looking reflections using WPF/E. I've been doing a lot of WPF/E reflections lately and just wanted to a one tip which has helped me alot. Instead of adding the reflection to an Image, wrap your image (or whatever you're displaying) in another Canvas and then add a third canvas for your reflection. You can apply the scale transform and opacity mask to the third canvas and get the cool effect. The reason to do this is that you can add whatever you want to the top canvas and if you duplicate it in the bottom canvas you will get a full blown reflection. For instance see the below WPF/E (sorry, embedded WPF/E only shows up on the site, not the feed.)

Note: I'm displaying this inline in the post using a new CSModule that I wrote. If you're interested in it let me know and I'll document and release it.

This is a simple tip, but it has saved me a lot of time when I'm creating a reflection on a bunch of stuff....

Update: I upgraded my CSModule to include a link to a WPF/E loader page so that you can just click that if you're viewing my blog from a feed reader.

 Update2: Doh! I forgot to add one line of code that did the actual replacement in the feeds. Now it is really working. :)

Testing WPF/E CS Module

Posted in at Wednesday, January 17, 2007 5:23 AM Pacific Standard Time

Quick test of a WPF/E CS Module I'm working on...

Does it work?