NOV
30
2005

Advanced Qt layouts

One of the cool things about Qt that seems to be ignored is the QLayout classes. Most of us are content to use simple things like QHBox and QVBox layouts to get what we want. But what happens when you need more complex behavior? Well the trolls gave us the ability to create new layouts with a trivial amount of code...

One example could be some sort of touch screen menu. Well in this case there is a center object that has a whats this description of a menu item. Then there are buttons that should flow around it. One approach could be to hard code this. The problem here is when the touch screen updates from 800x600 to 1024x768 your screen will look funny. Worse, if you need to dynamicly add and remove buttons, the problem is more cumbersome. The other approach is to use Qt's awesome layout engine.

I basicly subclassed QLayout and made my own layout function that would position the widgets around a central widget. This way I could just create my controls and place them on the layout as I pleased:

ArcLayout *arc = new ArcLayout(this, 6, 6);
for( int idx = 0; idx < maxbuttons; ++idx)
{
QFrame *button = new QFrame(this);
button->resize(200,50);
button->setFrameStyle(QFrame::Box|QFrame::Plain);
button->setLineWidth(4);
button->setMidLineWidth(3);

arc->addWidget(button);
m_buttons.append(button);

}
QFrame *blah = new QFrame(this);
blah->setFrameStyle(QFrame::Box|QFrame::Plain);
blah->setLineWidth(4);
blah->setMidLineWidth(3);
blah->resize(150,150);
blah->lower();
arc->setFocusWidget(blah);

This gave me this: [image:1655]

This is a simple case, but I think this shows the possibilities of what Qt can do. Ironicly I spent longer on this blog entry than I did writing this layout, so we can see how simple this is.
Now if only Qt designer could handle custom layouts ;)

Comments

Hi,

That makes me think of an idea I had (but I haven't time nor skills to implement it) about reducing the supposed bloating of GUIs in KDE.
I thinked that some toolbars could be replaced by some sort of popup widget that would place the toolbar buttons on one or more circle(s) around the mouse pointer. This would be very easy to access frequently used actions, something between toolbar and keyboard shortcut.

Kleag


By kleag at Wed, 11/30/2005 - 14:54

on PDAs where the application has complete focus and space was paramount. they would center the menu on the screen, and the items would circle it. I am not sure how useful this would be on the screen, but in a kiosk mode, it may work. for touch screens the "pie" menus seem to work VERY well though... may warrent some more research ;)

this menu, was more of a full screen menu, where I would just add items. then when they did a mouse over the button the center square would show some rich text.


By Ian Reinhart Geiser at Wed, 11/30/2005 - 15:06

Something like your idea has been implemented in the past as "pie menus", primarily by wild & crazy guy Don Hopkins, see http://www.piemenu.com/ and [w:Pie menu|Wikipedia article]. I find they're well suited to short contextual menus and after some practice activating them becomes gesture-like ("down and sideways for Add user name to buddy list")


By skierpage at Wed, 11/30/2005 - 21:28