在设计iPhone应用程序原型时,常常需要通过一个滑动的动画从一个屏幕切换到另一个屏幕。使用Axure RP进行设计时,可以将屏幕设计到动态面板里面,通过设置面板状态事件来实现。在下文中作者将通过一个示例来详细讲解。

第一步:添加图像映射区域

打开AxureiPhoneApp.zip,打开里面的iPhoneApp-StateChangeNavigationTutorial.rp文件。
在返回箭头按钮和正在播放按钮上面添加图像映射区域,因这些按钮都是由多个组件组成,所以我们要为整个区域添加交互。

第二步:将第一个屏幕转换到动态面板

接下来,我们将需要切换的屏幕嵌入到一个动态面板中。
选中第一个屏幕的所有组件,右击选择转换>转换到动态面板。将此面板标记为InterfacePanel。

第三步:添加“Stations”状态

在动态面板管理器中右击面板,选择添加状态,为面板添加两个新的状态。
将第一个状态标记为“正在播放”,将第二个状态标记为“Stations”。

第四步:将组件粘贴到“Stations” 状态下

选中Station列表中的屏幕组件,剪切并粘贴到“Stations”状态下。将粘贴的组件移动到0,0位置。

第五步:添加OnClick到图像映射区域

选中“正在播放”的图像映射区域,双击OnClick事件打开事件编辑器。

第六步:设置面板到“正在播放”状态

添加一个设置面板状态事件,查看InterfacePanel复选框。 “现在播放”状态是默认为选择状态的。为动画进和动画出选择“向左滑动”。
点击确定,关闭事件编辑器。

第七步:打开“正在播放”状态, 添加OnClick

导航到“正在播放”状态,选中返回按钮的图像映射区域,并双击OnClick打开事件编辑器。

第八步:设置面板状态到“Stations”

选择设置面板状态事件,查看InterfacePanel复选框。从下拉列表中选择“Stations”状态,为动画进和动画出选择“向右滑动”。点击“确定”。

测试:创建完成后,可通过生成到你的桌面或在iPhone上查看进行测试。

>>下载本文Axure iPhone App模板  http://image.evget.com//images/article/FileDownload/AxureiPhoneApp.zip

>>下载原型设计工具Axure RP         http://***/product/2978/download

Axure与iPhone应用程序原型创建(五)的更多相关文章

  1. 如何用Axure快速制作APP交互原型

    对于产品经理来说,熟练使用一些常用软件是一项十分必要的技能.其中,作为一个专业的快速原型设计工具,Axure RP无疑在产品人心中拥有一个难以撼动的地位.但就要PS一样,虽然足够专业,但同样也会存在使 ...

  2. 经典网页设计:20个华丽的 iPhone 应用程序演示网站

    一个物品销售很好,重要的原因之一是它的包装,因为这是最重要的细节,可以把一个人转变成购买者.一个好的包装设计和良好的表现比产品本身更重要,因此被分配了大量的金钱和资源,以创造伟大的东西. 因此,为了销 ...

  3. (译)iPhone: 用公开API创建带小数点的数字键盘 (OS 3.0, OS 4.0)

    (译)iPhone: 用公开API创建带小数点的数字键盘 (OS 3.0, OS 4.0) 更新:ios4.1现在已经将这个做到SDK了.你可以设置键盘类型为UIKeyboardTypeDecimal ...

  4. 怎样将IPhone应用程序软件公布到应用程序商店?

    转自:http://www.shtion.com/667.html 怎样将IPhone应用程序软件公布到应用程序商店? 2009年10月19日公布 分类: App store, iphone, 手机应 ...

  5. Axure谷歌浏览器Chrome扩展程序下载及安装方法

    对于很多需要设计产品原型的朋友来说,Axure RP Pro可谓是非常方便.好用的一款软件,因为它不仅能绘制出详细的产品构思,也能生成浏览器格式的产品原型.但是如果想把原型拿给客户查看,千万记得给浏览 ...

  6. 关于C#程序优化的五十种方法

    关于C#程序优化的五十种方法    这篇文章主要介绍了C#程序优化的五十个需要注意的地方,使用c#开发的朋友可以看下   一.用属性代替可访问的字段 1..NET数据绑定只支持数据绑定,使用属性可以获 ...

  7. iPhone应用程序的启动过程

    Phone的入口函数main,这之后它有是怎样启动应用程序,初始化的呢,这些都是通过 UIApplicationMain 来实现的. 其启动的流程图大致如下图所示: 1 int retVal = UI ...

  8. 微信小程序把玩(五)页面生命周期

    原文:微信小程序把玩(五)页面生命周期 这里只要熟悉页面的基本生命周期即可,业务在指定生命周期函数内书写. 以下是官网给出的生命周期函数方法和状态图 上面的生周期函数图对于做Android 或者IOS ...

  9. DLL程序的创建步骤和測试程序

    首先,创建DLL程序 然后,加入一个导出类 比如: //Test.h #pragma once class AFX_EXT_CLASS Test { public:  Test(void);  ~Te ...

随机推荐

  1. OpenGL的一些重要函数记录

    glViewport - set the viewport https://www.khronos.org/registry/OpenGL-Refpages/gl4/html/glViewport.x ...

  2. android fragment activity 区别

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha fragment  负责一个模块 的展示. 由 活动 管理. 碎片 可以 解决 太多活动 ...

  3. 【树形DP】BZOJ1040-[ZJOI2008]骑士

    [题目大意] 有n个骑士,给出他们的能力值和最痛恨的一位骑士.选出一个骑士军团,使得军团内没有矛盾的两人(不存在一个骑士与他最痛恨的人一同被选入骑士军团的情况),并且,使得这支骑士军团最具有战斗力,求 ...

  4. 【最大独立集】BZOJ3175- [Tjoi2013]攻击装置

    [题目大意] 给定一个01矩阵,其中你可以在0的位置放置攻击装置.每一个攻击装置(x,y)都可以按照“日”字攻击其周围的 8个位置(x-1,y-2),(x-2,y-1),(x+1,y-2),(x+2, ...

  5. 【BZOJ】2653: middle

    2653: middle Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 2381  Solved: 1340[Submit][Status][Disc ...

  6. HDU 4183

    给出一个有向图,以及src和dst.判断是否存在从src到dst的两条路径,使得除了src和dst外,没有其它点同时属于两条路径. 给每个点一个为1的点容量(src和dst为2),边的容量也是1,然后 ...

  7. Codeforces Beta Round #4 (Div. 2 Only) A. Watermelon 水题

    A. Watermelon 题目连接: http://www.codeforces.com/contest/4/problem/A Description One hot summer day Pet ...

  8. hihocoder1322 树结构判定(161周)

    hihocoder1322 : 树结构判定(161周) 题目链接 思路: 无向图中判断是不是一棵树. 并查集判断.判断是不是只有一个连通分量.并且该联通分量中没有环.没有环的判定很简单就是看边的数目和 ...

  9. GCC安装UBUNTU

    在Ubuntu下安装GCC和其他一些Linux系统有点不一样. 方法一: 该方法超简单:sudo apt-get  build-depgcc 就上面这条命令就可以搞定 方法二:sudo apt-get ...

  10. C# 通过HttpWebRequest在后台对WebService进行调用

    通过HttpWebRequest在后台对WebService进行调用 http://www.cnblogs.com/macroxu-1982/archive/2009/12/23/1630415.ht ...