Important: Please read the Qt Code of Conduct -

[SOLVED ] Using (empty) TextFieldStyle alters size of the TextField

  • Hi,
    if searched quit ab bit for this but haven't found anything about it,
    so here is my problem

    I'm working on a Login-Screen and encountered a strange behavior when using TextFieldStyle.
    As soon as I use TextFieldStyle the size of the TextField is changed.
    Especially annoying is the fact that the height is increased by seemingly 5 pixels and so the TextField looks just to big for the text it contains.

    I'm not sure if this is intended or not.
    And before I start setting sizes manually I'll just ask if I'm doing something wrong here?

    What I was hoping to accomplish is, that the TextField "height" changes with the used font size automatically.

    Here is a working example of this Problem:
    The height of the TextFields is shown as placeholderText so you don't need to count pixels :)
    import QtQuick 2.2
    import QtQuick.Controls 1.2
    import QtQuick.Controls.Styles 1.2
    import QtQuick.Layouts 1.1

    ApplicationWindow {
    id: loginRequest
    visible: true
    title: "Login"
    width: 250
    height: 150

    Item {
    anchors { left: parent.left; right: parent.right; top: }
    anchors.margins: 15
    ColumnLayout {
    id: column
    spacing: 15

      RowLayout {         
        Text {
          text: "Account name:"
        TextField {
          id: accountNameTextField
          placeholderText:  accountNameTextField.height
      } //RowLayout
      RowLayout {
        Text {
          text: "Password:"
        TextField {
          id: passwordTextField
          placeholderText:  passwordTextField.height
          //echoMode: TextInput.Password
          style: TextFieldStyle{} //<== here the problem line
      } //RowLayout

    } // ApplicationWindow

    Thank you all

  • Moderators


    Not sure. But it could be bug in default Desktop Style.
    Try exporting QT_QUICK_CONTROLS_STYLE=Base. It displays correctly.

  • Hi,
    thanks for your replay.
    So the QT_QUICK_CONTROLS_STYLE=Base does influence the appearance, but exactly in the different direction of what I want :/

    With QT_QUICK_CONTROLS_STYLE=Base both TextField look the same, sadly both are 20+5 pix hight.

    Now as you pointed me in the right direction I found the problematic style parts in the TextFieldStyle.qml delivered by Qt:

    @contentHeight: Math.max(control.__contentHeight, 16)@
    @backgroundLoader.implicitHeight || Math.max(25, Math.round(control.__contentHeight * 1.2))@

    Looks like i can not do anything bout this problem while using default style.
    It's just confusing that it still take some parts of the default/base style if I use my own style.
    Might be that I just create a copy of these styles and than overwrite some parts?

    Still the question if this looks like intended behavior or not?

    I'll discus with my team how we'll address this problem.


  • Moderators

    Unfortunately I too haven't explore the details of these styles. I would suggest you to put this question on "Qt Interest Mailing List": You might get the proper way from the Qt Developers directly.

  • I marked the tread as SOLVED, as the problem is now understand.

    Would still be interesting to know if this behavior s intended or not,
    might be the Mailing List will answer this.

Log in to reply