Feeds:
Posts
Comments

Archive for the ‘WPF’ Category

A couple years ago I wrote a post regarding the WPF VisualBrush. As part of that post I discussed the TileBrush.

TileBrush is abstract and defines a number of useful properties for creating a repeating pattern.  For example you could set the source of the ImageBrush to a picture of a flower, then set properties to repeat the picture in five columns and three rows.

Expression Blend and TileBrush

Now that more developers and designers are adopting  Expression Blend it seems like a good idea to learn how Blend handles Tile brushes.  For this example I am using an ImageBrush but the similar techniques apply to the DrawingBrush and VisualBrush.

Add an Image to a Blend Project

The first step is to add an image to a Blend project.  Right-click the project in Project tab and choose "Add Existing Item".  Find an appropriate image and return to the Blend UI.

image

Insert an Image

Right-click the image in the project tab and choose "Insert".  This will add the image to the ArtBoard.

image

image

Convert to Brush Resource

Press the ‘V’ key to activate the Selection tool and click the image in the ArtBoard. Choose the "Make ImageBrush Resource" menu item as shown below.

image

Provide a key (Name) for the ImageBrush resource.

image

Using the Brush Transform Tool

Delete the existing Image from the ArtBoard.   Add another element to the ArtBoard, for this example I am using an Ellipse. 

image

Select the Ellipse with the Selection tool (press the ‘V’ key then click the Ellipse).  Select the Properties tab and then choose the Brush Resource.

 

 image

The ellipse is filled with the ImageBrush.

image

Transform the ImageBrush

Now it finally time to add columns and rows to the ImageBrush.  The Brush Transform tool (press the ‘G’ key) is the tool you are looking for.

image

 

image

image

Finally choose the TileBrush button in the Properties window and then choose a TileMode value.

image

You can continue to manipulate the tile in the Artboard. Resizing the Tile smaller adds more columns and row to the result.  Dragging the tile in the ArtBoard changes the top/left position of the tile.  Lastly you can skew and rotate the tile with the Brush Transform tool

image

image

Read Full Post »

New WPF Themes released

For the last year I’ve been talking about the need to make a set of themes and templates available for WPF developers.   There are plenty of companies who want nice looking WPF applications (other than the default Windows XP/Vista look) but don’t know where to start.  I’ve argued, to anyone who’ll listen, that we need a community site that showcases the power of WPF templates.

CSS Zen Garden

I suspect that many of you are familiar with the CSS Zen Garden.

image

The goal of the site is to showcase what is possible with CSS-based design. Style sheets contributed by graphic designers from around the world are used to change the visual presentation of a single HTML file, producing hundreds of different designs. Aside from reference to an external CSS file, the HTML markup itself never changes. All visual differences are the result of the CSS (and supporting imagery).

The magnitude of the changes you can make to a prototype website by swapping the CSS is staggering.  CSS Zen Garden permits designers to show how creative they can be with CSS and allows other to use these CSS files as starting points for their own development.

image

Where is the WPF/Silverlight Zen Garden?

Both WPF and Silverlight support templated controls.  Templates allow us to completely change the way a control looks, while keeping the same behavior.  This is a powerful concept that allows developer to change a button from

image

to

image

My dream is to have a community site where designers can display their templates for WPF/Silverlight controls and others can peruse the catalog looking for design ideas and samples.

WPF Futures releases new control templates

Microsoft has made a few small steps in publishing control templates. A few months ago Microsoft released a set of control templates for Silverlight.  Those templates have been modified to work with WPF controls and were released last week for your consumption.

image

image

Read Full Post »

Attend a keynote at a big Microsoft conference and at some point in the presentation you will hear a musical fanfare followed by a breathless product announcement.

Depending on the show and the time of year the announcements can be hum-drum or spectacular.  Do you remember when Microsoft announced a new development framework called .NET a few years ago? 

 

Of course Scott Guthrie’s keynotes tend to be a little more fun.

 

Img0398 by Long Zheng.

How to Top Mix08?

Silverlight 3 is going to be the brightest light in the Mix09 marquee this year.  Expect to hear a flurry of announcements regarding new features in Silverlight.  Silverlight 2 is impressive but Microsoft needs to show improvements in many areas to offset the advantages of their competitors RIA frameworks. 

The tools in Expression Suite get little love from Adobe devotees. The designer wars are heating up however and Microsoft will show some startling improvements in Expression Blend.  You definitely won’t want to miss the Expression Blend announcements.

WPF and XAML are also gaining significant improvements, some of which will be shown at Mix.  I saw a preview of what’s coming in Silverlight, Expression Blend and WPF while at the MVP summit earlier this month. What I saw at the summit was very exciting and I expect it will be thoroughly covered during Mix sessions this week.

image

I know that there are even more surprises coming, including one super NDA Silverlight secret, so keep your ears open.

Expect live coverage of the Mix event here at the WpfWonderland blog.

