Blog

How To Remix Flotzam

January 27, 2008 11:52 by Flotzam

1. Download the latest Flotzam source code and open Flotzam.sln in the Blend 2 December Preview
2. Hit F5 to see the application working.  You should see different "flotzams" appear on the screen. By default, you will see public Twitters and Flickr images as well as videos posted to YouTube tagged MIX07.  You can change what Flotzams you get (personalize them, etc.) by tweaking the settings.
3. As you can see, the Flotzams aren't pretty.  If you want to see prettier Flotzams, you can change the skin in the "General" tab of the settings. These are skins that Tim Aidlin made.
4. So now it is your turn to make a skin.  In Blend 2, go to the Resources tab and find the file new.xaml.  Expand it and you should see seven templates.  If the Resources tab is blank, go to the Project tab and open the file Window1.xaml and then go back to the Resources tab and you should see new.xaml.  It should look like this:

5. Open DIGG_TEMPLATE.  There you see the fields you have to work with in the designer.

6. Expand the stack panel. Inside the StackPanel you can see the visual tree with the different fields you have to work with.

7. Double-click [TextBlock] "Username".  Change to the Properties tab.  Notice that the Text field (under Common Properties) is highlighted in yellow. This is because the Text field has been databound to the Username field.  DON'T MESS WITH THE DATABINDING.  MESS WITH ANYTHING AND EVERYTHING ELSE.  For example, you can copy the whole TextBlock into a different container; you can change any of its other properties, just don't mess with any field that is highlighted yellow.

8. There is a default animation that has been applied to each of the templates.  You can see it by clicking the >> in the Objects and Timeline pane. You will now see OnLoaded1.  This animation is very simple: it just fades out the entire Canvas over 5 seconds.  To remove this animation, just go to the Triggers pane and click the minus arrow.

9.   By default, when the Flotzams are placed on the scene, they are placed at random.  This is done from code.  If you want to turn this off, so that they always enter the stage right in the middle of the screen, open Window1.xaml.cs and on line 27, change the randomizerFlag to false.
10. You are also welcome to change the background of Window1.xaml.
11. Once you have finished your Remix, send just the new.xaml file (and any other files you may have added or changed) to flotzam@microsoft.com.  Send any questions you may have to flotzam@microsoft.com



Categories:
Actions: E-mail | Permalink | Comments (20) | Comment RSSRSS comment feed

Comments

February 1. 2008 08:14

trackback

Trackback from News

The Glory of Seeing Your Mash-Up on the Big Screen

News

February 2. 2008 02:00

trackback

Trackback from Synergist

Mix is 6 Weeks Away!

Synergist

February 6. 2008 14:13

trackback

Trackback from Scott Golightly's Blog

FW: Barely 6 weeks until MIX08

Scott Golightly's Blog

February 28. 2008 15:21

trackback

Trackback from OpsanBlog

MIX08: The Coolness

OpsanBlog

March 20. 2009 15:57

Foreclosure Help

Awesome site. Very informative and nice design. I really like your posts and your style.

Foreclosure Help