import QtQuick 2.6
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480

    Column {
        id: col
        width: parent.width

        Repeater {
            model: [
                "<l3dx> GrecKo: to be more specific I want to set the width of the Text to be some % of parent.width so that elide will truncate the text for me if it's too big. But I don't want the width to be that wide unless it is necessary. The reason for this is that I want to show a \"badge\" next to the text in some cases, and I want the badge to be placed close to the text",
                "use contentWidth to position the badge"
            ]

            Text {
                id: text
                width: col.width - 20
                text: modelData
                elide: Text.ElideRight

                Rectangle { // badge
                    anchors {
                        left: parent.left
                        leftMargin: text.contentWidth
                    }
                    width: 20
                    height: width
                    radius: width
                    color: "#f0f"
                }
            }
        }
    }
}