[update]

Mix09 is over and the secrets have been revealed.

Tim Heuer has a nice summary of Silverlight 3 features.

http://timheuer.com/blog/archive/2009/03/18/silverlight-3-whats-new-a-guide.aspx

Read Full Post »

Are you a sushi veteran?   If so it is probably hard to remember your first few trips to a sushi bar.   Looking at the names, wondering what to order.  Nigiri, Onigiri, Temaki.   Wouldn’t it be wonderful to have an expert on hand to guide you step by step through your dinner order?

image

image 

Phenomblue, a consultancy in Omaha Nebraska, has created a Microsoft Surface proof of concept application for a sushi bar.  The application shows you the sushi items available on the menu (in a rich graphical way), lets you watch videos of the chef preparing the entry and simplifies the ordering process.  Watch the video here.

image

Nice touches in the application

You can tell that a lot of work went into the UI for this application.  Creating a Surface application forces you to rethink your UI design.  There are many elements to consider, but l want to touch on two of them in this post.

Surface is a 360 degree environment.  People can approach the Surface from from any side.  A traditional top oriented UI will disappoint at least 75% of the people working at the table.  In this app small wooden boats float in from opposite directions and stop in front of the user on either side of the  table.   Watch the user touch the boat, it sinks a little into the water.

Do not show help files.   Surface applications strive for an immersive and intuitive experience.  The application should lead the user through the learning process whenever possible.  Observe what happens when the diner drags the sushi to the center platter.

First, a nice animation of a fan appears.

image

Then the orange slider moves up and down, showing the hungry diner how easily they can order five rolls instead of one.   Nice attention to details. The key is that the application works with the patron by using animation in a practical way.

Kudos to Phenomblue.

 

 


Mastering Microsoft Surface Development with WPF

Learn to program the Microsoft Surface today.
Take our intensive five day course

 

A multi-faceted course that delivers loads of content in an instructor-led format. You get lots of lab time and thousands of lines of sample code to take back to work with you. Best of all we bundle the Microsoft Surface™ and WPF content into to one convenient package, so you can learn everything you need in one information packed week.

Next class:

Read Full Post »

I’ve had several WPF projects which required showing a log window.  The idea is to log a constant stream of status messages for a admin to monitor.  You could write your own LogWindow and pass messages into the window but there is an easier way.  Tell your WPF application to run as a ‘Console’ application.

Now this sounds funny but it is easy to do and doesn’t impact your WPF application.

  • Right click the Project Properties node in the Solution explorer or choose the Project menu.

image

  • Change the project Application Type to ‘WPF Console Application.

image

Run the application, you will see two windows; the main WPF window and the console window.

image

Using Console

To write to the console window use Console.Write or Console.WriteLine.  You can also control the size and position of the window and change the font color.

  1:     Console.SetWindowSize(40, 20)
  2:     Console.SetWindowPosition(0, 0)
  3:     Console.Title = "Log Window"
  4: 
  5:     Console.ForegroundColor = ConsoleColor.Yellow
  6:     Console.WriteLine("Log: Something happened")
  7:     Console.ForegroundColor = ConsoleColor.Red
  8:     Console.WriteLine("Details: Database initialized")

 

image

Read Full Post »

What type of application would you create if your target device is a 30 inch table?  Did I mention that it has a hardened top that can take some serious abuse?

Would you have considered a bean bag game?

The clever folks at Razorfish are churning out some interesting Surface apps.  Check out their video archive for more applications.

 


Mastering Microsoft Surface Development with WPF

Learn to program the Microsoft Surface today.
Take our intensive five day course

 

A multi-faceted course that delivers loads of content in an instructor-led format. You get lots of lab time and thousands of lines of sample code to take back to work with you. Best of all we bundle the Microsoft Surface™ and WPF content into to one convenient package, so you can learn everything you need in one information packed week.

Next class:

image

Read Full Post »

MS Demos Surface Physics Engine

James Wood has been quietly hacking away on a new Surface physics engine.  His job is to visualize and create proof of concept applications for Microsoft UK and this is his latest project.

A couple weeks ago James released some videos of his latest research.  Take a look, what do you think?  There are more videos on his site.

In the last couple months there have been  number of excellent Microsoft Surface applications released.  Vertigo, IdentityMine , RazorFish and InterKnowlogy are just a few of the companies creating fascinating Surface applications.  Most of these apps are written in WPF and show how beautiful a WPF interface can be.

 


Mastering Microsoft Surface Development with WPF

Learn to program the Microsoft Surface today.
Take our intensive five day course

 

A multi-faceted course that delivers loads of content in an instructor-led format. You get lots of lab time and thousands of lines of sample code to take back to work with you. Best of all we bundle the Microsoft Surface™ and WPF content into to one convenient package, so you can learn everything you need in one information packed week.

Next class:

image

Read Full Post »

Older Posts »