《AN移动端手势测试与制作》由会员分享，可在线阅读，更多相关《AN移动端手势测试与制作（22页珍藏版）》请在金锄头文库上搜索。
1、劇代AN移动端手势测试与制作制作工具AN （版本 CC） 目标案例移动端手势交互测试与制作要求掌握AN或Adobe FLASH基本面板和面板大致功能为前提过程演示场景建立常规类型: HTWL5 Canvas0 WebGLfJ宽仙）:像素1111 dJActlonScript3.0AIR for DesktopAIR for AndroidQ AIR for iOSQ ActionScript3.0 类Q ActionScript3.0 接口Q ActionScript 文件1334橡素高(H):新建文档（不要选成 ActionScript 3.0，是做 FLASH 的）41. S形状ffl位蛊
2、和犬10.00口填充和笔触HD討Y: 40.00宽：750.00高：昭按住Alt拖拽复制一个设置高度88趣L) 取i肖全选M 反转选区Ctrl + ACtrl-I-Shift4-A蜩CD封囲A对芥邠剧图层(D)Ctrl 4-Shift 4-D分布到关键帧旧Ctrl 4-Shift 4-K运动路径1转换为刑牛,另存为动画预设转换为位囹EF rrs*ur-属性里设置实例名称(之后如需添加元件命名建议英文下划线加数字，不要用中文和其他特殊字符)对象建立做球测试用，圆形工具绘制形状，然后用选择工具框选修改一半颜色选中F8转为元件影片剪辑*记住这个名字，这里我命名的是 circle新建图层命名为 Act
3、ions选中第一帧，按F9,接下来我们添加事件移动事件和测试F9 进入后，检查核对下图层和帧数Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;命名.addEve ntListe ner(TouchEve nt.TOUCH_BEGIN, fl_TouchBegi nHan dler_2); 命名.addEve ntListe ner(TouchEve nt.TOUCH_END, fl_TouchE ndHa ndler_2);var fl_DragBounds_2:Rectangle = new Rectangle(0, 0, sta
4、ge.stageWidth, stage.stageHeight);function fl_TouchBeginHandler_2(event:TouchEvent):voidevent.target.startTouchDrag(event.touchPointID, false, fl_DragBounds_2);function fl_TouchEndHandler_2(event:TouchEvent):voidevent.target.stopTouchDrag(event.touchPointID);Ctrl+回车，会出现三个窗，关闭.swf窗Touch: () Click and
5、 drag这次测试的是单指拖拽，选中该项触控大小可以调整，iOS双倍精度下，最小区域应该为44,以这个为基准测试y劇代丄-与时代同频该项为移动事件，下面我们来做多触点的多触点移动事件Multitouch.inputMode = MultitouchInputMode.GESTURE;命名.addEve ntListe ner(Tra nsformGestureEve nt.GESTURE_PAN, fl_Pa nHan dler_4);function fl_PanHandler_4(event:TransformGestureEvent):void event.currentTarget.x
6、 += event.offsetX; event.currentTarget.y += event.offsetY;放在之前代码下面劇代irsource.每次测试建议关闭，再Ctrl+回车重新生成一次选择 Pan 项y臓代丄-与时代同频o节聽码时代IF rrwure*,第一次点击出现第一个点，第二次拖拽操作缩放事件 夹捏舞台会放大所选对象Multitouch.inputMode = MultitouchInputMode.GESTURE;stage.addEventListener(TransformGestureEvent.GESTURE_ZOOM, fl_ZoomHandler_5);fu
7、nction fl_ZoomHandler_5(event:TransformGestureEvent):void 命名.scaleX *= eve nt.scaleX;命名.scaleY *= eve nt.scaleY;0 Touch layerAlpha: Q20%Relo 匚 ateTouch:匸i Click and drag匸】Press and tap rTwo-finger tapGesture: Qi PanO Rotate ZoomtswipeInstr uc tion:1. Click to place the 1st touch point,2. Move mouse
8、to another position.3. Press down the mouse button and rriove to simulate.旋转事件时代rrwJrce,臓代iTsource.通常通过顺时针或逆时针移动两根手指来旋转所选对象Multitouch.inputMode = MultitouchInputMode.GESTURE;命名.addEve ntListe ner(Tra nsformGestureEve nt.GESTURE_ROTATE, fl_RotateHa ndler_3) function fl_RotateHandler_3(event:Transform
9、GestureEvent):void event.target.rotation += event.rotation;节钢时代r iTSOurce.RelocateF懿时代滑动事件 滑动舞台会执行包含您的自定义代码的函数。您可以使用此事件滚动文本字段中的文本或在您的应用程序中更 改状态。Multitouch.inputMode = MultitouchInputMode.GESTURE;stage.addEventListener (TransformGestureEvent.GESTURE_SWIPE, fl_SwipeHandler_3);function fl_SwipeHandler_
10、3(event:TransformGestureEvent):void switch(event.offsetX)/ 向右滑动case 1:/ 开始您的自定义代码/ 此示例代码将选定的对象向右移动 40 像素 命名.x += 40;/ 结束您的自定义代码break;/ 向左滑动case -1:/ 开始您的自定义代码/ 此示例代码将选定的对象向左移动 40 像素 命名.x -= 40;/ 结束您的自定义代码break;switch(event.offsetY)/ 向下滑动臓代irsource.case 1:/ 开始您的自定义代码/ 此示例代码将选定的对象向下移动 40 像素命名.y += 40；/ 结束您的自定义代码break；/ 向上滑动case -1:/ 开始您的自定义代码/ 此示例代码将选定的对象向上移动 40 像素命名.y -= 40;/ 结束您的自定义代码break;滑动操作可离开影片剪辑进行，多用于大图模式浏览 生成节劇代r irsource.发布y臓代-与时代同频节臟时代r iTeource.IOS 需要发布证书转换为卜HTML5 Canvas发布设冒.Ctrl-FShift+F12WebGL可菜单栏文件转换为 Html5 Canvas本文由源码时代老师原创提供
