diff --git a/CHANGELOG.md b/CHANGELOG.md index 80a3ab3ba2e3faf58ce4e4c7cfa2532d5901c22c..568f6821e960eeb7b36408168b0b64d6d50f41be 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,4 +1,6 @@ ## v1.0.5 +- 解决了GridLayoutHelper布局colsSpan合并单元格属性引发的高度问题 + - 优化了BannerLayoutHelper和SingleLayoutHelper容器高度自适应的实现方式 - 解决了一拖n布局的高度自适应和行列权重的问题 diff --git a/entry/package.json b/entry/package.json index b5368bfb17b312697e0aa2dc14839a333a8769e6..ed8862a9e93ab9a7360e66834337d97fa3ee6187 100644 --- a/entry/package.json +++ b/entry/package.json @@ -1,16 +1,16 @@ { - "license": "Apache-2.0", - "devDependencies": {}, - "name": "entry", - "ohos": { - "org": "huawei", - "directoryLevel": "module", - "buildTool": "hvigor" + "license":"Apache-2.0", + "devDependencies":{}, + "name":"entry", + "ohos":{ + "org":"huawei", + "directoryLevel":"module", + "buildTool":"hvigor" }, - "description": "example description", - "repository": {}, - "version": "1.0.5", - "dependencies": { - "@ohos/vlayout": "file:../vlayout" + "description":"example description", + "repository":{}, + "version":"1.0.5", + "dependencies":{ + "@ohos/vlayout":"file:../vlayout" } -} +} \ No newline at end of file diff --git a/vlayout/package.json b/vlayout/package.json index b2e03080bdf6f742971be0bc8994d6f5ea929523..eb1c61b6b8b1f8257c0d456aea92f3cd861970bc 100644 --- a/vlayout/package.json +++ b/vlayout/package.json @@ -1,23 +1,23 @@ { - "types": "", - "keywords": [ + "types":"", + "keywords":[ "OpenHarmony", "vlayout" ], - "author": "hihope", - "description": "vlayout能够处理列表、网格和其他布局在同一个视图的复杂情况，使用者可以使用已设定好的容器布局组件，也可以在此基础上自定义容器布局组件。", - "ohos": { - "org": "opensource" + "author":"hihope", + "description":"vlayout能够处理列表、网格和其他布局在同一个视图的复杂情况，使用者可以使用已设定好的容器布局组件，也可以在此基础上自定义容器布局组件。", + "ohos":{ + "org":"opensource" }, - "main": "index.ets", - "repository": "https://gitee.com/openharmony-sig/vlayout", - "version": "1.0.5", - "tags": [ + "main":"index.ets", + "repository":"https://gitee.com/openharmony-sig/vlayout", + "version":"1.0.5", + "tags":[ "OpenHarmony", "vlayout" ], - "dependencies": {}, - "license": "Apache-2.0", - "devDependencies": {}, - "name": "@ohos/vlayout" -} + "dependencies":{}, + "license":"Apache-2.0", + "devDependencies":{}, + "name":"@ohos/vlayout" +} \ No newline at end of file diff --git a/vlayout/src/main/ets/components/common/GridLayoutHelper.ets b/vlayout/src/main/ets/components/common/GridLayoutHelper.ets index 26f3cad77b64b82e8010f1c1370e752f07b76e20..ea0771059fd069b98180c989d5413856d996cd2f 100644 --- a/vlayout/src/main/ets/components/common/GridLayoutHelper.ets +++ b/vlayout/src/main/ets/components/common/GridLayoutHelper.ets @@ -87,8 +87,8 @@ export struct GRID_LAYOUT { computedSpanCountAndWeights() { if (this.gridInfo.spanCount == undefined && this.gridInfo.weights == undefined) { //列数和列占比集合同时未定义时 - this.gridInfo.spanCount = 1 - this.gridInfo.weights = [100] + this.gridInfo.spanCount = 4 + this.gridInfo.weights = [25, 25, 25, 25] } else if (this.gridInfo.spanCount == undefined && this.gridInfo.weights != undefined) { //列占比集合定义了但列数未定义时 this.gridInfo.spanCount = this.gridInfo.weights.length } else { @@ -187,6 +187,10 @@ export struct GRID_LAYOUT { this.computedRightPadding(rightPadding) this.columnsTemplate = newCols.join(' ') } + let count = Math.ceil(this.vLayoutData.length / this.gridInfo.spanCount) + let rows = [] + rows.push('1fr '.repeat(count)) + this.rowsTemplate = rows.join(' ') } else { console.error(TAG + 'autoExpand false') } @@ -204,7 +208,31 @@ export struct GRID_LAYOUT { } computedRowsTemplate() { - let count = Math.ceil(this.vLayoutData.length / this.gridInfo.spanCount) //行数等于数据源长度除以列数 + let sum = 0 + let temp = 0 + for (let i = 0;i < this.vLayoutData.length; i++) { + if (this.vLayoutData[i].colsSpan > this.gridInfo.spanCount) { //如果合并列大于列数，合并项等于列数 + this.vLayoutData[i].colsSpan = this.gridInfo.spanCount + } else if (this.vLayoutData[i].colsSpan < 1) { //如果合并列小于1，合并项等于1 + this.vLayoutData[i].colsSpan = 1 + } else { + console.info(TAG + 'colsSpan = ' + this.vLayoutData[i].colsSpan) + } + let colsSpan = 0 + if (this.vLayoutData[i].colsSpan == undefined) { + colsSpan = 1 + } else { + colsSpan = this.vLayoutData[i].colsSpan + } + sum = sum + colsSpan + if (temp + colsSpan > this.gridInfo.spanCount) { + sum = sum + this.gridInfo.spanCount - temp + temp = colsSpan + } else { + temp = temp + colsSpan + } + } + let count = Math.ceil(sum / this.gridInfo.spanCount) //获得实际行数 let rows = [] rows.push('1fr '.repeat(count)) //行数为1:1 this.rowsTemplate = rows.join(' ') diff --git a/vlayout/src/main/ets/components/common/RangeGridLayoutHelper.ets b/vlayout/src/main/ets/components/common/RangeGridLayoutHelper.ets index 267ed8f442f0bfb254e7719bac714543c314f29b..ee7f2dfda840fcbc3da2dc2bc8a9d333216ddcf9 100644 --- a/vlayout/src/main/ets/components/common/RangeGridLayoutHelper.ets +++ b/vlayout/src/main/ets/components/common/RangeGridLayoutHelper.ets @@ -87,8 +87,8 @@ export struct RANGEGRID_LAYOUT { computedSpanCountAndWeights() { if (this.gridInfo.spanCount == undefined && this.gridInfo.weights == undefined) { //列数和列占比集合同时未定义时 - this.gridInfo.spanCount = 1 - this.gridInfo.weights = [100] + this.gridInfo.spanCount = 4 + this.gridInfo.weights = [25, 25, 25, 25] } else if (this.gridInfo.spanCount == undefined && this.gridInfo.weights != undefined) { //列占比集合定义了但列数未定义时 this.gridInfo.spanCount = this.gridInfo.weights.length } else { @@ -187,6 +187,10 @@ export struct RANGEGRID_LAYOUT { this.computedRightPadding(rightPadding) this.columnsTemplate = newCols.join(' ') } + let count = Math.ceil(this.vLayoutData.length / this.gridInfo.spanCount) + let rows = [] + rows.push('1fr '.repeat(count)) + this.rowsTemplate = rows.join(' ') } else { console.error(TAG + 'autoExpand false') } @@ -204,9 +208,19 @@ export struct RANGEGRID_LAYOUT { } computedRowsTemplate() { - let count = Math.ceil(this.vLayoutData.length / this.gridInfo.spanCount) + 2 //行数等于数据源长度除以列数 + let lines: number[] = [0] + let columnCount = this.gridInfo.spanCount + for (let item of this.vLayoutData) { + let colsSpan = Math.min(Math.max(item.colsSpan ?? 1, 1), columnCount) + item.colsSpan = colsSpan; + if (lines[lines.length-1] + colsSpan > columnCount) { + lines.push(colsSpan) + } else { + lines[lines.length-1] += colsSpan + } + } let rows = [] - rows.push('1fr '.repeat(count)) //行数为1:1 + rows.push('1fr '.repeat(lines.length)) //行数为1:1 this.rowsTemplate = rows.join(' ') }