我想让程序响应滑动条拖拽的消息，但是刚学编程，不知道如何编制函数，请问有哪几个步骤？

Posted 2023-05-17

滚动条消息：WM_VSCROLL（上下方向的滚动条）和WM_HSCROLL（左右）消息

对于来自作为窗口的一部分而建立的滚动条消息，忽略lParam；它只用于作为子窗口而建立的滚动条（通常在对话框内）。

wParam消息参数被分为一个低字组和一个高字组。

wParam的低字组是一个数值，它指出了鼠标对滚动条进行的操作。这个数值被看作一个「通知码」。

通知码的值由以SB（scroll bar）开头的标识符定义。以下是在WINUSER.H中定义的通知码：

#define SB_LINEUP 0 #define SB_LINELEFT 0
#define SB_LINEDOWN 1 #define SB_LINERIGHT 1

#define SB_PAGEUP 2#define SB_PAGELEFT 2
#define SB_PAGEDOWN 3
#define SB_PAGERIGHT 3

#define SB_THUMBPOSITION 4
#define SB_THUMBTRACK 5

#define SB_TOP 6
#define SB_LEFT 6

#define SB_BOTTOM 7

#define SB_RIGHT 7

#define SB_ENDSCROLL 8

包含LEFT和RIGHT的标识符用于水平滚动条，包含UP、DOWN、TOP和BOTTOM的标识符用于垂直滚动条。
按住滑块的里面有THUMB 按住箭头的里面有LINE 按住滚动条空白区的有PAGE
SB_TOP、SB_BOTTOM、SB_LEFT和SB_RIGHT通知码，指出滚动条已经被移到了它的最小或最大位置。
作为应用程序窗口一部分而建立的滚动条不会接收到SB_TOP、SB_BOTTOM、SB_LEFT和SB_RIGHT，除非用SendMessage发送来的。

如果在滚动条的各个部位按住鼠标键，程序就能收到多个滚动条消息。
当释放鼠标键后，程序会收到一个带有SB_ENDSCROLL通知码的消息，这个消息没大用，Windows不会去改变卷动方块的位置

在wParam的低字组是SB_THUMBTRACK时，wParam的高字组是使用者在拖动卷动方块时的目前位置。

在wParam的低字组是SB_THUMBPOSITION时，wParam的高字组是使用者释放鼠标键后卷动方块的最终位置。

SetScrollInfo/GetScrollInfo 设置/获取滚动条信息

typedef struct tagSCROLLINFO



UINT cbSize ;// set to sizeof (SCROLLINFO)

UINT fMask ; // values to set or get

int nMin ; // minimum range value

int nMax ; // maximum range value

UINT nPage ; // page size

int nPos ; // current position

int nTrackPos ;// current tracking position

SCROLLINFO

fMask字段：
SIF_RANGE旗标：滚动条范围，操作nMin和nMax字段。

SIF_POS旗标：当前位置，nPos字段。

SIF_PAGE旗标：页面大小，nPage字段。如果不想得到比例化的滚动条，就不要使用该旗标。

SIF_TRACKPOS旗标：单独使用，nTrackPos字段，卷动方块位置。

SIF_DISABLENOSCROLL旗标：指定了此旗标，而且新的滚动条参数使滚动条消失，则该滚动条就不能使用了（下面会有更多的解释）。

SIF_ALL旗标是SIF_RANGE、SIF_POS、SIF_PAGE和SIF_TRACKPOS的组合。

在WM_SIZE消息处理期间设置滚动条参数时，这是很方便的（在SetScrollInfo函数中指定SIF_TRACKPOS后，它会被忽略）。这在处理滚动条消息时也是很方便的。
//给你一个完整的程序
// 编写一个程序，显示一些可以从GetSystemMetrics呼叫中取得的信息
//建立一个结构体数组，将该函数支持的索引值与标识符、功能描述三者对应起来
//输出这个结构体数组，每种视觉组件一行。
#include <windows.h>
#include <tchar.h>
#include <stdio.h>

