PDA

View Full Version : Qt Complex layout for a note-taking app



robi9011235
9th February 2016, 08:59
I have a qt app that uses a very bad technique for resizing. The current approach is to put all the main elements inside a form, and when resizing is happening, change the size and place of the objects through custom code. It's an ugly, hard to maintain, and not good for future features approach.

What should be done is to use the tools qt have for handling layouts. I've tried and failed. I would like your help with it. e You can take a look at the app here: https://github.com/nuttyartist/notes

The source is there. Also, here is a screenshot from the qtcreator form:
http://i.imgur.com/glGn3ES.png?1

I'm okay with creating the layout through code.

anda_skoa
9th February 2016, 11:03
You need to start creating the interface top down.

You obviously want the top level to be layouted horizontally, having a left side and a right side divded by a line.
Btw, you might want to consider using a splitter instead of the line.

On the left side widget you add the text edit, the two buttons and the label.
Then you CTRL+Left Click the buttons and the label and click the "horizontal layout" button.
Then select the left side widget and click the vertical layout button.

Repeat similar steps for the left side widget.

Cheers,
_

robi9011235
9th February 2016, 15:03
You need to start creating the interface top down.

You obviously want the top level to be layouted horizontally, having a left side and a right side divded by a line.
Btw, you might want to consider using a splitter instead of the line.

On the left side widget you add the text edit, the two buttons and the label.
Then you CTRL+Left Click the buttons and the label and click the "horizontal layout" button.
Then select the left side widget and click the vertical layout button.

Repeat similar steps for the left side widget.

Cheers,
_


I am struggling to implement that in a way that my app will work like it's working now.
Here is what I got: http://i.imgur.com/6pAFTB0.png
But there are few problems:
1. I want widgets to be at a fixed size I decide. Fixed policy isn't doing it.
2. The space between widgets, between widget and the main window and between layouts to the line should not be there.
3. The closse-minimze-maximize buttons not sit in the way they should. they shouldn't be on the same 'y' axis as the plus and trash buttons, but above them.

anda_skoa
9th February 2016, 19:23
1. I want widgets to be at a fixed size I decide. Fixed policy isn't doing it.

You can set a fixed size



2. The space between widgets, between widget and the main window and between layouts to the line should not be there.

Layouts have margins by default, you can set them to 0



3. The closse-minimze-maximize buttons not sit in the way they should. they shouldn't be on the same 'y' axis as the plus and trash buttons, but above them.
You could add a vertical spacer to the right hand side layout to move the buttons further down.

Or you don't use a left/right approach but a grid layout.

Cheers,
_

d_stranz
10th February 2016, 00:20
You can set a fixed size

But be aware that fixed sizes can be problematic. I recently got a 4K monitor. I found that the default font size was too small to be easily readable, so I changed it to 125% magnification. As a consequence, everywhere that I had specified fixed sizes for text in my layouts was now too small for the text. The pixel sizes of the layouts hadn't changed, but effectively the font size did.

robi9011235
15th February 2016, 12:41
You can set a fixed size


Layouts have margins by default, you can set them to 0


You could add a vertical spacer to the right hand side layout to move the buttons further down.

Or you don't use a left/right approach but a grid layout.

Cheers,
_


But be aware that fixed sizes can be problematic. I recently got a 4K monitor. I found that the default font size was too small to be easily readable, so I changed it to 125% magnification. As a consequence, everywhere that I had specified fixed sizes for text in my layouts was now too small for the text. The pixel sizes of the layouts hadn't changed, but effectively the font size did.

I should have prbobably stated that earlier, the prbolem is solved, pushed changes to the repo.
Thanks.