Forums

OverviewFelgo 2 Support (Qt 5) › Match button sizes

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #17049

    Lorne

    I’ve got a fairly simple problem.  I have two buttons that are vertically stacked in a ColumnLayout (code is below).  The text is different and I want both buttons to have the same width.  How would I do that?  I can’t seem to find a watch to make the width of a button to be controlled by anything other than the width of the text.

    ColumnLayout {
      id: column
    
      AppButton {
        text: qsTr("short text");
        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
      }
    
      AppButton {
        text: qsTr("much much longer text");
        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
      }
    }

     

    #17050

    Marcin

    Hi,
    I didn’t use this element too much but from quick look at documentation I see something like minimumWidth.
    Would that help in your case? If you set minimum width on buttons, where minimum width would be dictated by button with longer text.

    #17058

    Günther
    Felgo Team

    Hi!

    The total AppButton width is calculated based on the text size, as well as padding and margin settings. As Marcin concluded, you can use the minimumWidth setting to increase the button width for a shorter text.

    #17064

    Lorne

    I’ve used minimumWidth, but using a static number doesn’t work.  The width will be different depending on device/screen size.  I also tried to set the minimum width in the Component.onCompleted() signal, but the size of the buttons have not bee calculated at that point.  Is there a signal I can hook into once the size of the button has been fully calculated once it’s been put out on the screen?

    #17070

    Günther
    Felgo Team

    Hi Lorne!

    You can specify a density-independent width by using the app.dp() function. The buttons then have the same width across all devices.

    If you want to specify different sizes for e.g. phone vs. tablet, you can do so by checking e.g. app.tablet and choosing an appropriate width then.

    Best,
    Günther

     

Viewing 5 posts - 1 through 5 (of 5 total)

RSS feed for this thread

You must be logged in to reply to this topic.

Voted #1 for:

  • Easiest to learn
  • Most time saving
  • Best support

Develop Cross-Platform Apps and Games 50% Faster!

  • Voted the best supported, most time-saving and easiest to learn cross-platform development tool
  • Based on the Qt framework, with native performance and appearance on all platforms including iOS and Android
  • Offers a variety of plugins to monetize, analyze and engage users
FREE!
create apps
create games
cross platform
native performance
3rd party services
game network
multiplayer
level editor
easiest to learn
biggest time saving
best support