XML, Highlighting and Model/View

[caduel]

the spinBox has nothing to do with drawing; it is (as you guessed) the editor created by createEditor.
The cells that are not edited do not show a spin box!

paint: looks for a cell that is not being edited
createEditor: the editor (which often is laid over the edited cell, giving the impression of a different painting while being edited. it is just an impression. the cell is always painted by paint.)

HTH

[aamer4yu]

Well, started reading Model/View architecture in Qt.. but I wanted some immediate results.
So I tried the following -
copied the simple DOM example, and modified it that I show attributes in column 0 along with tag name. So something like an XML Tree. Now moving on with delegates, made a little progress.
I overrided the drawDisplay method of QItemDelegate -

void XMLDelegate::drawDisplay ( QPainter * painter, const QStyleOptionViewItem & option, const QRect & rect, const QString & text ) const
{
	//QItemDelegate::drawDisplay(painter,option,rect,text);
 
	QColor colors[3] = {Qt::black,Qt::red,Qt::blue};
	QColor red(Qt::red);
	QColor blue(Qt::blue);
	QColor black(Qt::black);
 
	QString textToDisplay = option.fontMetrics.elidedText(text,Qt::ElideNone,rect.width());
	int len = textToDisplay.length();
	int x,y;
	x = rect.x();
	y = rect.y()+10;
	for(int i=0;i<len;i++)
	{
		painter->setPen(colors[i%3]);
		painter->drawText(x,y,QString(textToDisplay[i]));
		x += option.fontMetrics.width(textToDisplay[i]);
	}
}

void XMLDelegate::drawDisplay ( QPainter * painter, const QStyleOptionViewItem & option, const QRect & rect, const QString & text ) const
{
	//QItemDelegate::drawDisplay(painter,option,rect,text);

	QColor colors[3] = {Qt::black,Qt::red,Qt::blue};
	QColor red(Qt::red);
	QColor blue(Qt::blue);
	QColor black(Qt::black);

	QString textToDisplay = option.fontMetrics.elidedText(text,Qt::ElideNone,rect.width());
	int len = textToDisplay.length();
	int x,y;
	x = rect.x();
	y = rect.y()+10;
	for(int i=0;i<len;i++)
	{
		painter->setPen(colors[i%3]);
		painter->drawText(x,y,QString(textToDisplay[i]));
		x += option.fontMetrics.width(textToDisplay[i]);
	}
}

To copy to clipboard, switch view to plain text mode 

By this am able to display text in alternate colors. Now thing is,,, I havent handled it for Wrap mode . And without that one display wont look good ...

Isnt there some simple way to do this ? Currently to display xml, we use Internet explorer and Navigate function for a xml file. It does display the xml with highlighting. But I want to add context menu to sucha tree, and be able to compute xpath of the node clicked...


Can someone suggest a simpler way ?? Or do I have to do it the hard way

[wysota]

Could you provide a screenshot or a mockup of what you want? I think your problem is easy to solve, but first I need to make sure what you want

[aamer4yu]

Even I think the problem must be easy to solve, may be am moving in wrong direction , may be not

Well, I will restate my problem with snapshots and also give an idea as what I am able to achieve till now.

First, the problem :
I need to display xml data as it displays in internet explorer. However, additionaly I want to be able to show a context menu and be able to extract the Xpath of the node that was right clicked.
Refer : required functionality.jpg
I know I can achieve this by -
1) Make a tree out of xml
2) apply syntax highlighter to each row
3) Handle multi line
But I dont know whats the best solution to achieve above steps


Now the things I have tried till now :
1) I subclassed QTreeWidget and QTreeWidgetItem and made a Tree from XML Data. This works fine, shows the data like in explorer. I override drawBranches() of treewidget.
But problem is, I can show it only in one Color.

2) I modified the Simple DOM Model example, and returned text in column 0 only instead of Column 1 and 2. I also made a custom delegate where I overrided drawDisplay() and was able to show text in different colors. Problem with this solution is, I see row text in single line only, and the text is clipped if its longer than the rect width.
Refer try 2.jpg

Now how do I handle multiple line in a single cell ?? Like in iexplorer, if we resize the window, the xml data gets wrapped properly. How do I achieve this functionality ??

[caduel]

assuming you do the drawing with QTextDocument; use setTextWidth, pass the size of the rectangle passed to QAbstractItemDelegate:aint (in QStyleOptionViewItem)

HTH

[aamer4yu]

Dont assume !!
Am not using QTextDocument. If only I cud get QtextDocument for a model index, i cud have set the syntax highlighter for it.

What I am doing is setting a ItemDelegate for the Tree View in Simple DOM Model example.
am ONLY overriding ItemDelegate::drawDisplay() function. The code is same as posted few posts back.

Now say I have text = "Hello, How are you";
If i need to display each word in different color, I need to first write Hello with one color, then get the width occupied by Hello, and write How with other color and so on. I just cant simply write the whole text in one go Can I ??
Also see drawDisplay() in QItemDelegate.cpp. There are many things to consider, which are going above my head for the time being

Also I made a small parser inside the drawDisplay() function, and am able to get xml like highlighting
But prob remains... single line doesnt gets wrapped..
Another prob is, values are treated as child nodes, So if i want to display text vlaue of a node like <node> nodeValue </node> , am not able to do it. I will have to look in model how to prevent adding row for #text nodes

