今天达内昆明UI培训和你们分享的是如何经过多动态面板套用来实现上下滑动不会超出屏幕框架。html
1、元件准备框架
top（头部）、beijing（背景）、bottom（底部）、cours（课程）、drag（拖动）。ui
注：top和bottom保持在顶层，beijing为矩形，此处应去掉边框，cours和drag是动态面板，全部元件的宽度相同htm
2、排版get
beijing紧挨top底边且对齐放置，bottom紧挨beijing底部放置，接着course以头部对齐的方式覆盖到beijing上，最后drag以头部对齐的方式覆盖到course上。原型
注：若是bottom以前忘记点击顶层，是会被覆盖住，这个时候要将其放置顶层。class
3、添加用例top
1 drag移动时，移动course动态面板，默认跟随。分享
2 drag拖动时，自身垂直拖动。移动
3 drag拖动时，编辑条件 若是drag的顶部大于top的底部，则drag移动到绝对位置(达到) x:0, y:[[t.bottom]]。
4 drag拖动时，编辑条件 若是drag的底部小于bottom的顶部，则drag移动到绝对位置(达到) x:0, y:[[b.top-d.height)]]。
5将排版好的原型再次转换成动态面板，嵌到高保真手机壳上，而且将新的动态面板的底边向上拉动，直到与bottom的底边重合。
http://km.ui.tedu.cn/news/178492.html