tianzixuan/Doric
Archived
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

add gravity handle & nested layout with rectangle with height handle

Browse Source
This commit is contained in:
王劲鹏 2021-03-17 18:20:43 +08:00 committed by osborn
parent fc104c4ec1
commit 0c151c435f
8 changed files with 87 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
doric-Qt/doric/demo/DoricDemoBridge.cpp
View File

@ -23,8 +23,8 @@ void DoricDemoBridge::navigate(QVariant route) {
{
const QUrl url(QStringLiteral("qrc:/doric/qml/view.qml"));
view->setSource(url);
view->setWidth(450);
view->setHeight(800);
view->setWidth(405);
view->setHeight(720);
}
{
@ -33,8 +33,8 @@ void DoricDemoBridge::navigate(QVariant route) {
component.loadUrl(url);
QQuickItem *quickItem = qobject_cast<QQuickItem *>(component.create());
DoricPanel *panel = new DoricPanel(view->engine(), quickItem);
quickItem->setWidth(450);
quickItem->setHeight(800);
quickItem->setWidth(405);
quickItem->setHeight(720);
quickItem->setParentItem(view->rootObject());
panel->config(script, name, NULL);

1
doric-Qt/doric/qml.qrc
View File

@ -20,6 +20,7 @@
<file alias="hlayout.qml">resources/hlayout.qml</file>
<file alias="text.qml">resources/text.qml</file>
<file alias="util.mjs">resources/util.mjs</file>
<file alias="gravity.mjs">resources/gravity.mjs</file>
<file>test-layout.qml</file>
</qresource>
</RCC>

32
doric-Qt/doric/resources/gravity.mjs Normal file
View File

@ -0,0 +1,32 @@
// gravity.mjs
export function enumerate() {
const SPECIFIED = 1;
const START = 1 << 1;
const END = 1 << 2;
const SHIFT_X = 0;
const SHIFT_Y = 4;
const LEFT = (START | SPECIFIED) << SHIFT_X;
const RIGHT = (END | SPECIFIED) << SHIFT_X;
const TOP = (START | SPECIFIED) << SHIFT_Y;
const BOTTOM = (END | SPECIFIED) << SHIFT_Y;
const CENTER_X = SPECIFIED << SHIFT_X;
const CENTER_Y = SPECIFIED << SHIFT_Y;
const CENTER = CENTER_X | CENTER_Y;
var gravity = {
SPECIFIED,
START,
END,
SHIFT_X,
SHIFT_Y,
LEFT,
RIGHT,
TOP,
BOTTOM,
CENTER_X,
CENTER_Y,
CENTER
}
return gravity
}

22
doric-Qt/doric/resources/hlayout.qml
View File

@ -3,16 +3,18 @@ import QtQuick.Controls 2.5
import QtQuick.Layouts 1.15
import "util.mjs" as Util
import "gravity.mjs" as Gravity
Rectangle {
property var tag: "HLayout"
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)
}
@ -24,8 +26,10 @@ Rectangle {
onWidthSpecChanged: () => {
console.log(tag, uuid + " onWidthSpecChanged: " + this.widthSpec)
console.log(tag, uuid + " parent width: " + parent.width)
if (this.widthSpec === 2) {
this.width = parent.width
// children[0].width = parent.width
}
}
@ -35,6 +39,7 @@ Rectangle {
if (this.heightSpec === 2) {
this.height = parent.height
children[0].height = parent.height
}
}
@ -56,6 +61,19 @@ Rectangle {
color: 'transparent'
RowLayout {
property int gravity: 0
spacing: 0
onChildrenChanged: () => {
console.log(tag, uuid + " gravity: " + gravity)
for (var i = 0;i !== children.length;i++) {
switch(this.gravity) {
case Gravity.enumerate().CENTER_X:
children[i].Layout.alignment = Qt.AlignHCenter
break
}
}
}
}
}

23
doric-Qt/doric/resources/vlayout.qml
View File

@ -3,16 +3,18 @@ import QtQuick.Controls 2.5
import QtQuick.Layouts 1.15
import "util.mjs" as Util
import "gravity.mjs" as Gravity
Rectangle {
property var tag: "VLayout"
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)
}
@ -24,8 +26,10 @@ Rectangle {
onWidthSpecChanged: () => {
console.log(tag, uuid + " onWidthSpecChanged: " + this.widthSpec)
console.log(tag, uuid + " parent width: " + parent.width)
if (this.widthSpec === 2) {
this.width = parent.width
children[0].width = parent.width
}
}
@ -35,6 +39,7 @@ Rectangle {
if (this.heightSpec === 2) {
this.height = parent.height
// children[0].height = parent.height
}
}
@ -56,6 +61,20 @@ Rectangle {
color: 'transparent'
ColumnLayout {
property int gravity: 0
spacing: 0
onChildrenChanged: () => {
console.log(tag, uuid + " gravity: " + gravity)
for (var i = 0;i !== children.length;i++) {
switch(this.gravity) {
case Gravity.enumerate().CENTER_X:
children[i].Layout.alignment = Qt.AlignHCenter
break
}
}
}
}
}

6
doric-Qt/doric/shader/DoricHLayoutNode.cpp
View File

@ -18,11 +18,7 @@ void DoricHLayoutNode::blend(QQuickItem *view, QString name, QJSValue prop) {
if (name == "space") {
view->childItems().at(0)->setProperty("spacing", prop.toInt());
} else if (name == "gravity") {
switch (prop.toInt()) {
case 1:
view->setProperty("alignItems", "center");
break;
}
view->childItems().at(0)->setProperty("gravity", prop.toInt());
} else {
DoricGroupNode::blend(view, name, prop);
}

6
doric-Qt/doric/shader/DoricVLayoutNode.cpp
View File

@ -18,11 +18,7 @@ void DoricVLayoutNode::blend(QQuickItem *view, QString name, QJSValue prop) {
if (name == "space") {
view->childItems().at(0)->setProperty("spacing", prop.toInt());
} else if (name == "gravity") {
switch (prop.toInt()) {
case 1:
view->setProperty("alignItems", "center");
break;
}
view->childItems().at(0)->setProperty("gravity", prop.toInt());
} else {
DoricGroupNode::blend(view, name, prop);
}

10
doric-Qt/doric/test-layout.qml
View File

@ -14,18 +14,22 @@ ApplicationWindow {
height: childrenRect.height
ColumnLayout {
property int gravity: 0
onGravityChanged: {
console.log(children[0].Layout.alignment)
children[0].Layout.alignment = 1
}
spacing: 0
width: 400
height: 600
Rectangle {
Layout.alignment: Qt.AlignHCenter
width: 100
height: 100
color: 'black'
}
Rectangle {
Layout.alignment: Qt.AlignHCenter
width: 100
height: 100
color: 'yellow'