wxapp-market

npm install @ohos/wxapp_market --save

<element src='../../common/component/wheel/wheel.hml'></element>
<div class="container">
    <wheel areaNumber=" {{ areaNumber }}"
           speed=" {{ speed }}"
           awardNumer=" {{ awardNumer }}"
           mode=" {{ mode }}">
    </wheel>
</div>

        areaNumber: 8,   //抽奖间隔
        speed: 16,       //转动速度
        awardNumer: 2,   //中奖区域从1开始
        mode: 1,         //1是指针旋转，2为转盘旋转

<element src='../../common/component/scratch/scratch.hml'></element>
<div class="container">
 <scratch      canvasWidth="{{canvasWidth}}"
               imageResource="{{imageResource}}"
               r="{{r}}"
               awardTxt="{{awardTxt}}"
               awardTxtColor="{{awardTxtColor}}"
               awardTxtFontSize="{{awardTxtFontSize}}">
 </scratch>
</div>

     canvasWidth: 197,
     canvasHeight: 72,
     imageResource: 'https://misc.aotu.io/pfan123/wx/placeholder.png',
     maskColor: 'red',
     r: 4,
     awardTxt: '中大奖',
     awardTxtColor: '#3985ff',
     awardTxtFontSize: '24px',

<element src='../../common/component/slotMachine/slotMachine.hml'></element>
<div class="container">
 <slotMachine height="{{ height }}"
              len="{{ len }}"
              num1="{{ num1 }}"
              transY1="{{ transY1 }}"
              num2="{{ num2 }}"
              transY3="{{ transY3 }}"
              num3="{{ num3 }}"
              transY4="{{ transY4 }}"
              num4="{{ num4 }}"
              transY1="{{ transY1 }}"
              speed="{{ speed }}">
 </slotMachine>
</div>

     height: 40, // 单个数字高度
     len: 10,
     transY1: 0,
     num1: 3,
     transY2: 0,
     num2: 0,
     transY3: 0,
     num3: 0,
     transY4: 0,
     num4: 1,
     speed: 24,

<element src='../../common/component/fruitMachine/fruitMachine.hml'></element>
<div class="container">
 <fruitMachine ret="{{ret}}}" speed="{{speed}}"></fruitMachine>
</div>

     title:"水果机",
     ret: 8, // 取值1～8
     speed: 100,

<element src='../../common/component/card/card.hml'></element>
<card data="{{ data }}"></card>

data: [
     {
         inlineStyle: '', isBack: false, isMove: false, award: '一等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '二等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '三等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '四等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '五等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '六等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '七等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '八等奖'
     },
     {
         inlineStyle: '', isBack: false, isMove: false, award: '九等奖'
     }
 ],

<element src='../../common/component/shake/shake.hml'></element>
<div class="container">
 <shake shakeThreshold="{{shakeThreshold}}}"></shake>
</div>

     shakeThreshold: 100, // 阈值

<element src='../../common/component/lock/lock.hml'></element>
<lock canvasWidth="{{ canvasWidth }}"
   canvasHeight="{{ canvasHeight }}"
   canvasId="{{ canvasId }}"
   drawColor="{{ drawColor }}"></lock>

     canvasWidth: 300,
     canvasHeight: 300,
     canvasId: 'canvasLock',
     drawColor: '#3985ff'

|---- wxapp_market  
|     |---- entry  # 示例代码文件夹
|     |---- wxapp_market  # wxapp_market库文件夹
|           |---- src/main/js/components
|                 |---- wheel  # 大转盘组件
|                 |---- titlebar  # 状态栏组件
|                 |---- slotMachine  # slot组件
|                 |---- shake  # 摇一摇组件
|                 |---- scratch  # 刮刮乐组件
|                 |---- lock  # 手势解锁组件
|                 |---- fruitMachine  # 水果机组件
|                 |---- card  # 九宫格翻纸牌组件
|           |---- index.ets  # 对外接口
|     |---- README.MD  # 安装使用方法