Image centering in QML TextArea not working

[Fausto01]

Hello everyone, I have this code:

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    TextArea {
        anchors.fill: parent
        textFormat: TextArea.RichText
        text: "<center>TEST TEXT<br>
              <img src=\"https://cdn.pixabay.com/photo/2014/06/03/19/38/road-sign-361514_960_720.png\" height=300 width=300/><br>
              OTHER TEST TEXT</center>"
        readOnly: true
        padding: 0
    }
}

The text is correctly centered while the image is not. Am I doing something wrong?

[mzimmers]

That's not how text and images are normally declared in QML. Use the horizontalAlignment and verticalAlignment properties of the TextArea. And, though I'm not sure what you're trying to do, I think you'd want to use an Image declaration, and set its properties to place it where you want.

[Fausto01]

@mzimmers I'm just trying to render an HTML text. The text comes from a library and it can contains images. The problem is that if you put the html above in a file and open it, everything works fine and the image is centered, if you try to render it in a TextArea the image is not centered.

[mzimmers]

The text comes from a library? Do you mean you're automatically populating the text property of the TextArea, or are you just copying/pasting from the library into your QML?

[Fausto01]

@mzimmers Sorry if I didn't explain it well, what I mean is that the text I've inserted in the TextArea is just for a minimal reproducible example. In my code that text comes from a library that populates it dynamically.
Anyway, should the code I've posted work or is TextArea unable to handle images correctly like a browser? The fact that the image is displayed led me to think this should have worked.

[mzimmers]

It isn't that TextArea isn't able to "handle" Images; you can indeed place images within a TextArea and control their location. The problem is, your image is embedded in the text property of the TextArea. I've never seen this done before, but I think you'd have to use HTML/CSS constructs within the <img> in order to do anything (and I'm not sure this will work).