Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Size of image in text



  • Hello, I'm a student and brand new to QML. For a school project I am trying to include an image in a text field. I have the following:

    Text{
                            text: "Some text here. <p><img src='../images/ic_icon_48dp.png'> Descriptive text here"
                            textFormat: Text.RichText
                            color: "white"
                        }
    

    I have tried specifying the height and width in various ways within in the img tag and it has no effect. The image is much to large. What do you suggest?



  • This should work (notice the backticks):

    Text{
        text: `Some text here. <p><img width="64" height="64" src="../images/ic_icon_48dp.png"> Descriptive text here`
                            textFormat: Text.RichText
                            color: "white"
                        }
    

    But are you sure you have to add the image using Text? I mean, if it's only going to show a static image then wouldn't it be better to use the Image component? You would have a lot more control over positioning that way.



  • @Jkimmy Thank you! That works. I think my problem was omitting the quotes around the numbers for height and width.

    What I'm creating is an instruction page that consists of an ordered list of steps and within one of those steps I would like to have a table of icons with their descriptions. I'm very happy to hear suggestions on good ways to accomplish that.



  • Ah, well in that case it seems like using the Text item is a good fit. I thought perhaps you only wanted an image with a caption. If you need extra interactivity you could use a model with a ListView and a TableView but maybe that's complexity you don't need or want.



  • @Jkimmy Thank you for your help.