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

text alignment

Browse Source
This commit is contained in:
pengfei.zhou 2019-12-21 13:28:51 +08:00
parent 0beb8b8633
commit db4990696c
4 changed files with 58 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
dist/index.js vendored
View File

@ -4185,12 +4185,18 @@ return __module.exports;
class DoricTextNode extends DoricViewNode {
build() {
return document.createElement('p');
const div = document.createElement('div');
div.style.display = "flex";
this.textElement = document.createElement('span');
div.appendChild(this.textElement);
div.style.justifyContent = "center";
div.style.alignItems = "center";
return div;
}
blendProps(v, propName, prop) {
switch (propName) {
case 'text':
v.innerText = prop;
this.textElement.innerText = prop;
break;
case 'textSize':
v.style.fontSize = toPixelString(prop);
@ -4198,6 +4204,27 @@ return __module.exports;
case 'textColor':
v.style.color = toRGBAString(prop);
break;
case 'textAlignment':
const gravity = prop;
if ((gravity & LEFT) === LEFT) {
v.style.justifyContent = "flex-start";
}
else if ((gravity & RIGHT) === RIGHT) {
v.style.justifyContent = "flex-end";
}
else if ((gravity & CENTER_X) === CENTER_X) {
v.style.justifyContent = "center";
}
if ((gravity & TOP) === TOP) {
v.style.alignItems = "flex-start";
}
else if ((gravity & BOTTOM) === BOTTOM) {
v.style.alignItems = "flex-end";
}
else if ((gravity & CENTER_Y) === CENTER_Y) {
v.style.alignItems = "center";
}
break;
default:
super.blendProps(v, propName, prop);
break;

2
dist/index.js.map vendored
View File

File diff suppressed because one or more lines are too long

31
src/shader/DoricTextNode.ts
View File

@ -1,15 +1,21 @@
import { DoricViewNode, FrameSize, toPixelString, toRGBAString } from "./DoricViewNode";
import { DoricViewNode, LEFT, RIGHT, CENTER_X, CENTER_Y, TOP, BOTTOM, toPixelString, toRGBAString } from "./DoricViewNode";
export class DoricTextNode extends DoricViewNode {
textElement!: HTMLElement
build(): HTMLElement {
return document.createElement('p')
const div = document.createElement('div')
div.style.display = "flex"
this.textElement = document.createElement('span')
div.appendChild(this.textElement)
div.style.justifyContent = "center"
div.style.alignItems = "center"
return div
}
blendProps(v: HTMLParagraphElement, propName: string, prop: any) {
switch (propName) {
case 'text':
v.innerText = prop
this.textElement.innerText = prop
break
case 'textSize':
v.style.fontSize = toPixelString(prop)
@ -17,6 +23,23 @@ export class DoricTextNode extends DoricViewNode {
case 'textColor':
v.style.color = toRGBAString(prop)
break
case 'textAlignment':
const gravity: number = prop
if ((gravity & LEFT) === LEFT) {
v.style.justifyContent = "flex-start"
} else if ((gravity & RIGHT) === RIGHT) {
v.style.justifyContent = "flex-end"
} else if ((gravity & CENTER_X) === CENTER_X) {
v.style.justifyContent = "center"
}
if ((gravity & TOP) === TOP) {
v.style.alignItems = "flex-start"
} else if ((gravity & BOTTOM) === BOTTOM) {
v.style.alignItems = "flex-end"
} else if ((gravity & CENTER_Y) === CENTER_Y) {
v.style.alignItems = "center"
}
break
default:
super.blendProps(v, propName, prop)
break

2
src/shader/DoricVLayoutNode.ts
View File

@ -1,4 +1,4 @@
import { DoricGroupViewNode, LayoutSpec, FrameSize, LEFT, RIGHT, CENTER_X, CENTER_Y, TOP, BOTTOM, toPixelString } from "./DoricViewNode";
import { DoricGroupViewNode, LEFT, RIGHT, CENTER_X, CENTER_Y, TOP, BOTTOM, toPixelString } from "./DoricViewNode";
export class DoricVLayoutNode extends DoricGroupViewNode {
space = 0