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. Problem with Rectangle border width

Problem with Rectangle border width

Scheduled Pinned Locked Moved Solved QML and Qt Quick
5 Posts 3 Posters 677 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
    Circuits
    wrote on 24 Feb 2020, 21:26 last edited by
    #1

    I am sure this has been asked before so sorry about that. Is it possible to make it so that the shared side is not a 2 pixel thick border? This looks awkward to me:

    Row
    {
      id: titleColumn
    
      width: parent.width
      height: 90
    
      Rectangle
      {
        id: nameTextContainer
    
        width: parent.width/2
        height: parent.height
        border.width: 1
      }
    
      Rectangle
      {
        id: typeTextContainer
    
        width: parent.width/2
        height: parent.height
        border.width: 1
      }
    }
    
    1 Reply Last reply
    0
    • G Offline
      G Offline
      guerinoni
      wrote on 24 Feb 2020, 21:43 last edited by
      #2

      @Circuits

      Rectangle {
              id: leftRect
      
              anchors.fill: parent
              color: "red"
              width: parent.width / 2
              height: parent.height
              border.width: 1
      
              Rectangle {
                  color: "yellow"
      
                  width: parent.width / 2
                  border.width: 1
                  height: parent.height
                  anchors.right: parent.right
                  anchors.top: parent.top
                  anchors.bottom: parent.bottom
              }
          }
      
      O 1 Reply Last reply 24 Feb 2020, 22:15
      1
      • G guerinoni
        24 Feb 2020, 21:43

        @Circuits

        Rectangle {
                id: leftRect
        
                anchors.fill: parent
                color: "red"
                width: parent.width / 2
                height: parent.height
                border.width: 1
        
                Rectangle {
                    color: "yellow"
        
                    width: parent.width / 2
                    border.width: 1
                    height: parent.height
                    anchors.right: parent.right
                    anchors.top: parent.top
                    anchors.bottom: parent.bottom
                }
            }
        
        O Offline
        O Offline
        ODБOï
        wrote on 24 Feb 2020, 22:15 last edited by
        #3

        @guerinoni said in Problem with Rectangle border width:

        anchors.fill: parent
        width: parent.width / 2

        this 2 lines together make no sense to me

        1 Reply Last reply
        0
        • C Offline
          C Offline
          Circuits
          wrote on 24 Feb 2020, 22:35 last edited by Circuits
          #4

          While this does happen to work I am getting some errors about anchoring with rows. I think perhaps I shouldn't even be using a Row? Maybe what I need is an Item? I am going to roll with it for now, thanks guerinoni!

          1 Reply Last reply
          0
          • C Offline
            C Offline
            Circuits
            wrote on 25 Feb 2020, 16:50 last edited by
            #5

            I figured out a way to do this. Well, someone else figured it out and I just applied a Row and Repeater:

            Row 
            {    
              Repeater 
              {
                model: 3
                Rectangle 
                {
                  width: 100
                  height: 40
                  CustomBorder
                  {
                    borderColor: "black"
                  }
                }
              }
            }
            

            where CustomBorder is:

            Rectangle
            {
              property bool commonBorder : true
              
              property int lBorderwidth : 1
              property int rBorderwidth : 1
              property int tBorderwidth : 1
              property int bBorderwidth : 1
              
              property int commonBorderWidth : 1
              
              z : -1
              
              property string borderColor : "white"
              
              color: borderColor
              
              anchors
              {
                left: parent.left
                right: parent.right
                top: parent.top
                bottom: parent.bottom
                
                topMargin    : commonBorder ? -commonBorderWidth : -tBorderwidth
                bottomMargin : commonBorder ? -commonBorderWidth : -bBorderwidth
                leftMargin   : commonBorder ? -commonBorderWidth : -lBorderwidth
                rightMargin  : commonBorder ? -commonBorderWidth : -rBorderwidth
              }
            }
            

            which was created by @ Amit Tomar on SO.

            I have a question. If instead of separating CustomBorder into it's own QML file. Is there a way I can use Component and Loader s/t I can keep CustomBorder inside of main but still refrence it the same way ie:

            Rectangle
            {
              CustomBorder
              {
              }
            }
            

            is that possible?

            1 Reply Last reply
            1

            1/5

            24 Feb 2020, 21:26

            • Login

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