PDA

View Full Version : Best way to create Windows Explorer type UI



scarleton
22nd August 2010, 04:03
The app is used to display images as they come in from a camera. Similar to Windows Explorer, the main display area will be everything but the left hand side widget. Also this app is also a SDI apps, like Windows Explorer. The main area will simply display the current image. All the controls will be in a side panel on the left.

Also similar to Windows Explorer, there needs to be a splitter between these two primary widgets which allow the left panel to be expanded and contracted, within reason, there does need to be a min and max on it.

The QDockWidget doesn't seem to be the solution because the left panel should NOT have any of the docking/moving/hiding/title features of a docking control.

What is the best way to implement this UI?

Sam

Talei
22nd August 2010, 04:18
I would go with QSpliter in the middle. place your gui elements on the form, layout it in 2 groups, left and right. Next select these 2 groups and press "layout .. in splitter", and do again layout on the form. I assume You are using QDesigner/QtCreator.
From what You write I think splitter is in Your example good way to go, it has no features like i.e. dockwidget but you can save last state of it etc.
Ofcourse you can change size of Your "left group", and when user pas minimal size point it simply hide "left group".
I write here left and right group because You can place whatever You want in it, splitter is basically a container.
Regards

scarleton
22nd August 2010, 14:09
Thank you for the reply.

I am using Visual Studio 2008 and Qt Designer. When I look through the list of containers in Qt Designer, I see the following:

Group Box
Scroll Area
Tool Box
Tab Widget
Frame
Widget
MdiArea
Dock Widget

I am *NOT* seeing a splitter. Looking through all the other sections, the closest thing I find to being part of a splitter is the Vertical Line (Line object) or Vertical Scroll Bar (QScrollBar).

I don't see any QSplitter, what exactly is it called in the QT Designer?

Sam

scarleton
22nd August 2010, 14:15
I see it now, I missed it the first two times I read through your post. Thank you!

scarleton
22nd August 2010, 18:35
I am not seeing any options within the Qt Designer to make a vertical bar appear so that it is clear that it can be resized. How does one go about doing that?

Sam

Lykurg
22nd August 2010, 18:44
This depends on your style. Each style paints the handler in a different way. If you want to customize, then you have to subclass your style and use QStyle::CE_Splitter in QStyle::drawControl().

scarleton
22nd August 2010, 18:53
Lykurg,

Well, I don't rightfully know which style I am using. I am simply using the default and I am on Windows 7. Is there another style I could use that does indicate some how there is a splitter present? If so, how do I go about using it?

Lykurg
22nd August 2010, 19:25
You can set a style via QApplication::setStyle(). Right now I also remember that you can do it easier with style sheets. See "Customizing QSplitter" in the docs. It is QSplitter::handle {}you can use.

Talei
22nd August 2010, 19:30
Or You can also Use QStyle, without subclassing, and use something like this:

QSplitter::handle:horizontal {
width: 1px;
}

QSplitter::handle:vertical {
height: 10px;
}

QSplitter::handle {
image: url(:/resources/myQSpliterVImg.png);
}

Edit. posted to late ...