2

enter image description here

The style from Visual Studio (pictured above) is perfect for a program I'm writing, but I don't know what it's called or if there are any libraries that provide this functionality. The key points of this interface that interest me are

  1. On the left and right sides, there is a task bar-like list of open Windows (Circled on left)
  2. You can pin windows (Circled on right)
  3. There is also a taskbar on the bottom, although it's not visible right now
  4. You can move the side-windows around each other, etc.

My question:

  • Is there a name for this?
  • Are there any open source libraries that provide this functionality?
2
  • 4
    The words to look for are probably "floating" versus "docked". The whole style is known as docked windows as opposed to floating windows which is what you normally get when you create/show a new form/window. You can define a form as a dock site and each dock site can host multiple dockable windows, allowing for an (theoretically) infinite depth of docked windows. Pinning windows and showing a dock site collapsed (left) versus expanded (right) are (should be) standard features of such a docked windows GUI. If developing in VS devexpress.com is the vendor I happen to know about. Nov 9, 2013 at 11:12
  • @MarjanVenema Thanks! I Googled "docked floating windows wpf" and came across AvalonDock which seems to work for me :)
    – Oztaco
    Nov 9, 2013 at 17:39

4 Answers 4

3

I would call it a docking window framework.

Examples:

1
  • FWIW, the OP asked for ”open source libraries”. All but the last one you've listed, AvalonDock, look to be both closed-source and paid. Aug 6, 2016 at 9:45
5

This combination is sometimes called Canvas plus palette. (You could read more about the pattern in the book Designing interfaces by Jenifer Tidwell. It's also briefly mentioned in this article that gives a great overview of different application layouts.

The interface is constructed of a couple of different interaction patterns:

1

Generically/historically speaking, it's called a Multi Document Interface (MDI): http://en.wikipedia.org/wiki/Multiple_document_interface#IDE-style_application_examples

-1

Sidebar or toolbar can both be used to describe this UI element. The best way to determine some other terms is to go to the View menu in the application and see if the UI components have been grouped under a single label.

OmniGraffle uses Sidebar, calling individual components Sidebars, while Axure does not use a name.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.