Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    Unsolved Align text and image in TextArea (rich-text formatting)

    QML and Qt Quick
    3
    6
    2584
    Loading More Posts
    • 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.
    • S
      Schluchti last edited by

      Hi,

      I am trying to vertically align text and a picture inside a TextArea. In order to embed the image in the TextArea I am using rich-text formatting. The following code snippet illustrates this:

      import QtQuick 2.7
      import QtQuick.Controls 2.0
      
      ApplicationWindow {
          visible: true
          width: 500
          height: 500
      
          Rectangle{
              anchors.fill: parent
              color: "black"
              TextArea{
                  width: parent.width
                  text: "<p>This is a really really really really long text with a smiley <img src=\"qrc:/sunglasses.svg\" align=\"middle\" height=25 width=25>. And the really really really long text continues</p>"
                  textFormat: TextEdit.RichText
                  wrapMode: Text.WordWrap
                  color: "white"
              }
          }
      }
      

      Unfortunately text and image are not correctly vertically aligned, see:

      alt text

      Does anyone know what I am doing wrong?

      Bernhard

      Want to read more about Qt?

      https://gympulsr.com/blog/qt/

      Latest Article: https://gympulsr.com/blog/qt/2017/06/14/ios-background-music-qt.html

      E 1 Reply Last reply Reply Quote 0
      • E
        Eeli K @Schluchti last edited by

        @Schluchti See "Supported HTML Subset" in the Qt GUI documentation. I suppose that's valid for QML text components, too.

        1 Reply Last reply Reply Quote 0
        • S
          Schluchti last edited by

          @Eeli-K thanks for your answer, but I think I don't get the point. I already looked into the mentioned documentation but couldn't find anything useful that would help me with my alignment problem. But maybe I am overlooking something in the documentation.

          Want to read more about Qt?

          https://gympulsr.com/blog/qt/

          Latest Article: https://gympulsr.com/blog/qt/2017/06/14/ios-background-music-qt.html

          E 1 Reply Last reply Reply Quote 0
          • E
            Eeli K @Schluchti last edited by

            @Schluchti Sorry, now I see the post wasn't very informative. I should have said it's not possible with that HTML subset. Maybe you can use WebView, but then you are tied to platform-dependent implementations which may differ on HTML rendering.

            1 Reply Last reply Reply Quote 0
            • S
              Schluchti last edited by Schluchti

              Aaah ok, I misinterpreted that on my side ;)

              Unfortunately a WebView isn't an option, as I would also need the rich-text formatting to format entries inside a ListView. Therefore I would like to use a Text component instead of a WebView as it needs way less resources.

              Does anyone have another idea?

              Want to read more about Qt?

              https://gympulsr.com/blog/qt/

              Latest Article: https://gympulsr.com/blog/qt/2017/06/14/ios-background-music-qt.html

              1 Reply Last reply Reply Quote 0
              • L
                literA2 last edited by

                @Schluchti have you tried using the verticalAlignment property and set it to TextEdit.AlignVCenter.

                1 Reply Last reply Reply Quote 0
                • First post
                  Last post