Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Size of image in text
QtWS25 Last Chance

Size of image in text

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
htmlimgsizewidthheight
5 Posts 2 Posters 1.5k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • C Offline
    C Offline
    Cynthia.Roush
    wrote on last edited by
    #1

    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?

    1 Reply Last reply
    0
    • J Offline
      J Offline
      Jkimmy
      wrote on last edited by
      #2

      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.

      C 1 Reply Last reply
      1
      • J Jkimmy

        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.

        C Offline
        C Offline
        Cynthia.Roush
        wrote on last edited by
        #3

        @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.

        1 Reply Last reply
        1
        • J Offline
          J Offline
          Jkimmy
          wrote on last edited by
          #4

          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.

          C 1 Reply Last reply
          0
          • J Jkimmy

            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.

            C Offline
            C Offline
            Cynthia.Roush
            wrote on last edited by
            #5

            @Jkimmy Thank you for your help.

            1 Reply Last reply
            0

            • Login

            • Login or register to search.
            • First post
              Last post
            0
            • Categories
            • Recent
            • Tags
            • Popular
            • Users
            • Groups
            • Search
            • Get Qt Extensions
            • Unsolved