在设计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. ubuntu 安装qq 及解决安装完搜狗输入法不显示键盘的方法

    安装qq: https://zhuanlan.zhihu.com/p/27549700 解决搜狗输入法不显示的问题: http://blog.csdn.net/crystal_zero/article ...

  2. Redis_常用5大数据类型简介

    前面介绍了一些redis的的基本配置,以及安装,本文继续学习redis的五大数据类型. 一.Redis的五大数据类型 String(字符串).List(列表).Set(集合).Hash(哈希,类似ja ...

  3. Opencv学习笔记1:安装opencv和VS2015并进行环境配置

    用了Opencv一段时间了,简单记录一下opencv在vs2015下的配置. 第一部分:OpenCV3.2.0的下载 OpenCV官方下载地址: https://opencv.org/releases ...

  4. 【UOJ #103】【APIO 2014】Palindromes

    http://uoj.ac/problem/103 由manacher得:本质不同的回文串只有\(O(n)\)个. 用manacher求出所有本质不同的回文串,对每个本质不同的回文串,在后缀自动机的p ...

  5. [NOI2011]阿狸的打字机 --- AC自动机 + 树状数组

    [NOI2011] 阿狸的打字机 题目描述: 阿狸喜欢收藏各种稀奇古怪的东西,最近他淘到一台老式的打字机. 打字机上只有28个按键,分别印有26个小写英文字母和'B'.'P'两个字母.经阿狸研究发现, ...

  6. [转]Intent和IntentFilter详解

        Intent   Android中提供了Intent机制来协助应用间的交互与通讯,Intent负责对应用中一次操作的动作.动作涉及数据.附加数据进行描述,Android则根据此Intent的描 ...

  7. [转][Android]Android数据的四种存储方式

    android.database.sqlite类 SQLiteQueryBuilder java.lang.Object android.database.sqlite.SQLiteQueryBuil ...

  8. Codeforces Beta Round #9 (Div. 2 Only) C. Hexadecimal's Numbers dfs

    C. Hexadecimal's Numbers 题目连接: http://www.codeforces.com/contest/9/problem/C Description One beautif ...

  9. 2015 百度之星 1001 超级赛亚ACMer 贪心

    超级赛亚ACMer Time Limit: 20 Sec  Memory Limit: 256 MB 题目连接 http://acdream.info/problem?pid=1750 Descrip ...

  10. CodeM资格赛1

    题目描述 美团外卖的品牌代言人袋鼠先生最近正在进行音乐研究.他有两段音频,每段音频是一个表示音高的序列.现在袋鼠先生想要在第二段音频中找出与第一段音频最相近的部分. 具体地说,就是在第二段音频中找到一 ...