Share via


A prototype WPF/Silverlight layout designer

I’ve been thinking recently about how would I write a WPF UI designer that would specifically highlight the new WPF layout paradigm, and not try to mimic the old WinForms paradigm. The old VB6/WinForms designer was built around absolute positioning. It allowed for rapid WYSIWYG prototyping of interfaces, and the Dock/Anchor functionality provided a relatively cheap and easy support for scalable UI. The new WPF designer in Visual Studio is although very powerful, but some people find it difficult to quickly draft a scalable UI that produces clean XAML.

So I wrote a concept prototype of how I would like to design WPF UI:

https://layout.osenkov.com

It runs right in the browser and requires Silverlight 4 (because it needs to copy the output XAML to clipboard). It only focuses on the basics and doesn’t have a lot of features (it’s just a prototype), but I think it can nicely convey my ideas. Nothing of it is new, and both Blend and VS designers support complex layouts with panels and such, but I still decided to write a simple designer without a lot of complex details.

Let me know what you think!

image

Comments

  • Anonymous
    June 02, 2010
    Man, you're a genius, did you know that?

  • Anonymous
    June 02, 2010
    This is a great application! Would it be possible to get the source code to see how you did it? Thanks, Nadav

  • Anonymous
    June 02, 2010
    The comment has been removed

  • Anonymous
    June 02, 2010
    The comment has been removed

  • Anonymous
    June 02, 2010
    That's pretty good stuff, thanks for making this ! It's actually much easier to use than Cider...

  • Anonymous
    June 02, 2010
    What a great idea! I always start by typing my basic XAML layout by hand. Starting in the VS designer or Blend produces weird margins and alignments that you have to edit manually anyway. Up until now I never gave it much thought, but the fact is that we type our XAML because the existing designers don't do the right thing.  

  • Anonymous
    June 03, 2010
    This is great! I don't know why microsoft doesn't ship in .net framework hostable designer for wpf like that for windows forms (althought not well documented) or workflow foundation

  • Anonymous
    June 08, 2010
    Any chance to give source code

  • Anonymous
    June 08, 2010
    Thanks everyone! I'm currently thinking about publishing the source code... if I can't find any better use for it, I'll publish and blog about it. Mikhail: that's the idea. Currently it's not implemented, but knowing the design guidelines, one could do a lot to auto-adjust spacing and margins to conform to them.

  • Anonymous
    June 09, 2010
    Great work

  • Anonymous
    July 05, 2010
    Folks, thanks for your patience. I've published the source code at http://layout.codeplex.com blogs.msdn.com/.../layout-designer-prototype-is-now-open-source-on-codeplex.aspx Enjoy!

  • Anonymous
    July 07, 2010
    шпасибо тебе большое!

  • Anonymous
    September 06, 2010
    Great Job !!! Is there a way to use it in wpf desktop application and not as silverlight ?

  • Anonymous
    April 30, 2011
    哈哈   真的很不错啊!!!