Custom TextEdit, how to hide TextInput when it goes wide

拟墨画扇 提交于 2019-12-23 01:12:48

问题


I've trying to create custom text field using TextInput element (I need it to use validator and custom style). But I can't hide part of TextInput content expanding (see image). I have similar problem with other elements, while it have root item (container) what contains other items, childrens can be seen if they are placed out of container coordinates. How can I make childrens parts hidden if they're out of root container?

There is the code, but it's actually just template, I've tried to uze z attribute, with no success.

BreezeQuickLineInput.qml

import QtQuick 2.4

Item {
    id: root
    property int fontSize: 18
    property BreezeQuickPalette palette: BreezeQuickPalette
    property string text: "Type here..."
    implicitHeight: input.font.pixelSize*2
    implicitWidth: 196
    Rectangle{
        id: body
        color: "transparent"
        anchors.fill: parent
        border {
            color: palette.plasmaBlue
            width: 1
        }
        TextInput{
            id: input
            anchors {
                fill: parent
            }
            font.pointSize: fontSize
            color: palette.normalText
            selectByMouse: true
        }
    }
}

Appreciated any help. I've checked TextInput documentation, but if you know what topic I should learn please let me know.


回答1:


Well, really wondered when found layer attribute group. I've just turned on layer.enabled and my goal was accomplished. There is some lack of info in Qt documents. Unfortunatelly didn't know the purpose of layer group previously.

BreezeQuickLineInput.qml

import QtQuick 2.4

Item {
    id: root
    property int fontSize: 18
    property BreezeQuickPalette palette: BreezeQuickPalette
    property string text: "Type here..."
    implicitHeight: input.font.pixelSize*2
    implicitWidth: 196
    Rectangle{
        id: body
        color: "transparent"
        anchors.fill: parent
        border {
            color: palette.plasmaBlue
            width: 1
        }
        TextInput{
            id: input
            anchors {
                fill: parent
            }
            font.pointSize: fontSize
            color: palette.normalText
            selectByMouse: true
            layer.enabled: true
        }
    }
}

UPDATE:

My bad, Qt doing business well. My answer was in Item description. From Qt docs:

Item Layers

An Item will normally be rendered directly into the window it belongs to. >However, by setting layer.enabled, it is possible to delegate the item and >its entire subtree into an offscreen surface. Only the offscreen surface, a >texture, will be then drawn into the window.

UPDATE:

Following by BaCaRoZzo comment using clip attribute of Item is less expensive.

clip : bool

This property holds whether clipping is enabled. The default clip value is false.

If clipping is enabled, an item will clip its own painting, as well as the painting of its children, to its bounding rectangle.

So, I just left it there, believe it can help others with same question.




回答2:


just add clip:true inside your text input



来源:https://stackoverflow.com/questions/31225162/custom-textedit-how-to-hide-textinput-when-it-goes-wide

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!