Borders.qml 1.77 KB
Newer Older
1 2
import QtQuick 2.7

3
// =============================================================================
4 5 6
// Alternative to rectangle border which is a limited feature.
// Allow the use of different borders (size, color...) for each
// rectangle side.
7
// =============================================================================
8

9
Rectangle {
10 11 12 13 14 15 16 17 18 19 20 21 22
  property var borderColor
  property var borderWidth

  property color bottomColor: 'transparent'
  property color leftColor: 'transparent'
  property color rightColor: 'transparent'
  property color topColor: 'transparent'

  property int bottomWidth: 0
  property int leftWidth: 0
  property int rightWidth: 0
  property int topWidth: 0

Ronan Abhamon's avatar
Ronan Abhamon committed
23 24
  default property alias _content: content.data

25 26
  color: 'transparent'

27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
  Rectangle {
    id: bottomBorder

    anchors.bottom: parent.bottom
    color: borderColor != null ? borderColor : bottomColor
    height: borderWidth != null ? borderWidth : bottomWidth
    width: parent.width
  }

  Rectangle {
    id: leftBorder

    anchors.left: parent.left
    color: borderColor != null ? borderColor : leftColor
    height: parent.height
    width: borderWidth != null ? borderWidth : leftWidth
  }

  Rectangle {
    id: rightBorder

    anchors.right: parent.right
49
    color: borderColor != null ? borderColor : rightColor
50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75
    height: parent.height
    width: borderWidth != null ? borderWidth : rightWidth
  }

  Rectangle {
    id: topBorder

    anchors.top: parent.top
    color: borderColor != null ? borderColor : topColor
    height: borderWidth != null ? borderWidth : topWidth
    width: parent.width
  }

  Item {
    id: content

    anchors {
      fill: parent

      bottomMargin: bottomBorder.height
      leftMargin: leftBorder.width
      rightMargin: rightBorder.width
      topMargin: topBorder.height
    }
  }
}