complete fit most & just with children rect & parent width, height

This commit is contained in:
王劲鹏
2021-03-15 15:30:17 +08:00
committed by osborn
parent 6c8c3d69bc
commit 23882e6088
14 changed files with 310 additions and 60 deletions

View File

@@ -1,9 +1,61 @@
import QtQuick 2.12
import QtQuick.Controls 2.5
import QtQuick.Layouts 1.15
Flex {
flexDirection: "row"
justifyContent: "flexStart"
alignItems: "flexStart"
alignContent: "flexStart"
import "util.mjs" as Util
Rectangle {
property var uuid: Util.uuidv4()
property int widthSpec: 0
property int heightSpec: 0
property int childrenRectWidth: childrenRect.width
property int childrenRectHeight: childrenRect.height
property var tag: "HLayout"
onWidthChanged: () => {
console.log(tag, uuid + " onWidthChanged: " + this.width)
}
onHeightChanged: () => {
console.log(tag, uuid + " onHeightChanged: " + this.height)
}
onWidthSpecChanged: () => {
console.log(tag, uuid + " onWidthSpecChanged: " + this.widthSpec)
console.log(tag, uuid + " parent width: " + parent.width)
if (this.widthSpec === 2) {
this.width = parent.width
}
}
onHeightSpecChanged: () => {
console.log(tag, uuid + " onHeightSpecChanged: " + this.heightSpec)
console.log(tag, uuid + " parent height: " + parent.height)
if (this.heightSpec === 2) {
this.height = parent.height
}
}
onChildrenRectChanged: () => {
console.log(tag, uuid + " widthSpec: " + widthSpec + " heightSpec: " + heightSpec)
console.log(tag, uuid + " childrenRect: " + uuid + " onChildrenRectChanged: " +childrenRect)
this.childrenRectWidth = childrenRect.width
this.childrenRectHeight = childrenRect.height
if (this.widthSpec === 1) {
this.width = childrenRectWidth
}
if (this.heightSpec === 1) {
this.height = childrenRectHeight
}
}
color: 'transparent'
RowLayout {
spacing: 0
}
}

View File

@@ -1,12 +1,6 @@
import QtQuick 2.12
import QtQuick.Controls 2.5
Flex {
flexDirection: "row"
justifyContent: "flexStart"
alignItems: "flexStart"
alignContent: "flexStart"
flexWrap: "noWrap"
Rectangle {
color: 'cyan'
}

View File

@@ -1,6 +1,57 @@
import QtQuick 2.12
import QtQuick.Controls 2.5
import QtQuick.Layouts 1.15
Flex {
import "util.mjs" as Util
Rectangle {
property var uuid: Util.uuidv4()
property int widthSpec: 0
property int heightSpec: 0
property int childrenRectWidth: childrenRect.width
property int childrenRectHeight: childrenRect.height
property var tag: "Stack"
onWidthChanged: () => {
console.log(tag, uuid + " onWidthChanged: " + this.width)
}
onHeightChanged: () => {
console.log(tag, uuid + " onHeightChanged: " + this.height)
}
onWidthSpecChanged: () => {
console.log(tag, uuid + " onWidthSpecChanged: " + this.widthSpec)
console.log(tag, uuid + " parent width: " + parent.width)
if (this.widthSpec === 2) {
this.width = parent.width
}
}
onHeightSpecChanged: () => {
console.log(tag, uuid + " onHeightSpecChanged: " + this.heightSpec)
console.log(tag, uuid + " parent height: " + parent.height)
if (this.heightSpec === 2) {
this.height = parent.height
}
}
onChildrenRectChanged: () => {
console.log(tag, uuid + " widthSpec: " + widthSpec + " heightSpec: " + heightSpec)
console.log(tag, uuid + " childrenRect: " + uuid + " onChildrenRectChanged: " +childrenRect)
this.childrenRectWidth = childrenRect.width
this.childrenRectHeight = childrenRect.height
if (this.widthSpec === 1) {
this.width = childrenRectWidth
}
if (this.heightSpec === 1) {
this.height = childrenRectHeight
}
}
color: 'transparent'
}

View File

@@ -1,7 +1,9 @@
import QtQuick 2.12
import QtQuick.Controls 2.5
Flex {
Rectangle {
color: 'transparent'
Text {
}

View File

@@ -0,0 +1,8 @@
// util.mjs
export function uuidv4() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
var r = Math.random() * 16 | 0,
v = c === 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}

View File

@@ -1,10 +1,61 @@
import QtQuick 2.12
import QtQuick.Controls 2.5
import QtQuick.Layouts 1.15
Flex {
flexDirection: "column"
justifyContent: "flexStart"
alignItems: "flexStart"
alignContent: "flexStart"
import "util.mjs" as Util
Rectangle {
property var uuid: Util.uuidv4()
property int widthSpec: 0
property int heightSpec: 0
property int childrenRectWidth: childrenRect.width
property int childrenRectHeight: childrenRect.height
property var tag: "VLayout"
onWidthChanged: () => {
console.log(tag, uuid + " onWidthChanged: " + this.width)
}
onHeightChanged: () => {
console.log(tag, uuid + " onHeightChanged: " + this.height)
}
onWidthSpecChanged: () => {
console.log(tag, uuid + " onWidthSpecChanged: " + this.widthSpec)
console.log(tag, uuid + " parent width: " + parent.width)
if (this.widthSpec === 2) {
this.width = parent.width
}
}
onHeightSpecChanged: () => {
console.log(tag, uuid + " onHeightSpecChanged: " + this.heightSpec)
console.log(tag, uuid + " parent height: " + parent.height)
if (this.heightSpec === 2) {
this.height = parent.height
}
}
onChildrenRectChanged: () => {
console.log(tag, uuid + " widthSpec: " + widthSpec + " heightSpec: " + heightSpec)
console.log(tag, uuid + " childrenRect: " + uuid + " onChildrenRectChanged: " +childrenRect)
this.childrenRectWidth = childrenRect.width
this.childrenRectHeight = childrenRect.height
if (this.widthSpec === 1) {
this.width = childrenRectWidth
}
if (this.heightSpec === 1) {
this.height = childrenRectHeight
}
}
color: 'transparent'
ColumnLayout {
spacing: 0
}
}