[caduel]

ok, how about

i) using a QItemDelegate in the QTreeWidget approach, too?

ii) pass Qt::TextWordWrap to QPainter::drawText

in YourItemDelegate:aint(...):
I would not do the algorithm for drawing colored text myself (unless I had to, that is).
Doesn't a simple

painter->translate(option.rect.topLeft());
QTextDocument doc;
QSyntaxHighlighter yourHighlighter(&doc);
// if you want wrapping text
//   doc.setTextWidth(option.rect.width());
QString text=index.data().toString(); // assuming you can get the xml to display that way
doc.setHtml(text);
doc.drawContents(painter);

painter->translate(option.rect.topLeft());
QTextDocument doc;
QSyntaxHighlighter yourHighlighter(&doc);
// if you want wrapping text
//   doc.setTextWidth(option.rect.width());
QString text=index.data().toString(); // assuming you can get the xml to display that way
doc.setHtml(text);
doc.drawContents(painter);

To copy to clipboard, switch view to plain text mode 

work for you?
(Maybe it is inefficient, but it is easy to implement. And maybe it is fast enough, too.

[wysota]

I'm not sure if a tree is the best way to visualize the document this way, but since you already have most things done, let's keep it this way.

Drawing wrapped text is easy - use a variant of QPainter::drawText() that takes flags as one of its parameters and pass it a flag to wrap text. But... this way you won't be able to highlight syntax...

Another way is to use QTextLayout and QTextLine which is quite straightforward, but... no highlighting either.

Probably the best way would be to have a QTextDocument that the delegate would use to render the xml. You would apply a piece of text as the document, trigger the highlighter, render the document, apply a new piece of text, etc. Just make sure not to create a new document in each pass of the delegate - reuse the old one instead.

[aamer4yu]

@ Caduel
Thanks a lot !!

doc.drawContents(painter);

Thats what I needed so badly

Now I can use this delegate with the Simple DOM Model example, and it works. I haven't tried multi line yet, but I guess there wont be any problem


@Wysota
Caduel also suggested what u said, except for the doc reuse :P . Well, now I guess I can make things work.



I have my QTreeWidget and QTreeWidgetItem subclasses working now. But they take time to populate the tree, and hence not efficient. In DOM model example I found the child items are created as and when the nodes are expanded. Gradually I will like to move my code to DOM Model, along with syntax highlighting


I need to know 2 things -
1) Is there any widget/ text edit, where I can set color of each char individually ?? Its just a thought to avoid using a highlighter.

2) With the simple DOM Model, now I can set the syntax highlighter. Only thing is nodeValues are represented as child items in tree . How to avoid this ?

BTW Wysota, U said -

I'm not sure if a tree is the best way to visualize the document this way, but since you already have most things done, let's keep it this way.

Can you suggest the better way ? I know filling a tree myself is inefficient. The recursion takes a long time.

[caduel]

without having tried it out:

1) Is there any widget/ text edit, where I can set color of each char individually ?? Its just a thought to avoid using a highlighter.

You can do that with a QTextEdit

2) With the simple DOM Model, now I can set the syntax highlighter. Only thing is nodeValues are represented as child items in tree . How to avoid this ?

You can modify the model. Adjust the data() and rowCount() methods to
data(): include the text of the childNodes() that satisfy isText()
rowCount(): do not count child nodes that satisfy the condiftion of above

Alternative:
wrap the dom-model in another model that provides said difference.

[wysota]

Can you suggest the better way ? I know filling a tree myself is inefficient. The recursion takes a long time.

Yes, QTextEdit with implemented ability to collapse and expand levels of the DOM tree. This involves some work unfortunately...

As for the tree and the lag you get, you can do it in another thread or in chunks separated by event processing.

[aamer4yu]

Quote:
1) Is there any widget/ text edit, where I can set color of each char individually ?? Its just a thought to avoid using a highlighter.
You can do that with a QTextEdit

How can I do it with QTextEdit ??

Also your reply to 2nd point is good.... I have tried with simple DOM Model and got sucess...now just trying to handle comments .


@Wysota

Yes, QTextEdit with implemented ability to collapse and expand levels of the DOM tree. This involves some work unfortunately...

too much work I guess

Well Now I have 2 ways -
1) Subclassing QtreeWidget/QtreeWidgetItem
2) modify simple DOM example.

As for the highlighter , it will work with both.
And common problem is resizing ROW according to content.
I tried using QTextDoc.setTextWidth(). But it works only within the rect provided by the drawDisplay function. How do I resize the row so that whole text is displayed ??

Am quite close to my goal I guess,,, thanks to you both

[aamer4yu]

I am stuck with setting row height. I guess if I am able to set row height for each item, I can display my contents properly.
I tried setting sizeHint() in ItemDelegate, and also tried rowHeight, and indexRowSizeHint for QtreeWidget... but the rowHeight and indexRowSizeHint are never called . Also I tried setting setWordWrap(true) for tree widget, but no use

Can someone give me idea where to move ?? or what to look for ?

[caduel]

Have you tried QAbstractItemModel::data with role=Qt::SizeHintRole?