Display a dynamically loaded text/photo block with QML for Android

I am writing an application using the QML of the newly released Qt 5.2 targeted for Android. On one of the screens I need to display an article that is loaded from a server and may undergo changes after the launch of the application. The article would basically be a block of text with images and some basic formatting (bold, italics, larger font in Section titles, etc). What is the best way to render this content?

The ideal would be to write in html and embed in a WebView, but WebKit is not available for Android. Another option would be to write the article in QML and include using a Loader. But it seems to be complicated by text with formatting and line breaking like that. One last way would be to create a C++ class that exposes an interface to QML and has its own rendering mechanics. So it would be possible to use a QTextDocument and play on a QPainter.

What is the best way to do this? What are the problems with the forms that I thought?

Author: Guilherme Bernal, 2013-12-15

1 answers

I found a solution while browsing through the documentation. The element Text it supports more than just text , it can also display a subset of HTML, including image and all necessary formatting. An example:

import QtQuick 2.0

Rectangle {
    width: 360
    height: 360
    Text {
        x: 15
        width: parent.width-30
        textFormat: Text.StyledText
        wrapMode: Text.WordWrap
        text: "<h1>Teste</h1>" +
              "Teste de um <b>parágrafo</b> qualquer.<br>" +
              "<img src='qmltest80.png'></img><br>" +
              "Mais <i>texto</i> aqui."
    }
}

Result:

 4
Author: Guilherme Bernal, 2013-12-17 16:59:03