typedef struct

int index;
TCHAR *defmacro;
TCHAR *functiontip;
METRICS;

METRICS metrics[]=


SM_CXSCREEN, TEXT ("SM_CXSCREEN"),

TEXT ("屏幕宽度，单位像素"),

SM_CYSCREEN, TEXT ("SM_CYSCREEN"),

TEXT ("屏幕高度，单位像素"),

SM_CXVSCROLL, TEXT ("SM_CXVSCROLL"),

TEXT ("垂直滚动条宽度"),

SM_CYHSCROLL, TEXT ("SM_CYHSCROLL"),

TEXT ("水平滚动条高度"),

SM_CYCAPTION, TEXT ("SM_CYCAPTION"),

TEXT ("标题栏高度"),

SM_CXBORDER, TEXT ("SM_CXBORDER"),

TEXT ("窗口边框宽度"),

SM_CYBORDER, TEXT ("SM_CYBORDER"),

TEXT ("窗口边框高度"),

SM_CXFIXEDFRAME,TEXT ("SM_CXFIXEDFRAME"),

TEXT ("对话框窗口框架宽度"),

SM_CYFIXEDFRAME,TEXT ("SM_CYFIXEDFRAME"),

TEXT ("对话框窗口框架高度"),

SM_CYVTHUMB, TEXT ("SM_CYVTHUMB"),

TEXT ("垂直滚动条滑块高度"),

SM_CXHTHUMB, TEXT ("SM_CXHTHUMB"),

TEXT ("水平垂直滚动条滑块宽度"),

SM_CXICON, TEXT ("SM_CXICON"),

TEXT ("图标宽度"),

SM_CYICON, TEXT ("SM_CYICON"),

TEXT ("图标高度"),

SM_CXCURSOR, TEXT ("SM_CXCURSOR"),

TEXT ("鼠标宽度"),

SM_CYCURSOR, TEXT ("SM_CYCURSOR"),

TEXT ("鼠标高度"),

SM_CYMENU, TEXT ("SM_CYMENU"),

TEXT ("菜单栏高度"),

SM_CXFULLSCREEN,TEXT ("SM_CXFULLSCREEN"),

TEXT ("整个屏幕客户区宽度"),

SM_CYFULLSCREEN,TEXT ("SM_CYFULLSCREEN"),

TEXT ("整个屏幕客户区高度，扣除任务栏"),

SM_CYKANJIWINDOW,TEXT ("SM_CYKANJIWINDOW"),

TEXT ("Kanji window height"),

SM_MOUSEPRESENT, TEXT ("SM_MOUSEPRESENT"),

TEXT ("鼠标是否安装标志0没有，非0有"),

SM_CYVSCROLL,TEXT ("SM_CYVSCROLL"),

TEXT ("垂直滚动条箭头高度"),

SM_CXHSCROLL,TEXT ("SM_CXHSCROLL"),

TEXT ("水平滚动条箭头宽度"),

SM_DEBUG, TEXT ("SM_DEBUG"),

TEXT ("Debug version flag"),

SM_SWAPBUTTON,TEXT ("SM_SWAPBUTTON"),

TEXT ("鼠标左右键交换标志0没有非0交换"),

SM_CXMIN, TEXT ("SM_CXMIN"),

TEXT ("窗口的最小宽高度"),

SM_CYMIN, TEXT ("SM_CYMIN"),

TEXT ("窗口的最小高度"),

SM_CXSIZE, TEXT ("SM_CXSIZE"),

TEXT ("标题栏的按钮的宽度"),

SM_CYSIZE, TEXT ("SM_CYSIZE"),

TEXT ("标题栏的按钮的高度"),

SM_CXSIZEFRAME,TEXT ("SM_CXSIZEFRAME"),

TEXT ("Window sizing frame width"),

SM_CYSIZEFRAME,TEXT ("SM_CYSIZEFRAME"),

TEXT ("Window sizing frame height"),

SM_CXMINTRACK,TEXT ("SM_CXMINTRACK"),

TEXT ("可变大小窗口的最小宽度"),

SM_CYMINTRACK,TEXT ("SM_CYMINTRACK"),

TEXT ("可变大小窗口的最小宽度"),

SM_CXDOUBLECLK,TEXT ("SM_CXDOUBLECLK"),

TEXT ("可视为鼠标双击的矩形范围宽度"),

SM_CYDOUBLECLK,TEXT ("SM_CYDOUBLECLK"),

TEXT ("可视为鼠标双击的矩形范围高度"),

SM_CXICONSPACING,TEXT ("SM_CXICONSPACING"),

TEXT ("列表框等的元素为图标时，为其分配的宽度>=SM_CXICON"),

SM_CYICONSPACING,TEXT ("SM_CYICONSPACING"),

TEXT ("列表框等的元素为图标时，为其分配的高度>=SM_CYICON"),

SM_MENUDROPALIGNMENT,TEXT ("SM_MENUDROPALIGNMENT"),

TEXT ("Left or right menu drop"),

SM_PENWINDOWS, TEXT ("SM_PENWINDOWS"),

TEXT ("Pen extensions installed"),

SM_DBCSENABLED, TEXT ("SM_DBCSENABLED"),

TEXT ("Double-Byte Char Set enabled"),

SM_CMOUSEBUTTONS, TEXT ("SM_CMOUSEBUTTONS"),

TEXT ("鼠标上按钮的个数"),

SM_SECURE, TEXT ("SM_SECURE"),

TEXT ("系统安全机制flag0没有非零有"),

SM_CXEDGE, TEXT ("SM_CXEDGE"),

TEXT ("3-D下窗口边框宽度"),

SM_CYEDGE, TEXT ("SM_CYEDGE"),

TEXT ("3-D窗口边框高度"),

SM_CXMINSPACING, TEXT ("SM_CXMINSPACING"),

TEXT ("最小化窗口在任务栏为其分配的宽度>=SM_CXMINMIZED"),

SM_CYMINSPACING, TEXT ("SM_CYMINSPACING"),

TEXT ("最小化窗口在任务栏为其分配的宽度>=SM_CYMINMIZED"),

SM_CXSMICON, TEXT ("SM_CXSMICON"),

TEXT ("小图标的宽度"),

SM_CYSMICON, TEXT ("SM_CYSMICON"),

TEXT ("小图标的高度"),

SM_CYSMCAPTION, TEXT ("SM_CYSMCAPTION"),

TEXT ("小标题的高度"),

SM_CXSMSIZE, TEXT ("SM_CXSMSIZE"),

TEXT ("小标题按钮的宽度"),

SM_CYSMSIZE, TEXT ("SM_CYSMSIZE"),

TEXT ("小标题按钮的高度"),

SM_CXMENUSIZE, TEXT ("SM_CXMENUSIZE"),

TEXT ("菜单栏按钮的宽度"),

SM_CYMENUSIZE, TEXT ("SM_CYMENUSIZE"),

TEXT ("菜单栏按钮的高度"),

SM_ARRANGE, TEXT ("SM_ARRANGE"),

TEXT ("系统排列最小化窗口的方式"),

SM_CXMINIMIZED, TEXT ("SM_CXMINIMIZED"),

TEXT ("最小化窗口的宽度"),

SM_CYMINIMIZED, TEXT ("SM_CYMINIMIZED"),

TEXT ("最小化窗口的高度"),

SM_CXMAXTRACK, TEXT ("SM_CXMAXTRACK"),

TEXT ("可变大小窗口的最大宽度"),

SM_CYMAXTRACK, TEXT ("SM_CYMAXTRACK"),

TEXT ("可变大小窗口的最大高度"),

SM_CXMAXIMIZED, TEXT ("SM_CXMAXIMIZED"),

TEXT ("最大化窗口的宽度"),

SM_CYMAXIMIZED, TEXT ("SM_CYMAXIMIZED"),

TEXT ("最大化窗口的高度"),

SM_NETWORK, TEXT ("SM_NETWORK"),

TEXT ("Network present flag"),

SM_CLEANBOOT, TEXT ("SM_CLEANBOOT"),

TEXT ("系统启动的方式0正常1安全2带网络功能的安全模式"),

SM_CXDRAG, TEXT ("SM_CXDRAG"),

TEXT ("避免无效拖动的矩形宽度"),

SM_CYDRAG, TEXT ("SM_CYDRAG"),

TEXT ("避免无效拖动的矩形高度"),

SM_SHOWSOUNDS, TEXT ("SM_SHOWSOUNDS"),

TEXT ("Present sounds visually"),

SM_CXMENUCHECK, TEXT ("SM_CXMENUCHECK"),

TEXT ("菜单项选中的宽度"),

SM_CYMENUCHECK, TEXT ("SM_CYMENUCHECK"),

TEXT ("菜单项选中的高度"),

SM_SLOWMACHINE, TEXT ("SM_SLOWMACHINE"),

TEXT ("是否安装了低端的处理器TRUE有"),

SM_MIDEASTENABLED, TEXT ("SM_MIDEASTENABLED"),

TEXT ("Hebrew and Arabic enabled flag")

;
/*
SM_MOUSEWHEELPRESENT,TEXT ("SM_MOUSEWHEELPRESENT"),

TEXT ("Mouse wheel present flag"),

SM_XVIRTUALSCREEN, TEXT ("SM_XVIRTUALSCREEN"),

TEXT ("Virtual screen x origin"),

SM_YVIRTUALSCREEN, TEXT ("SM_YVIRTUALSCREEN"),

TEXT ("Virtual screen y origin"),

SM_CXVIRTUALSCREEN, TEXT ("SM_CXVIRTUALSCREEN"),

TEXT ("Virtual screen width"),

SM_CYVIRTUALSCREEN, TEXT ("SM_CYVIRTUALSCREEN"),

TEXT ("Virtual screen height"),

SM_CMONITORS, TEXT ("SM_CMONITORS"),

TEXT ("在NT5.0中指定监视器的数量"),

SM_SAMEDISPLAYFORMAT,TEXT ("SM_SAMEDISPLAYFORMAT"),

TEXT ("Same color format flag")
*/
#define NUMLINES (sizeof(metrics)/sizeof(METRICS))
CALLBACK mywindowproc(HWND hwnd,UINT message,UINT wParam,UINT lParam);
HINSTANCE hInst;

int APIENTRY WinMain(HINSTANCE hInstance,
HINSTANCE hPrevInstance,
LPSTR lpCmdLine,
int nCmdShow)

WNDCLASSEX wndclassex;
MSG msg;
HWND hwnd;

hInst=hInstance;

wndclassex.cbSize=sizeof(WNDCLASSEX);
wndclassex.cbClsExtra=0;
wndclassex.cbWndExtra=0;
wndclassex.hbrBackground=(HBRUSH)GetStockObject(WHITE_BRUSH);
wndclassex.hCursor=LoadCursor(NULL,IDC_CROSS);
wndclassex.hIcon= LoadIcon (NULL, IDI_APPLICATION) ;
wndclassex.hIconSm=NULL;
wndclassex.hInstance=hInst;
wndclassex.lpfnWndProc=(WNDPROC)mywindowproc;
wndclassex.lpszClassName=TEXT("system metrics");
wndclassex.lpszMenuName=NULL;
wndclassex.style=CS_HREDRAW|CS_VREDRAW;

if(!RegisterClassEx(&wndclassex))

MessageBox(NULL,TEXT("this program must running at WIN NT system!"),TEXT("error"),MB_OK);
return 0;


hwnd=CreateWindowEx(WS_EX_RTLREADING,TEXT("system metrics"),TEXT("FEEEEE"),WS_OVERLAPPEDWINDOW|WS_VSCROLL|WS_HSCROLL,CW_USEDEFAULT,CW_USEDEFAULT,CW_USEDEFAULT,CW_USEDEFAULT,NULL,NULL,hInst,NULL);

ShowWindow(hwnd,SW_NORMAL);
UpdateWindow(hwnd);

while(GetMessage(&msg,0,NULL,NULL))

TranslateMessage(&msg);
DispatchMessage(&msg);


return 0;


int CALLBACK mywindowproc(HWND hwnd,UINT message,UINT wParam,UINT lParam)


TEXTMETRIC tm;
HDC hdc;
PAINTSTRUCT ps;
static int cxChar,cyChar,cxCaps;
static int cxClient,cyClient;
int i;
int ipos;
SCROLLINFO scrollinfo;
int wmId,wmEvent;
TCHAR strbuffer[256];
METRICS *p;

RECT rt;
int begin,end;

switch(message)

case WM_CREATE:
hdc=GetDC(hwnd);
GetTextMetrics(hdc,&tm);
cxChar=tm.tmAveCharWidth;
cxCaps=(tm.tmPitchAndFamily&1?3:2)*cxChar/2;
cyChar=tm.tmHeight+tm.tmExternalLeading;
ReleaseDC(hwnd,hdc);
break;
case WM_COMMAND:
wmId=LOWORD(wParam);
wmEvent=HIWORD(wParam);
switch(wmId)

case 0:
break;
default:
break;

break;
case WM_PAINT:
hdc=BeginPaint(hwnd,&ps);

scrollinfo.cbSize=sizeof(SCROLLINFO);
scrollinfo.fMask=SIF_POS;
GetScrollInfo(hwnd,SB_VERT,&scrollinfo);
ipos=scrollinfo.nPos;//ipos代表了显示在客户区的第一行在所有文字中的行数

begin=ipos+ps.rcPaint.top/cyChar-1;
end=min(ps.rcPaint.bottom/cyChar+ipos,NUMLINES)-1;

TextOut(hdc,0,-ipos*cyChar,TEXT("INDEX"),_tcslen(TEXT("INDEX")));

TextOut(hdc,5*cxCaps,-ipos*cyChar,TEXT("标识符"),_tcslen(TEXT("标识符")));

TextOut(hdc,25*cxCaps,-ipos*cyChar,TEXT("功能"),_tcslen(TEXT("功能")));

TextOut(hdc,65*cxCaps,-ipos*cyChar,TEXT("GetSysystemMetrics返回值"),_tcslen(TEXT("GetSysystemMetrics返回值")));
if(begin<0)

begin=0;

for(i=begin;i<=end;i++)


//index
TextOut(hdc,0,(i-ipos+1)*cyChar,strbuffer,_stprintf(strbuffer,TEXT("%d"),metrics[i].index));

TextOut(hdc,5*cxCaps,(i-ipos+1)*cyChar,metrics[i].defmacro,_tcslen(metrics[i].defmacro));

TextOut(hdc,25*cxCaps,(i-ipos+1)*cyChar,metrics[i].functiontip,_tcslen(metrics[i].functiontip));

TextOut(hdc,65*cxCaps,(i-ipos+1)*cyChar,strbuffer,_stprintf(strbuffer,TEXT("%d"),GetSystemMetrics(metrics[i].index)));

EndPaint(hwnd,&ps);
break;

case WM_VSCROLL:
scrollinfo.cbSize=sizeof(SCROLLINFO);
scrollinfo.fMask=SIF_ALL;
GetScrollInfo(hwnd,SB_VERT,&scrollinfo);
ipos=scrollinfo.nPos;

switch(LOWORD(wParam))//通知码

case SB_LINEUP:
scrollinfo.nPos--;
break;
case SB_LINEDOWN:
scrollinfo.nPos++;
break;
case SB_PAGEUP:
scrollinfo.nPos-=scrollinfo.nPage;
break;
case SB_PAGEDOWN:
scrollinfo.nPos+=scrollinfo.nPage;
break;

case SB_ENDSCROLL:
break;

case SB_TOP:
scrollinfo.nPos=scrollinfo.nMin;
break;
case SB_BOTTOM:
scrollinfo.nPos=scrollinfo.nMax;
break;

case SB_THUMBTRACK:
break;
case SB_THUMBPOSITION:
scrollinfo.nPos=scrollinfo.nTrackPos;
break;


scrollinfo.fMask=SIF_POS;
SetScrollInfo(hwnd,SB_VERT,&scrollinfo,TRUE);

GetScrollInfo (hwnd, SB_VERT, &scrollinfo) ;
if (scrollinfo.nPos != ipos)

ScrollWindow (hwnd, 0, cyChar * (ipos - scrollinfo.nPos),NULL, NULL) ;
//滚动整个显示区域，ipos - scrollinfo.nPos为负值表示向上滚动
//并将未被滚动操作覆盖的区域设为无效矩形
UpdateWindow (hwnd) ;

break;

case WM_SIZE:
cxClient=LOWORD(lParam);//客户区的宽度
cyClient=HIWORD(lParam);//客户区的高度

scrollinfo.cbSize=sizeof(SCROLLINFO);
scrollinfo.fMask=SIF_RANGE|SIF_PAGE;
scrollinfo.nMax=NUMLINES-1;
scrollinfo.nMin=0;
scrollinfo.nPage=cyClient/cyChar;
SetScrollInfo(hwnd,SB_VERT,&scrollinfo,TRUE);

break;
case WM_DESTROY:
PostQuitMessage(0);
break;


return DefWindowProc(hwnd,message,wParam,lParam);
参考技术A OnHScroll

OnVScroll 参考技术B 刚好我最近刚做完一个自定义滚动条，你做的是不是MFC 参考技术C 上网查

使用movable-view制作可拖拽的微信小程序弹出层效果。

仿了潮汐睡眠小程序的代码。【如果有侵权联系删除

最近做的项目有个弹出层效果，类似音乐播放器那种。按照普通的做了一般感觉交互不是很优雅，设计妹子把潮汐睡眠的弹层给我看了看，感觉做的挺好，于是乘着有空仿照了一下。

首先善用度娘反编译弄到了源码，但是打不开。然后自己研究源码发现他们用的是movable-view实现的。

于是仿照着搭出了基础框架。

 

新建了个组件

wxml

<!--components/playpanel/playpanel.wxml-->
<movable-area style="height:areaHpx;"  class="wrapper">
  <movable-view  bindchange="onPresent" bindtouchend="dragPanelEnd" bindtouchstart="dragPanelStart" class="sleep-panel-wrapper" damping="40" direction="vertical" friction="1" inertia="false" outOfBounds="false" style="padding-top:0px" x="0" y="sleepPanelPosition" class="panel">
  
  <view class="" bindtap="presentPanel" hover-class="none" hover-stop-propagation="false">
    背景内容
  </view>
  </movable-view>
</movable-area>
<scroll-view scroll-y style="height:400rpx"  class="scroll-w" wx:if="showlist">
    歌曲列表
    <view id="green" class="scroll-view-item bc_green"></view>
    <view id="red"  class="scroll-view-item bc_red"></view>
    <view id="yellow" class="scroll-view-item bc_yellow"></view>
    <view id="blue" class="scroll-view-item bc_blue"></view>
  </scroll-view>

歌曲列表提取出来是因为滚动组件和可拖拽的手势事件会互相影响，如果不需要弹出层有可滚动的区域可以无视。

 

js部分精简一下就是这样，abcd这些变量名应该是源码做了加密……appjs里还要定义一下初始数据

// components/playpanel/playpanel.js
let d =  getApp();
Component(
  /**
   * 组件的属性列表
   */
  properties: 
    areaH:Number
  ,

  /**
   * 组件的初始数据
   */
  data: 
    sleepPanelPosition: d.globalData.screenHeight - (d.globalData.isFullScreen ? 24 : 0) - 80 / (375 / d.globalData.screenWidth),
    topPosition: d.globalData.statusBarHeight + d.globalData.navBarHeight,
    bottomPosition: d.globalData.screenHeight - (d.globalData.isFullScreen ? 24 : 0) - 80 / (375 / d.globalData.screenWidth),
    presentProgress: 0,
    disableAnimated: !1,
    showlist:false,
  ,

  /**
   * 组件的方法列表
   */
  methods: 
    dragPanelEnd(e) 
      
      let changedTouches = e.changedTouches;
      let pageY = changedTouches[0].pageY;
      let topPosition = this.data.topPosition;
      let bottomPosition = this.data.bottomPosition;
      let distance = pageY - this.dragOrigin;
      let speed = (bottomPosition - topPosition)/10;
      
      let h = 0;
      h = this.data.sleepPanelPosition === topPosition ? distance > speed ? bottomPosition : topPosition : distance < -speed ?topPosition : bottomPosition,this.setData(
          sleepPanelPosition: h,
          showlist: h === topPosition
      );
   
  ,
  presentPanel() 
    const sleepPanelPosition: a, topPosition: b, bottomPosition: c = this.data;
    this.setData(
        sleepPanelPosition: a === b ? c : b,
    );
    let showList = this.data.sleepPanelPosition === b
    this.setData(
      showlist: showList
    )
,
  dragPanelStart(a) 
    const changedTouches: b = a;
    if (b[0]) 
        const pageY: a = b[0];
        this.dragOrigin = a;
    
,
    onPresent(detail: a) 
      const y: b = a, topPosition: c, bottomPosition: d = this.data, e = 1 - parseInt(1e3 * ((b - c) / (d - c))) / 1e3;
      e !== this.data.presentProgress && this.setData(
          presentProgress: e
      ), this.data.disableAnimated || this.setData(
          disableAnimated: !0
      ), clearTimeout(this.recoverAnimation), this.recoverAnimation = setTimeout(() => 
          this.setData(
              disableAnimated: !1
          ), this.recoverAnimation = null;
      , 100);
  ,
  
)

//app.js
```
 onShow() 
    wx.getSystemInfo(
      success: a => 
        const 
          screenHeight: b,
          screenWidth: c,
          statusBarHeight: d
         = a;
        this.globalData.isFullScreen = parseInt(100 * (c / b)) < parseInt(100 * (9 / 17)),
          this.globalData.isBiggerScreen = 667 < b, this.globalData.statusBarHeight = d, this.globalData.navBarHeight = 44,
          this.globalData.navBarFontSize = 18.5, this.globalData.btnScopeSize = 40, this.globalData.btnSize = 32,
          this.globalData.screenHeight = b, this.globalData.screenWidth = c;
      
    );
  ,
```

wxss部分，主要是.panel不要设置top值，其他好像没啥。

/* components/playpanel/playpanel.wxss */
.wrapper 
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100vw;
    height: 200vh;
    pointer-events:none;

.panel 
    width: 100%;
    background: rgba(233, 233, 255, 0.8);
    height: 100vh;
    pointer-events: auto;

.scroll-view-item 
    height: 300rpx;

.bc_green 
    background: green;

.bc_red 
    background: red;

.bc_yellow 
    background: yellow;

.bc_blue 
    background: blue;

.scroll-w 
    position: fixed;
    bottom: 0;