Commit cb63e0a9 authored by limingzhe's avatar limingzhe

fix: 滚动条

parent fa40a496
......@@ -2144,6 +2144,7 @@ export class ScrollView extends MySprite {
scorllBarWidth;
scrollBarHeight;
itemArr = [];
constructor(ctx = null) {
super(ctx);
......@@ -2201,26 +2202,38 @@ export class ScrollView extends MySprite {
}
addItem(sprite) {
this.itemArr.push(sprite);
this.content.addChild(sprite);
sprite.ctx = this._offCtx;
this.refreshContentSize();
}
refreshContentSize() {
const children = this.content.children;
const children = this.itemArr;
// console.log('children: ', children);
let maxW = 0;
let maxH = 0;
for (let i=0; i<children.length; i++) {
if (children[i] == this.content) {
continue;
}
const box = children[i].getBoundingBox();
const curChild = children[i];
// console.log('box: ', box);
const boxEdgeX = box.x + box.width;
const boxEdgeY = box.y + box.height;
const boxEdgeX = curChild.x + (1 - curChild.anchorX) * curChild.width * curChild.scaleX;
const boxEdgeY = curChild.y + (1 - curChild.anchorY) * curChild.height * curChild.scaleY;
if (!children[i].colorRect) {
const rect = new ShapeRectNew();
rect.fillColor = '#ff0000';
rect.setSize(curChild.width * curChild.scaleX, curChild.height * curChild.scaleY, 0);
rect.alpha = 0.3;
rect.x = boxEdgeX - curChild.width * curChild.scaleX;
rect.y = boxEdgeY - curChild.height * curChild.scaleY;
this.content.addChild(rect);
children[i].colorRect = rect;
}
// console.log('boxEdgeY: ', boxEdgeY);
if (boxEdgeX > maxW) {
......@@ -2231,13 +2244,14 @@ export class ScrollView extends MySprite {
}
}
// console.log('maxW: ', maxW);
// console.log('maxW: ', maxW);s
// console.log('maxH: ', maxH);
// console.log('this.y: ', this.y);
// console.log(this.getBoundingBox().height);
this.content.width = maxW;
this.content.height = maxH ;
// const box = this.getBoundingBox();
this.content.width = maxW;
this.content.height = maxH + 10 //+ 500;
this.refreshScrollBar();
......@@ -2262,9 +2276,10 @@ export class ScrollView extends MySprite {
const rect1 = this.getBoundingBox();
const rect2 = this.content.getBoundingBox();
const sRate = rect1.height / this.height;
// let rate = rect1.height / rect2.height;
let rate = this.height / this.content.height;
let rate = rect1.height / rect2.height;
// let rate = this.height / this.content.height;
// let rate = this.height * this.scaleY / this.content.height / this.content.scaleY;
if (rate >= 1) {
this._scrollBar.visible = false;
......@@ -2272,7 +2287,7 @@ export class ScrollView extends MySprite {
} else {
this._scrollBar.visible = true;
}
const h = rate * (this.height)
const h = rate * this.height / sRate;
const r = w / 2;
this._scrollBar.setSize(w, h, r);
......@@ -2282,10 +2297,10 @@ export class ScrollView extends MySprite {
refreshScrollBarPos() {
const rect1 = this.getBoundingBox();
const rect2 = this.content.getBoundingBox();
let rate = rect1.height / rect2.height;
let rate = this.height / this.content.height;
this._scrollBar.y = -rect2.y * (rate );
this._scrollBar.y = -this.content.y * (rate );
}
......@@ -2329,11 +2344,12 @@ export class ScrollView extends MySprite {
const offsetX = x - this.touchStartPos.x;
const offsetY = y - this.touchStartPos.y;
const rect = this.getBoundingBox();
const rect2 = this.content.getBoundingBox();
if (this.scrollSide == ScrollView.ScrollSideType.VERTICAL) {
this.content.y = between(this.touchStartContentPos.y + offsetY, 0, -rect.y + rect.height - this.content.height);
this.content.y = between(this.touchStartContentPos.y + offsetY, 0, this.height - this.content.height);
} else {
this.content.x = between(this.touchStartContentPos.x + offsetX, 0, -rect.x + rect.width - this.content.width);
this.content.x = between(this.touchStartContentPos.x + offsetX, 0, this.width - this.content.width);
}
this.refreshScrollBarPos();
}
......@@ -2350,9 +2366,9 @@ export class ScrollView extends MySprite {
const rect = this.getBoundingBox();
if (this.scrollSide == ScrollView.ScrollSideType.VERTICAL) {
this.content.y = between(this.content.y + 40, 0, -rect.y + rect.height - this.content.height);
this.content.y = between(this.content.y + 40, 0, this.height - this.content.height);
} else {
this.content.x = between(this.content.x + 40, 0, -rect.x + rect.width - this.content.width);
this.content.x = between(this.content.x + 40, 0, this.width - this.content.width);
}
this.refreshScrollBarPos();
......@@ -2366,9 +2382,9 @@ export class ScrollView extends MySprite {
const rect = this.getBoundingBox();
if (this.scrollSide == ScrollView.ScrollSideType.VERTICAL) {
this.content.y = between(this.content.y - 40, 0, -rect.y + rect.height - this.content.height);
this.content.y = between(this.content.y - 40, 0, this.height - this.content.height);
} else {
this.content.x = between(this.content.x - 40, 0, -rect.x + rect.width - this.content.width);
this.content.x = between(this.content.x - 40, 0, this.width - this.content.width);
}
this.refreshScrollBarPos();
......
......@@ -823,10 +823,15 @@ export class PlayComponent implements OnInit, OnDestroy {
setRectRight(data) {
console.log("in setRectRight : ", data);
for (let i=0; i<this.hotZoneArr.length; i++) {
this.hotZoneArr[i].result = data[i];
if (data[i] && data[i].right) {
this.hotZoneArr[i].isRight = true;
} else {
this.hotZoneArr[i].isRight = false;
}
}
}
......@@ -1068,6 +1073,9 @@ export class PlayComponent implements OnInit, OnDestroy {
}
console.log('this.resultSv.height: ', this.resultSv.heigth);
console.log('this.resultSv.box height: ', this.resultSv.getBoundingBox().height);
}
......@@ -1543,9 +1551,10 @@ export class PlayComponent implements OnInit, OnDestroy {
console.log('this.data: ', this.data);
const sv = new ScrollView();
sv.setShowSize(this.canvasWidth, this.canvasHeight);
// sv.x = -this.canvasWidth / 2;
sv.y = 150 * this.mapScale;
sv.setShowSize(this.canvasWidth, this.canvasHeight-sv.y);
// sv.x = -this.canvasWidth / 2;
sv.setBgColor('#ffffff')
sv.setScrollBarSize(20 * this.mapScale, 5)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment