Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Enabling "elide" property in the QML Text element, but in a GridLayout

Tags:

qt

qml

qtquick2

I understand the "width" property must be set implicitly for elide to work. However, I have a Text element in a Layout. I would like to truncate the text when it gets too long. How can I use elide in a Text type when it is in a GridLayout?

import QtQuick 2.5
import QtQuick.Layouts 1.1


Rectangle {
    width: 100
    height: 20

    GridLayout {
        clip: true
        anchors.fill: parent

        rows: 1

        Text{
           text: "veryverylooooooonnnnnnnnnnnggggggggggggggtext"
           width: 50

           elide: Text.ElideRight
        }

    }
}
like image 979
EnriqueH73 Avatar asked Sep 02 '16 20:09

EnriqueH73


1 Answers

Change width: 50 to Layout.preferredWidth: 50

import QtQuick 2.5
import QtQuick.Layouts 1.1
Rectangle {
    width: 100
    height: 20
    GridLayout {
        clip: true
        anchors.fill: parent
        rows: 1
        Text {
           text: "veryverylooooooonnnnnnnnnnnggggggggggggggtext"
           Layout.preferredWidth: 50
           elide: Text.ElideRight
        }
    }
}

Result: enter image description here

like image 194
pier_nasos Avatar answered Nov 15 '22 08:11

pier_nasos