DataType
/
omi
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

omix - fix rendering error

This commit is contained in:
dntzhang 2019-02-12 19:50:37 +08:00
parent 580d00a9b4
commit 1ecd9f2ce2
7 changed files with 62 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
packages/omix/examples/simple/b.js
View File

@ -189,6 +189,11 @@
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var displayMap = {
div: 'block',
span: 'inline-block'
};
function registerNode(docId, node) {
var doc = getDoc(docId);
doc.nodeMap[node.nodeId] = node;
@ -203,7 +208,9 @@
this.ref = this.nodeId;
this.type = type;
this.attributes = {};
this.style = {};
this.style = {
display: displayMap[type]
};
this.classStyle = {};
this.event = {};
this.childNodes = [];
@ -426,7 +433,9 @@
this.nodeId = uniqueId();
this.ref = this.nodeId;
this.attributes = {};
this.style = {};
this.style = {
display: 'inline'
};
this.classStyle = {};
this.event = {};
this.value = value;
@ -6016,23 +6025,21 @@
var group = new cax.Group();
group.zIndex = root.style.zIndex;
group.position = root.style.position;
var rect = new cax.Rect(root.style._width, root.style._height, {
//bg rect
var rect = new cax.Rect(parseFloat(root.style._width), parseFloat(root.style._height), {
fillStyle: root.style.backgroundColor
});
rect.x = root.style.x;
rect.y = root.style.y;
group.x = root.style.x + parseFloat(root.style.left) || 0;
group.y = root.style.y + parseFloat(root.style.top) || 0;
group.add(rect);
root.childNodes.forEach(function (child) {
_draw(child, group);
});
g.add(group);
return group;
break;
case 'text':
console.log(root);
console.log(root.style._color);
var text = new cax.Text(root.value, {
color: root.style._color
});
@ -6087,20 +6094,20 @@
if (position === 'absolute') {
var parent = getParent(root);
root.style.x = parent.style.x;
root.style.y = parent.style.y;
root.style.x = (parent.style.x || 0) + parseFloat(root.style.left);
root.style.y = (parent.style.y || 0) + parseFloat(root.style.top);
root.style._width = root.style.width === undefined ? 0 : root.style.width;
root.style._height = root.style.height === undefined ? 0 : root.style.height;
} else if (display === 'block') {
root.style._width = root.style.width === undefined ? root.parent.style._width : root.style.width;
root.style._width = root.style.width === undefined ? root.parent ? root.parent.style._width : window.innerWidth : root.style.width;
root.style._height = root.style.height === undefined ? 0 : root.style.height;
root.style.x = root.parent.style.x;
root.style.x = root.parent ? root.parent.style.x : 0;
if (root.preNode) {
root.style.y = root.preNode.style.y + root.preNode.style._height;
} else {
root.style.y = root.parent.style.y;
root.style.y = root.parent ? root.parent.style.y : 0;
}
} else if (display === 'flex') {
@ -7121,13 +7128,19 @@
color: 'red'
}, _this.testStyle = {
backgroundColor: 'red'
}, _this.divStyle = {
position: 'absolute',
left: 100,
width: 100,
height: 100,
backgroundColor: 'red'
}, _temp), _possibleConstructorReturn$21(_this, _ret);
}
_class2.prototype.render = function render$$1() {
return Omi.h(
'div',
null,
{ style: this.divStyle },
Omi.h(
'button',
{ style: this.buttonStyle, onClick: this.sub },

2
packages/omix/examples/simple/b.js.map
View File

File diff suppressed because one or more lines are too long

6
packages/omix/examples/simple/index.html
View File

@ -3,7 +3,11 @@
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
</head>
<style>
html,body{
margin: 0;
}
</style>
<body>
<script src="b.js"></script>

12
packages/omix/examples/simple/main.js
View File

@ -14,16 +14,24 @@ define('my-counter', class extends WeElement {
}
buttonStyle = {
color: 'red'
color: 'red'
}
testStyle = {
backgroundColor: 'red'
}
divStyle = {
position: 'absolute',
left: 100,
width: 100,
height: 100,
backgroundColor: 'red'
}
render() {
return (
<div>
<div style={this.divStyle}>
<button style={this.buttonStyle} onClick={this.sub}>-</button>
<span style={this.testStyle}>{this.count}</span>
<button style={this.buttonStyle} onClick={this.add}>+</button>

20
packages/omix/src/cax/draw.js
View File

@ -40,23 +40,21 @@ function _draw(root, g) {
const group = new cax.Group()
group.zIndex = root.style.zIndex
group.position = root.style.position
const rect = new cax.Rect(root.style._width, root.style._height, {
//bg rect
const rect = new cax.Rect(parseFloat(root.style._width), parseFloat(root.style._height), {
fillStyle: root.style.backgroundColor
})
rect.x = root.style.x
rect.y = root.style.y
group.x = root.style.x + parseFloat(root.style.left) || 0
group.y = root.style.y + parseFloat(root.style.top) || 0
group.add(rect)
root.childNodes.forEach(child => {
_draw(child, group)
})
g.add(group)
return group
break
case 'text':
console.log(root)
console.log(root.style._color)
const text = new cax.Text(root.value, {
color: root.style._color
})
@ -114,21 +112,21 @@ function renderChildren(root, width, height, group) {
if (position === 'absolute') {
const parent = getParent(root)
root.style.x = parent.style.x
root.style.y = parent.style.y
root.style.x = (parent.style.x || 0 ) + parseFloat( root.style.left)
root.style.y = (parent.style.y || 0 ) + parseFloat( root.style.top)
root.style._width = root.style.width === undefined ? 0 : root.style.width
root.style._height = root.style.height === undefined ? 0 : root.style.height
} else if (display === 'block') {
root.style._width = root.style.width === undefined ? root.parent.style._width : root.style.width
root.style._width = root.style.width === undefined ? (root.parent?root.parent.style._width:window.innerWidth ): root.style.width
root.style._height = root.style.height === undefined ? 0 : root.style.height
root.style.x = root.parent.style.x
root.style.x = root.parent?root.parent.style.x:0
if (root.preNode) {
root.style.y = root.preNode.style.y + root.preNode.style._height
} else {
root.style.y = root.parent.style.y
root.style.y = root.parent?root.parent.style.y:0
}
} else if (display === 'flex') {

8
packages/omix/src/mock/element.js
View File

@ -7,6 +7,10 @@ import {
removeIndex
} from './util'
const displayMap = {
div: 'block',
span: 'inline-block'
}
function registerNode(docId, node) {
const doc = getDoc(docId)
@ -20,7 +24,9 @@ export default class Element {
this.ref = this.nodeId
this.type = type
this.attributes = {}
this.style = {}
this.style = {
display: displayMap[type]
}
this.classStyle = {}
this.event = {}
this.childNodes = []

4
packages/omix/src/mock/text-node.js
View File

@ -15,7 +15,9 @@ export default class TextNode {
this.nodeId = uniqueId()
this.ref = this.nodeId
this.attributes = {}
this.style = {}
this.style = {
display: 'inline'
}
this.classStyle = {}
this.event = {}
this.value = value