61 lines
3.8 KiB
Plaintext
61 lines
3.8 KiB
Plaintext
<!--painting-2.wxml-->
|
|
<view class="page" style="background-color: #000;height:100vh;" catch:tap="hideBarsHandler">
|
|
<canvas type="2d" id="myCanvas" disable-scroll="true" bindtouchstart="touchStart"
|
|
bindtouchmove="touchMove" bindtouchend="touchEnd" wx:if="{{hasChoosedImg}}"
|
|
style="height: {{(canvasHeightLen == 0) ? canvasHeight : canvasHeightLen}}px; width: {{canvasWidth}}px; background: url('{{background}}');background-position: 0 0; background-size: {{canvasWidth}}px {{canvasHeight}}px"
|
|
/>
|
|
<view class="failText" wx:if="{{!hasChoosedImg}}" bindtap="addImg" catch:touchstart="hideBarsHandler">没有选择照片，点击重新选择</view>
|
|
<!-- <view class="bottom">
|
|
<block wx:for="{{btnInfo}}" wx:key="{{index}}">
|
|
<view class="list-item" data-type="{{item.type}}" style="background: {{item.background}}" bindtap="tapBtn"></view>
|
|
</block>
|
|
</view> -->
|
|
<view class="choose-box" wx:if="{{width}}">
|
|
<view class="color-box" style="background: {{'rgb(' + r + ', ' + g + ', ' + b + ')'}}; height: {{w}}px; border-radius: {{w/2}}px"></view>
|
|
<slider min="1" max="50" step="1" show-value="true" value="{{w}}" bindchange="changeWidth"/>
|
|
</view>
|
|
<view class="choose-box" wx:if="{{color}}">
|
|
<view class="color-box" style="background: {{'rgb(' + r + ', ' + g + ', ' + b + ')'}}; height: {{w}}px; border-radius: {{w/2}}px"></view>
|
|
<slider min="0" max="255" step="1" show-value="true" activeColor="red" value="{{r}}" data-color="r" bindchange="changeColor"/>
|
|
<slider min="0" max="255" step="1" show-value="true" activeColor="green" value="{{g}}" data-color="g" bindchange="changeColor"/>
|
|
<slider min="0" max="255" step="1" show-value="true" activeColor="blue" value="{{b}}" data-color="b" bindchange="changeColor"/>
|
|
</view>
|
|
<!-- 涂鸦工具区 -->
|
|
<view style="padding: 30rpx 32rpx 50rpx;position: fixed;bottom:0;width:100%;box-sizing: border-box;" >
|
|
<view class="space" style="padding-bottom: 20rpx; color: #FFF; font-size: 30rpx; line-height: 56rpx;display: flex;width:100%">
|
|
<view catch:tap="tapBtn" data-type="save">确定</view>
|
|
<view style="width: 30rpx;"></view>
|
|
<!-- <view >上传</view> -->
|
|
<view style="flex: 1;"></view>
|
|
<view catch:tap="showBarsHandler">笔力</view>
|
|
<view style="width: 30rpx;"></view>
|
|
<view catch:tap="chooseEraser">橡皮擦</view>
|
|
<view style="width: 30rpx;"></view>
|
|
<view catch:tap="clearCanvas">清除</view>
|
|
</view>
|
|
<scroll-view scroll-x style="height: 90rpx;">
|
|
<view style="white-space: nowrap;">
|
|
<block wx:for="{{colors}}" wx:key="index">
|
|
<view style="background-color: {{item}};" class="colorBtn {{selectColor == item && 'select'}}" catch:tap="colorChange" data-color="{{item}}"></view>
|
|
</block>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<view class="bars {{showBars && 'show'}}" wx:if="{{showBars}}">
|
|
<view class="space vertical_center">
|
|
<view style="width: 136rpx;">字号：</view>
|
|
<slider style="flex: 1;" value="{{selectSize}}" step="1" min="1" max="20" block-size="12" activeColor="#a88cf8" bindchange="sizeHandler" />
|
|
<view style="width: 50rpx; text-align: right;">{{selectSize}}</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="choose-box-flex" wx:if="{{clear}}">
|
|
<view class="choose-item" bindtap="chooseEraser">
|
|
<view class="choose-img" style='background: url("http://ov8a2tdri.bkt.clouddn.com/wx-app/icon-5.png") white no-repeat; background-size: 26px 26px;background-position: 2px 2px; border: {{eraser ? "2px solid #888" : "2px solid transparent"}}'></view>
|
|
<view>橡皮擦</view>
|
|
</view>
|
|
<view class="choose-item" bindtap="clearCanvas">
|
|
<view class="choose-img" style='background: url("http://ov8a2tdri.bkt.clouddn.com/wx-app/icon-4.png") white no-repeat; background-size: 26px 26px;background-position: 2px 2px;'></view>
|
|
<view>清空</view>
|
|
</view>
|
|
</view> -->
|
|
</view> |