颜色选择器

lefengyang

2026-08-27 c7bbc2936d13523042187b112e72ea9b5b5566a2

 ledApp/pages/addTemplate/addTemplate.vue

@@ -151,9 +151,10 @@

            <!-- 动画按钮 -->
            <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="changeRatio()"></uv-button> -->
               <uv-button type="primary" :plain="true" text="颜色" @click="changeColor()"></uv-button>
               <uv-button type="primary" :plain="true" text="左移" @click="shiftLeft()"></uv-button>
               <uv-button type="primary" :plain="true" text="下移" @click="shiftDown()"></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>
@@ -317,7 +318,7 @@
            color: '#FF0000',
            gridRect: null,
            pickerOptions: {
               width: '50%',
               width: 680,
            },
            fpsList: [],
            tId: '',
@@ -730,6 +731,21 @@
               }
            }
         },
         shiftDown() {
            const colCount = this.width * (this.modeVal == 2 ? 10 : 1)
            const lastRowStart = (this.height - 1) * colCount
            const lastRow = this.pixelData.slice(lastRowStart, lastRowStart + colCount)
            for (let r = this.height - 1; r > 0; r--) {
               const currentStart = r * colCount
               const prevStart = (r - 1) * colCount
               for (let c = 0; c < colCount; c++) {
                  this.$set(this.pixelData, currentStart + c, this.pixelData[prevStart + c])
               }
            }
            for (let c = 0; c < colCount; c++) {
               this.$set(this.pixelData, c, lastRow[c])
            }
         },
         toggleControls() {
            this.showControls = !this.showControls;
         },
@@ -1241,8 +1257,7 @@
      box-sizing: border-box;
   }
   .color-picker-wrapper {
      zoom: 0.5;
      padding: 0 25%;
      //zoom: 0.5;
   }
   
   .action_btn {