| | |
| | | <view class="back_btn" @click="popupAnimationClose"> |
| | | <uv-icon name="arrow-leftward" color="#333" size="30"></uv-icon> |
| | | </view> |
| | | <!-- 操作按钮 --> |
| | | <view class="controls" style="left: 30rpx;"> |
| | | <uv-button type="primary" :plain="true" :text="showControls ? '收回' : '操作'" @click="toggleControls"></uv-button> |
| | | </view> |
| | | |
| | | <!-- 动画按钮 --> |
| | | <view class="controls"> |
| | | <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> |
| | |
| | | previewFrameIndex: 0, |
| | | previewTimer: null, |
| | | previewWidth: 24, |
| | | previewHeight: 12 |
| | | previewHeight: 12, |
| | | showControls: false |
| | | |
| | | } |
| | | }, |
| | |
| | | // 将所有像素点设置为空字符串 |
| | | this.pixelData = new Array(this.height * this.width).fill('') |
| | | }, |
| | | toggleControls() { |
| | | this.showControls = !this.showControls; |
| | | }, |
| | | // 模版动画弹出框 |
| | | changeAnimation(e){ |
| | | //console.log('打开关闭模版动画弹窗触发---',e) |
| | |
| | | } |
| | | } |
| | | |
| | | .controls { |
| | | .action_btn { |
| | | position: absolute; |
| | | bottom: 10px; |
| | | left: 50px; |
| | | z-index: 10; |
| | | background: linear-gradient(142deg, #6FD2FF 0%, #268DFF 100%); |
| | | padding: 12px 24px; |
| | | border-radius: 30px; |
| | | box-shadow: 0 4px 12px rgba(38, 141, 255, 0.4); |
| | | } |
| | | .controls { |
| | | position: absolute; |
| | | bottom: 10px; |
| | | left: 130px; |
| | | display: flex; |
| | | gap: 20px; |
| | | z-index: 9; |