【频道】软件教程集锦
分享给站外好友
页面地址：
FLASH地址：
HTML代码：
通用代码：
可以让视频在手机、平板电脑上播放！
举报此视频包含不当内容：
请填写你要举报的内容，标明举报内容所在地时段，将有助于我们更及时的处理举报内容。感谢您对PPS的支持!
广告和欺诈
触犯我的版权
你可以把视频下载到不同的设备
使用电脑飞速下载轻易收藏喜欢的视频
使用苹果设备支持iPhone、iPad高清视频亦可离线观看
使用Android设备支持手机、平板高清视频亦可离线观看
拍下二维码，视频随身看
用PPS影音IOS/Android版扫描二维码，在您的移动设备上继续观看视频，也可以分享给您的好友。
使用Fireworks在Axure中制作Sprite动画与按钮交互
手机没装PPS影音？
频道信息：
软件教程集锦
播放：12.85万
对不起，该频道暂无简介！
注：数据来自爱奇艺、PPS全平台
使用Fireworks在Axure中制作Sprite动画与按钮交互
上传时间：15个月前
上 传 者：想想卿
所属频道：软件教程集锦
上 传 自：
分&&&&&&类：教育
暂无相关内容
视频简介：对不起，该视频暂无简介！
现在可以用QQ账号直接发表评论，分享给我的好友
大家都在看
互联网药品信息服务许可证：
互联网医疗保健信息服务许可证：
Copyright&2005 - 2014 PPStream, Inc. All Rights Reserved站内网址搜索
本页最后更新： 15:48:50【Axure RP社区】
网站分类：
网站名称：
收录查询：
网站标签：
44957导航申明：本站全部资料取之于网、均为免费，请大家参考使用本站资料时，谨慎选择、自辩真伪、后果自负。
网站简介：
如果你是网站产品经理、项目经理、网站策划、原型设计师、交互设计师，甚至急切想表达想法验证想法的Boss.
一起认识它...Axure下载与相关资源
Axure RP英文正式版下载
如果你还在因为使用了Word、Visio、PowerPoint、Dreamweaver或Photoshop等工具，在表达想法和原型时感到制作缓慢、效果粗犷、不易理解、无交互体现、修改困难等问题而头痛不已……那么你肯定正在寻找一款可以快速实现、准确表达、带有交互效果且易于上手的原型设计利器。如今 Axure RP 正在帮你实现这一心愿，将你在内心踌躇已久的种种想法带进可以准确传递、快速验证的原型呈现阶段。甚至你不需要了解一行程序代码即可轻松做到这一切。
【最新来访网站】
?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&
【相关点出网站】
?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&?&
Copyright&
All Right Reserved
强烈建议使用 IE5.0 以上浏览器 分辨率Axure交互设计实例介绍_百度文库
两大类热门资源免费畅读
续费一年阅读会员，立省24元！
评价文档：
Axure交互设计实例介绍
上传于||暂无简介
大小：955.63KB
登录百度文库，专享文档复制特权，财富值每天免费拿！
你可能喜欢&接上一篇系列文章，在本文中，将在WebStorm中继续开发，实现页面的功能。这需要一个页面一个页面的开发，来完成功能。本文将侧重把所有页面的UI都实现出来，先把前端的工作都完成了，然后再去链接后端的 RESTful Service。
登陆页面给页面添加 login.html 添加页面Html代码。&
&ion-view title="用户登录"&
&ion-content class="padding"&
&div class="login-title"&
&h2 class="energized"&方便每一天&/h2&
&h2 class="assertive"&配送系统&/h2&
&form novalidate="novalidate" on-valid-submit="doLogin()"&
&label class="item item-input validated"&
&span class="input-label" for="account"&账号&/span&
&input id="account" type="text" ng-model="user.name" placeholder="账号" required="required" name="account" /&
&i class="icon ion-alert-circled error"&&/i&
&label class="item item-input validated"&
&span class="input-label" for="password"&密码&/span&
&input id="password" type="password" ng-model="user.password" placeholder="********" required="required" name="password" /&
&i class="icon ion-alert-circled error"&&/i&
&label class="item"&
&button type="submit" class="button button-block button-positive icon ion-person icon-text"&登录&/button&
&/ion-content&&/ion-view&
为了实现，输入框的验证功能，需要给AngularJS加入两个自定义的标签: on-valid-submit, validated 由于这是一个全局的验证功能就把它添加到app.js ddApp module下，如果只针对某个页面，可以只添加到这个页面的 controller 下。到这里登陆页面的UI就完成了。列表页面首先构建派送列表页的Html内容:
&ion-view view-title="{{now | date:yyyy年M月d日}}"&
&ion-nav-bar class="bar bar-balanced" align-title="center"&
&ion-nav-buttons side="left"&
&li class="button icon icon-left ion-chevron-left" ng-click="doLogout()"&退出&/li&
&/ion-nav-buttons&
&/ion-nav-bar&
&ion-content class="list order-list"&
class="item order-item" ng-repeat="order in orders"&
&img class="order-img" ng-src="{{order.qrSrc}}" ng-click="goDetail(order.id)" /&
&div class="order-text"&
&h2 ng-click="goDetail(order.id)"&{{order.code}}&/h2&
&h3&{{order.pickTime}}&/h3&
&div class="order-check" ng-click="goDetail(order.id)"&
&a class="button icon-right ion-chevron-right button-clear button-assertive"&&/a&
&/ion-item &
&/ion-content&
&div class="bar bar-footer bar-positive"&
&div class="button-bar"&
&li class="button icon ion-ios-keypad icon-text" ng-click="goManual()"&手动输入&/li&
&li class="button icon ion-qr-scanner icon-text" ng-click="goScan()"&扫描二维码&/li&
&/div&&/ion-view&
为了展示数据，这里在Service里做了一个MockDB使用这个MockDB为App提供数据，这样当请求使用后端数据的时候，只要后端的RESTful Service 也返回同样规格的数据就可以了。这里代码比较多，具体代码在 services.js 中。接下来处理 派送列表 的 controller 把页面动作交互和数据连上：到这里派送列表页，就处理完了:详细页面添加 详细页面 html 代码:
&ion-view view-title="{{now | date:yyyy年M月d日}}"&
&ion-nav-bar class="bar bar-balanced" align-title="center"&
&ion-nav-buttons side="left"&
&li class="button icon icon-left ion-chevron-left" ng-click="doLogout()"&退出&/li&
&/ion-nav-buttons&
&/ion-nav-bar&
&ion-content class="list order-list"&
class="item order-item" ng-repeat="order in orders" ng-click="goDetail(order.id)"&
&img class="order-img" ng-src="{{order.qrSrc}}" ng-click="goDetail(order.id)" /&
&div class="order-text"&
&h2 ng-click="goDetail(order.id)"&{{order.code}}&/h2&
&h3&{{order.pickTime}}&/h3&
&div class="order-check"&
&a class="button icon-right ion-chevron-right button-clear button-assertive"&&/a&
&/ion-item &
&/ion-content&
&div class="bar bar-footer bar-positive"&
&div class="button-bar"&
&li class="button icon ion-ios-keypad icon-text" ng-click="goManual()"&手动输入&/li&
&li class="button icon ion-qr-scanner icon-text" ng-click="goScan()"&扫描二维码&/li&
&/div&&/ion-view&
添加页面 controller :到这一步 详细页面完成了:接下来就是手动输入页面，和扫描页面，这两个页面比较简单，类似于前面的页面，写好页面Html，配置好 controller 的内容，就可以了。到这里所有页面的 UI 都完成了。 你可以到&&下载这个阶段的代码。也可以使用 git checkout AllPageUI 取得
git checkout AllPageUI
原文链接：
阅读(...) 评论()