@timday I am not quite sure, what you mean by this. I am new to qml, examples help me a lot understanding all these things.
Anyways, I figured out a working solution. The only thing I maybe could think about, how to use flicking not only in the column but also in the editor itself. At the moment, it isn't possible, because the editor has the focus (which he needs for things like marking text)
Pane {
Item {
id: editorItem
anchors.fill: parent
Flickable {
id: flickable
anchors.fill: parent
flickableDirection: Flickable.VerticalFlick
contentWidth: parent.width
contentHeight: editor.height
ColumnLayout {
id: lineNumber
spacing: 0
Repeater {
id: lineNumberRepeater
model: editor.lineCount
Text {
text: index + 1
color: 'lightgray'
font.pointSize: editor.font.pointSize
}
}
}
TextArea.flickable: TextArea {
id: editor
anchors.left: lineNumber.right
topPadding: 0
leftPadding: 20
rightPadding: 20
bottomPadding: 0
background: Rectangle {
color: "transparent"
border.color: "transparent"
}
font.pointSize: 18
persistentSelection: true
selectByMouse: true
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
Keys.onPressed: {
if(event.key === Qt.Key_PageUp)
flickable.flick(0, 60*Math.sqrt(flickable.height))
if(event.key === Qt.Key_PageDown)
flickable.flick(0, -60*Math.sqrt(flickable.height))
}
}
ScrollBar.vertical: ScrollBar { }
}
Documenthandler {
id: documenthandler
document: editor.textDocument
cursorPosition: editor.cursorPosition
selectionStart: editor.selectionStart
selectionEnd: editor.selectionEnd
}
}
}
The solution is simply to put everything in the Flickable and to avoid nesting the TextArea into a RowLayout because TextArea.flickable: TextArea {} won't be working. Instead, I use anchors for the layout.
Would be interested if there is a solution for the nesting
Flickable {
RowLayout {
ColumnLayout {
}
TextArea.flickable: TextArea { //not possible
}
}
}
I have seen in the Documentation that it is sometimes possible to write down, that TextArea is nested -> Something Like TextArea.flickable: RowLayout.TextArea ... don't know