| | |
| | | </view> |
| | | <!-- 操作按钮 --> |
| | | <view class="controls" style="left: 30rpx;"> |
| | | <uv-button type="success" :plain="true" :text="showControls ? '返回' : '操作'" @click="toggleControls"></uv-button> |
| | | <uv-button type="success" :plain="true" :text="showControls ? '收回' : '操作'" @click="toggleControls"></uv-button> |
| | | </view> |
| | | |
| | | <!-- 动画按钮 --> |
| | | <view class="controls" v-if="showControls"> |
| | | <uv-button type="primary" :plain="true" text="分辨率" @click="changeRatio()"></uv-button> |
| | | <uv-button type="primary" :plain="true" text="颜色" @click="changeColor()"></uv-button> |
| | | <uv-button type="primary" :plain="true" text="添加文字" @click="addText()"></uv-button> |
| | | <uv-button type="primary" :plain="true" text="左移" @click="shiftLeft()"></uv-button> |
| | | <uv-button type="primary" :plain="true" text="右移" @click="shiftRight()"></uv-button> |
| | | <uv-button type="primary" :plain="true" text="文字" @click="addText()"></uv-button> |
| | | <uv-button type="primary" :plain="true" text="清除" @click="clear()"></uv-button> |
| | | <uv-button type="primary" :plain="true" text="保存" @click="clickSaveData"></uv-button> |
| | | </view> |
| | |
| | | const cellHeight = rect.height / this.height |
| | | const colIndex = Math.floor(x / cellWidth) |
| | | const rowIndex = Math.floor(y / cellHeight) |
| | | console.log('colCount', colCount, 'colIndex', colIndex) |
| | | console.log('colCount', colCount, 'rowIndex', rowIndex, 'colIndex', colIndex) |
| | | if ( |
| | | colIndex >= 0 && colIndex < colCount && |
| | | rowIndex >= 0 && rowIndex < this.height |
| | |
| | | // 将所有像素点设置为空字符串 |
| | | this.pixelData = new Array(this.height * colCount).fill('') |
| | | }, |
| | | shiftLeft() { |
| | | const colCount = this.width * (this.modeVal == 2 ? 10 : 1) |
| | | for (let r = 0; r < this.height; r++) { |
| | | const rowStart = r * colCount |
| | | const row = this.pixelData.slice(rowStart, rowStart + colCount) |
| | | const shifted = row.slice(1).concat(row.slice(0, 1)) |
| | | for (let c = 0; c < colCount; c++) { |
| | | this.$set(this.pixelData, rowStart + c, shifted[c]) |
| | | } |
| | | } |
| | | }, |
| | | shiftRight() { |
| | | const colCount = this.width * (this.modeVal == 2 ? 10 : 1) |
| | | for (let r = 0; r < this.height; r++) { |
| | | const rowStart = r * colCount |
| | | const row = this.pixelData.slice(rowStart, rowStart + colCount) |
| | | const shifted = row.slice(colCount - 1).concat(row.slice(0, colCount - 1)) |
| | | for (let c = 0; c < colCount; c++) { |
| | | this.$set(this.pixelData, rowStart + c, shifted[c]) |
| | | } |
| | | } |
| | | }, |
| | | toggleControls() { |
| | | this.showControls = !this.showControls; |
| | | }, |
| | |
| | | .controls { |
| | | position: absolute; |
| | | bottom: 10rpx; |
| | | left: 110rpx; |
| | | left: 100rpx; |
| | | display: flex; |
| | | gap: 10rpx; |
| | | z-index: 9; |