@visactor/vtable
Version:
canvas table width high performance
106 lines (102 loc) • 6.54 kB
JavaScript
import { RichText, Text } from "./../../vrender";
import { Group } from "../graphic/group";
import { Icon, TextIcon } from "../graphic/icon";
export class CellContent extends Group {
constructor(params) {
super(params), this._autoWidth = !1, this._autoHeight = !1, this._leftGroup = new Group({
pickable: !1,
fill: !1,
stroke: !1
}), this._leftGroup.role = "content-left", this._rightGroup = new Group({
pickable: !1,
fill: !1,
stroke: !1
}), this._rightGroup.role = "content-right", this._centerGroup = new Group({
pickable: !1,
fill: !1,
stroke: !1
}), this._centerGroup.role = "content-center", this.appendChild(this._leftGroup),
this.appendChild(this._rightGroup), this.appendChild(this._centerGroup);
}
setCellContentOption(option) {
this._autoWidth = option.autoWidth, this._autoHeight = option.autoHeight, this._cellWidth = option.cellWidth,
this._originCellWidth = option.cellWidth, this._cellHeight = option.cellHeight,
this._align = option.align, this._baseline = option.baseline;
}
addLeftOccupyingIcon(icon) {
var _a, _b, _c;
icon.setAttribute("x", this._leftGroup.width + (null !== (_a = icon.attribute.marginLeft) && void 0 !== _a ? _a : 0)),
this._leftGroup.appendChild(icon), this._leftGroup.setDeltaWidth((null !== (_b = icon.attribute.marginLeft) && void 0 !== _b ? _b : 0) + (null !== (_c = icon.attribute.marginRight) && void 0 !== _c ? _c : 0) + icon.attribute.width);
}
addRightOccupyingIcon(icon) {
var _a, _b, _c;
icon.setAttribute("x", this._rightGroup.width + (null !== (_a = icon.attribute.marginLeft) && void 0 !== _a ? _a : 0)),
this._rightGroup.appendChild(icon), this._rightGroup.setDeltaWidth((null !== (_b = icon.attribute.marginLeft) && void 0 !== _b ? _b : 0) + (null !== (_c = icon.attribute.marginRight) && void 0 !== _c ? _c : 0) + icon.attribute.width);
}
addContent(content) {
const lastChild = this._centerGroup.lastChild;
lastChild && content.setAttributes({
x: lastChild.attribute.x + lastChild.AABBBounds.width()
}), this._centerGroup.appendChild(content), content instanceof Text && (this._centerGroup.setAttribute("pickable", !1),
content.setAttribute("textAlign", "left"));
}
layout() {
let leftOccupyingWidth = this._leftGroup.width;
leftOccupyingWidth === 1 / 0 && (leftOccupyingWidth = 0);
let rightOccupyingWidth = this._rightGroup.width;
if (rightOccupyingWidth === -1 / 0 && (rightOccupyingWidth = 0), this._autoWidth) {
const centerWidth = this._centerGroup.width;
this._cellWidth = leftOccupyingWidth + rightOccupyingWidth + centerWidth, this.setAttribute("width", this._cellWidth);
} else {
const contentWidth = this._cellWidth - leftOccupyingWidth - rightOccupyingWidth;
this.updateCenterLayout(contentWidth);
const centerWidth = this._centerGroup.width;
this._cellWidth = leftOccupyingWidth + rightOccupyingWidth + centerWidth, this.setAttribute("width", this._cellWidth);
}
this.updateHorizontalPos();
const leftOccupyingHeight = this._leftGroup.height, rightOccupyingHeight = this._rightGroup.height, centerHeight = this._centerGroup.height;
this._cellHeight = Math.max(leftOccupyingHeight, rightOccupyingHeight, centerHeight),
this.setAttribute("height", this._cellHeight), this.updateVerticalPos();
}
updateCenterLayout(contentWidth) {
let textWidth = contentWidth;
this._centerGroup.forEachChildren((child => {
(child instanceof Icon || child instanceof TextIcon) && (textWidth -= child.AABBBounds.width());
}));
const text = this._centerGroup.getChildByName("text");
text instanceof RichText ? text.setAttribute("width", textWidth) : text instanceof Text && text.setAttribute("maxLineWidth", textWidth);
let x = 0;
this._centerGroup.forEachChildren((child => {
child.setAttribute("x", x), x += child.AABBBounds.width();
}));
}
updateHorizontalPos() {
this._leftGroup.setAttribute("x", 0), this._rightGroup.setAttribute("x", this._cellWidth - this._rightGroup.width),
this._centerGroup.setAttribute("x", this._leftGroup.width), "left" === this._align || "start" === this._align ? this.setAttribute("dx", 0) : "center" === this._align ? this.setAttribute("dx", -this.attribute.width / 2) : "right" !== this._align && "end" !== this._align || this.setAttribute("dx", -this.attribute.width);
}
updateVerticalPos() {
"top" === this._baseline ? (this._leftGroup.setAttribute("y", 0), this._rightGroup.setAttribute("y", 0),
this._centerGroup.setAttribute("y", 0)) : "middle" === this._baseline ? (this._leftGroup.forEachChildren((icon => {
icon.setAttribute("y", (this._leftGroup.height - icon.AABBBounds.height()) / 2);
})), this._rightGroup.forEachChildren((icon => {
icon.setAttribute("y", (this._rightGroup.height - icon.AABBBounds.height()) / 2);
})), this._leftGroup.setAttribute("y", this._cellHeight / 2 - this._leftGroup.height / 2),
this._rightGroup.setAttribute("y", this._cellHeight / 2 - this._rightGroup.height / 2),
this._centerGroup.setAttribute("y", this._cellHeight / 2 - this._centerGroup.height / 2)) : "bottom" === this._baseline && (this._leftGroup.forEachChildren((icon => {
icon.setAttribute("y", this._leftGroup.height - icon.AABBBounds.height());
})), this._rightGroup.forEachChildren((icon => {
icon.setAttribute("y", this._rightGroup.height - icon.AABBBounds.height());
})), this._leftGroup.setAttribute("y", this._cellHeight - this._leftGroup.height),
this._rightGroup.setAttribute("y", this._cellHeight - this._rightGroup.height),
this._centerGroup.setAttribute("y", this._cellHeight - this._centerGroup.height));
}
updateWidth(width) {
this._cellWidth = width, this._originCellWidth = width, this.layout();
}
updateHeight(height) {
this._cellHeight = height, this._cellWidth = this._originCellWidth;
const textMark = this.getChildByName("text", !0);
textMark && textMark.setAttribute("heightLimit", height), this.layout();
}
}
//# sourceMappingURL=cell-content.js.map