PDA

View Full Version : Button grid with label rotate 90 degree



whitefurrows
19th June 2009, 15:40
I would like to build the follow grid with the qt designer:

http://www.loaditup.de/files/371531.jpg

Now i have two problems:

1.) How can i rotate a label 90 degree?
2.) How can i build a button grid. If a button compressed should be a cross indicated and only one button can be pressed?

Thanks in advance

Lykurg
19th June 2009, 16:20
1.) How can i rotate a label 90 degree?
You have to subclass QLabel and do the painting yourself.

2.) How can i build a button grid. If a button compressed should be a cross indicated and only one button can be pressed?
use QGridLayout with the buttons and setAutoExclusive to them. For the cross on the buttom a) subclass and do the painting or b) use style sheets ": on" and ": off"

whitefurrows
19th June 2009, 17:16
You have to subclass QLabel and do the painting yourself
OK, i try it.


use QGridLayout with the buttons and setAutoExclusive to them. For the cross on the buttom a) subclass and do the painting or b) use style sheets ": on" and ": off"
I think a QGridLayout with buttons looks like dirty. You know a qt widget as MSFlexGrid (http://msdn.microsoft.com/en-us/library/aa228849(VS.60).aspx) or can i use a tablewidget? If your answer is yes how can i customize the tablewidge for the right look?

Lykurg
19th June 2009, 18:01
Optical there is no difference if you use a QGridLayout or a QTableView, but QGridLayout is more easier.
(Quick designer work with grid layout and buttons look like your screenshot)

whitefurrows
20th June 2009, 13:53
Optical there is no difference if you use a QGridLayout or a QTableView, but QGridLayout is more easier.
(Quick designer work with grid layout and buttons look like your screenshot)
Thank you, the screenshot looks good. I can set a cross(image) or color with css (QPushButton:checked{ background-color: red;}) and can controlling the button state with checkable and autoExclusive. But i can't get a look for my QGridLayout like your screenshot.

I have attached my form, please can you modified the form for my?

How can i query or set the state for checked button. I mine a function like setPushButtonChecked( int row, int column ). I need it to save and restore the user input.

Thanks in advanced

wysota
20th June 2009, 15:44
I would create a completely custom widget for this...

whitefurrows
20th June 2009, 18:24
I would create a completely custom widget for this...
OK, and how can i do that? How looks that widget?

wysota
20th June 2009, 22:10
It looks how you implement it to look. Just subclass QWidget and implement what you need. Drawing is simple, handling mouse should be easy as well.

luf
21st June 2009, 11:15
You can also have a look at the Qxt library:

Push button with vertical text:
http://doc.libqxt.org/0.5.0/classQxtPushButton.html

Download it from here: http://libqxt.org/

whitefurrows
21st June 2009, 13:04
Hi,

thank you, Qxt library is nice.

I know how can i subclass QWidget and rotate a label or button 90 degrees.

Im not sure what widget i can implement to bulid a grid of buttons and query the row or column for the checked button. You mine i should draw my own grid? I think if i draw a grid i don't have the functionality of a button. Is it right?

Can you tell me ho can i do that?

wysota
21st June 2009, 16:05
A functionality of the button comes down to clicking that you can handle in three lines of code by reimplementing mouseReleaseEvent().

whitefurrows
22nd June 2009, 17:33
A functionality of the button comes down to clicking that you can handle in three lines of code by reimplementing mouseReleaseEvent().
I can reimplement mouseReleaseEvent(), but is a little bit complex for me to paint a grid of buttons that have a different state and only one butten can be pressed. You know a example for that?

If you don't have a example i have another idea, i subclass a QGraphicsItem and add one QButton. This GraphicItem would add to a QGraphicsScene and display in a QGraphicsView. You think that is OK too?

Lykurg
22nd June 2009, 17:37
You think that is OK too?
If you want the total overkill, then yes:D

whitefurrows
23rd June 2009, 20:10
I have try to paint a button grid and rotate a label.

To rotate the label i have subclass a QLabel and rotate the coordinate system the given angle clockwise 270 degree in the paintEvent(). The label text was rotated but not paint on the right place on the label.

To paint a button grid i have subclass a QWidget an reimplement the paint paintEvent() and mousePressEvent(). The grid looks dirty, code a function to query the row or column is difficult and the grid size is less than real size. The real size circa 15 x 15.

I have attached a example. Can you help me to make it professionally, please?

whitefurrows
24th June 2009, 18:17
Please can you help me, write a function to query or set the state for checked button? It would be nice if i can build the grid a little bit dynamic in size!

I have subclass a QWidget to build a button grid. I build the grid like this:

QGridLayout* layout = new QGridLayout(this);
layout->setMargin(3);
layout->setSpacing(0);

// Create cells
for (int i = 0; i < 9; ++i) {
int col = (i % 3) * 3;
int max_col = col + 3;
int row = (i / 3) * 3;
int max_row = row + 3;

QGridLayout* box = new QGridLayout;
box->setMargin(2);
box->setSpacing(1);
layout->addLayout(box, row / 3, col / 3);

for (int r = row; r < max_row; ++r) {
for (int c = col; c < max_col; ++c) {
//Cell* cell = new Cell(c, r, this, this);
QPushButton* cell = new QPushButton(this);
cell->setCheckable(true);
cell->setAutoExclusive(true);
box->addWidget(cell, r - row, c - col);
m_cells[c][r] = cell;
}
}
}

Here is my solution for all other user to rotate a QLabel:

myLabel.h

#ifndef MYLABEL_H
#define MYLABEL_H

#include <QLabel>

class MyLabel : public QLabel{
Q_OBJECT

public:
MyLabel(QWidget *parent = 0);
~MyLabel();

bool rotateText(float degrees);

private:
float rotation;

protected:
void paintEvent(QPaintEvent *);
void drawRotatedText(QPainter *painter, float degrees, int x, int y, const QString &text);
};

#endif

myLabel.cpp:

#include "myLabel.h"
#include <QPainter>

MyLabel::MyLabel(QWidget *parent) : QLabel(parent)
{
this->rotateText(NULL);
}

bool MyLabel::rotateText(float degrees)
{
if (degrees >=0 && degrees <= 360)
{
rotation=degrees;
update();
return TRUE;
}
return FALSE;
}

void MyLabel::paintEvent(QPaintEvent *)
{
QPainter p;
p.begin( this );
p.setFont(font());
drawRotatedText(&p, rotation, width() / 2, height() / 2, text());
p.end();
}

void MyLabel::drawRotatedText(QPainter *painter, float degrees, int x, int y, const QString &text)
{
painter->save();
painter->translate(x, y);
painter->rotate(degrees);
painter->drawText(0, 0, text);
painter->restore();
}