positionAt in QML TextEdit

I am trying to use the methode [B]positionAt[/B] of the QML [B]TextEdit[/B] object to determin the text a user clicked onto.
The TextEdit text is HTML including a table (see [url]http://www.ruinelli.ch/wordpress/wp-content/uploads/2012/03/MiniBible_10.png[/url] for an example).

Sadly [B]positionAt[/B] only gives me unusable values. When clicking in some areas of the text, it even gives the same char pos for a whole word.

Has anybody successfully used [B]positionAt[/B] before?
It seems to be brocken or at least not well documented :(


To use the oposit function [B]positionToRectangle[/B] I learned that I have to drop all non visible tags of the HTML text.
Sadly there is no note about this in the documentation nor an example...

Hi

Try TextArea from QComponents it has the same method. However i doubt i behaves differently. The reason of the problem i think the text wrapping mode. Try other approach : if you need to react on user's click in the text --- use links! check TextEdit :: onLinkActivated ( string link ) from the documentation . You will need to make the links invisible in the text though, i hope styling may help.

And as the last resort -- use list to format and display your content

Thank you for your hints.
I will have to digg a bit more into this.
Sadly even with the ways you suggest it does not work as desired:
[LIST][*]With TextAreas, it seems to work a bit better. Now I get more or less the right position. Maybe I will have to remove the \n or other non visible elements like double spaces. (on the other hand, with TextArea somehow I can not scroll anymore, i guess it doesn’t know its content height).[*] I can not use Links, because the TextEdit has to be read only. (If not read only, the virtual keyboard gets shown).[*] I can not use lists, because I do not want to add a line wrap after each bible verse.[/LIST]

What did you exactly mean with the wrapping mode issue?
Could this somehow be worked around?

Thank you very much for any hints!

Hi CaCO3

[B]In contrast to what the documentation says TextArea does not support scrolling[/B] -- i have checked. As workaround try this code below

[CODE]
import QtQuick 1.1
import com.nokia.meego 1.0

Page {

Flickable {
id: scrolled

width: parent.width
height: parent.height
contentWidth: textblock.paintedWidth
contentHeight: textblock.paintedHeight

TextEdit {
id: textblock
textFormat: Text.RichText
wrapMode: TextEdit.Wrap

text: "1 line <br/>"+
"2 line <br/>"+
"3 line <br/>"+
"4 line <br/>"+
"5 line <br/>"+
"6 - some sample text (<a href=\"verse#1\">link to verse#1</a>)<br/>"+
"7 line <br/>"+
"8 line <br/>"+
"9 line <br/>"+
"10 some other sample text (<a href=\"verse#2\">link to verse#2</a>)<br/>"+
"11 line <br/>"+
"12 line <br/>"+
"14 line <br/>"+
"15 line <br/>"+
"16 line <br/>"+
"17 line <br/>"+
"18 line <br/>"+
"19 line <br/>"+
"20 line <br/>"
onLinkActivated: console.log(link) //TODO: process 'link' variable
// note the variable is embedded to QML
// i.e. -- no declaration is needed in your code
}
}

ScrollBar {
scrollArea: scrolled;
width: 10
anchors { right: parent.right; top: parent.top; bottom: parent.bottom }
}
}

[/CODE]

and you will need ScrollBar.qml definition. i took it from Qt source code gitorius repo. You need to create ScrollBar.qml and put the following into it:

[CODE]
// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.1

/****************************************************************************
**
** Copyright (C) 2010 Nokia Corporation and/or its subsidiary(-ies).
** All rights reserved.
** Contact: Nokia Corporation (qt-info@nokia.com)
**
** This file is part of the QtDeclarative module of the Qt Toolkit.
**
** $QT_BEGIN_LICENSE:LGPL$
** No Commercial Usage
** This file contains pre-release code and may not be distributed.
** You may use this file in accordance with the terms and conditions
** contained in the Technology Preview License Agreement accompanying
** this package.
**
** GNU Lesser General Public License Usage
** Alternatively, this file may be used under the terms of the GNU Lesser
** General Public License version 2.1 as published by the Free Software
** Foundation and appearing in the file LICENSE.LGPL included in the
** packaging of this file. Please review the following information to
** ensure the GNU Lesser General Public License version 2.1 requirements
** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
**
** In addition, as a special exception, Nokia gives you certain additional
** rights. These rights are described in the Nokia Qt LGPL Exception
** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
**
** If you have questions regarding the use of this file, please contact
** Nokia at qt-info@nokia.com.
**
**
**
**
**
**
**
**
** $QT_END_LICENSE$
**
****************************************************************************/

import QtQuick 1.0

Item {
id: container

property variant scrollArea
property variant orientation: Qt.Vertical

opacity: 0

function position()
{
var ny = 0;
if (container.orientation == Qt.Vertical)
ny = scrollArea.visibleArea.yPosition * container.height;
else
ny = scrollArea.visibleArea.xPosition * container.width;
if (ny > 2) return ny; else return 2;
}

function size()
{
var nh, ny;

if (container.orientation == Qt.Vertical)
nh = scrollArea.visibleArea.heightRatio * container.height;
else
nh = scrollArea.visibleArea.widthRatio * container.width;

if (container.orientation == Qt.Vertical)
ny = scrollArea.visibleArea.yPosition * container.height;
else
ny = scrollArea.visibleArea.xPosition * container.width;

if (ny > 3) {
var t;
if (container.orientation == Qt.Vertical)
t = Math.ceil(container.height - 3 - ny);
else
t = Math.ceil(container.width - 3 - ny);
if (nh > t) return t; else return nh;
} else return nh + ny;
}

Rectangle { anchors.fill: parent; color: "Black"; opacity: 0.5 }

BorderImage {
source: "scrollbar.png"
border { left: 1; right: 1; top: 1; bottom: 1 }
x: container.orientation == Qt.Vertical ? 2 : position()
width: container.orientation == Qt.Vertical ? container.width - 4 : size()
y: container.orientation == Qt.Vertical ? position() : 2
height: container.orientation == Qt.Vertical ? size() : container.height - 4
}

states: State {
name: "visible"
when: container.orientation == Qt.Vertical ? scrollArea.movingVertically : scrollArea.movingHorizontally
PropertyChanges { target: container; opacity: 1.0 }
}

transitions: Transition {
from: "visible"; to: ""
NumberAnimation { properties: "opacity"; duration: 600 }
}
}
[/CODE]

in addition to that create a png picture sizeof 10 X 10 pixels save it as "scrollbar.png" and put to QML source so ScrollBar.qml can find that.

The demo is working for me as for Meego as Symbian

Regards,
Igor

Hi izinin

Thank you very much for taking your time to look into this.
How ever I am a bit confused about your example code.
You show how to use a [B]TextEdit[/B] with links and a self made scroll bar.
How ever, as I stated, I can not use TextEdit with links, because the virtual keyboard would be shown. As long as there is no way to hide the keyboard permanently, links in [B]TextEdit[/B] are no option.
As you stated (and many other people also figured out), [B]TextArea[/B] does not support scrolling. Now, if we could get it scrolling somehow, I think I could use it to get the clicked position in the text.

Would there be an option to create myself a QML component like the [B]TextEdit[/B] but having the [B]positionAt[/B] function as in the [B]TextArea[/B]?
Note: since I am not using C++, I am not able to do it in there.
There is an other app, MeeBible which somehow solved this issue with C++, but that is not an option for me.

All right, I got it working now.

To set the TextArea to the right size (so all contained text is visible), you have to do this:
[CODE]myTextArea.height= myTextArea.implicitHeight[/CODE]

Also, the whole block is in a flickable and I also have a scrollbar:
[CODE]ScrollDecorator {
flickableItem: flickable
}[/CODE]

After removing all double whitespaces and new lines, the [B]positionAt[/B] now seems to more or less return the right position.

@izinin:
Thank you very much in any way, you brought me to the right path!