Flickable Wrapped TextEdit: Difference between revisions

From Qt Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
[[Category:HowTo]]<br />[[Category:Learning]]<br />[[Category:Developing_with_Qt::Qt Quick]]
[[Category:HowTo]]
[[Category:Learning]]
[[Category:Developing_with_Qt::Qt Quick]]


= Flickable Wrapped TextEdit =
= Flickable Wrapped TextEdit =
Line 5: Line 7:
A method of having a Flickable TextEdit with wrapped text within another Item.
A method of having a Flickable TextEdit with wrapped text within another Item.


<code><br />import QtQuick 1.0
<code>
import QtQuick 1.0


FocusScope {<br /> width: 200; height: 200<br /> Rectangle {<br /> property int margins: 20<br /> x: margins; y: margins<br /> width: parent.width - margins*2; height: parent.height - margins*2<br /> border.color: &quot;black&amp;quot;; border.width: 2; radius: 10<br /> color: &quot;#23896363&amp;quot;<br /> Flickable {<br /> id: flick<br /> width: parent.width - 10; height: parent.height;<br /> clip: true<br /> function ensureVisible®<br /> {<br /> if (contentY &gt;= r.y)<br /> contentY = r.y;<br /> else if (contentY+height &lt;= r.y+r.height)<br /> contentY = r.y+r.height-height;<br /> }<br /> TextEdit {<br /> id: message<br /> x: 5;<br /> width: parent.width; height: parent.height;<br /> wrapMode: &quot;WrapAtWordBoundaryOrAnywhere&amp;quot;<br /> onCursorRectangleChanged: flick.ensureVisible(cursorRectangle)<br /> font.pixelSize: 16<br /> }<br /> }<br /> }<br />}<br /></code>
FocusScope {
width: 200; height: 200
Rectangle {
property int margins: 20
x: margins; y: margins
width: parent.width - margins*2; height: parent.height - margins*2
border.color: "black"; border.width: 2; radius: 10
color: "#23896363"
Flickable {
id: flick
width: parent.width - 10; height: parent.height;
clip: true
function ensureVisible®
{
if (contentY >= r.y)
contentY = r.y;
else if (contentY+height <= r.y+r.height)
contentY = r.y+r.height-height;
}
TextEdit {
id: message
x: 5;
width: parent.width; height: parent.height;
wrapMode: "WrapAtWordBoundaryOrAnywhere"
onCursorRectangleChanged: flick.ensureVisible(cursorRectangle)
font.pixelSize: 16
}
}
}
}
</code>


Related forum thread: http://developer.qt.nokia.com/forums/viewthread/1956/
Related forum thread: http://developer.qt.nokia.com/forums/viewthread/1956/

Revision as of 10:35, 25 February 2015


Flickable Wrapped TextEdit

A method of having a Flickable TextEdit with wrapped text within another Item.

import QtQuick 1.0

FocusScope {
 width: 200; height: 200
 Rectangle {
 property int margins: 20
 x: margins; y: margins
 width: parent.width - margins*2; height: parent.height - margins*2
 border.color: "black"; border.width: 2; radius: 10
 color: "#23896363"
 Flickable {
 id: flick
 width: parent.width - 10; height: parent.height;
 clip: true
 function ensureVisible®
 {
 if (contentY >= r.y)
 contentY = r.y;
 else if (contentY+height <= r.y+r.height)
 contentY = r.y+r.height-height;
 }
 TextEdit {
 id: message
 x: 5;
 width: parent.width; height: parent.height;
 wrapMode: "WrapAtWordBoundaryOrAnywhere"
 onCursorRectangleChanged: flick.ensureVisible(cursorRectangle)
 font.pixelSize: 16
 }
 }
 }
}

Related forum thread: http://developer.qt.nokia.com/forums/viewthread/1956/