页面交互页面状态页面状态是通过为整个页面设置多个状态，使页面在演示时能够动起来，此功能在V8原型中已经删除， 目前在原型V7中仍能使用。在V8原型中若想实现页面状态的效果，可以通过增加动态组件来实现。V8原型动态组件操作指路：动态组件页面状态添加触发页面状态在文件编辑区的左栏选中某个页面，设置面板的右边有若干按钮，点击第一个圆形按钮后就可以触发页面状态编辑面板，设置这个页面的状态。添加页面状态有两种方式可以添加页面状态：1、点击状态面板中的「新建」，将新建一个新的空白页面状态。2、点击「复制」按钮，即可复制某个页面的状态为新的状态。  页面状态编辑页面默认状态设置页面状态编辑面板中第一个状态就是页面的默认显示状态，也就是当我们打开一个页面时，页面最开始呈现的样子（状态）。如果想要更改默认页面状态，可以通过鼠标拖拽调整页面状态顺序。页面状态切换和页面切换的区别【页面状态切换】和【页面切换】都可以实现页面内的交互动画，但【页面状态切换】会有组件平滑移动的效果，如下图，我们可以称之为智能动画。相比之下，页面切换没有这种平滑移动的效果，会是生硬的切换，就像这样：如何实现页面状态实现交互1、设置页面状态通过以上步骤为页面设置多个状态。2、增加交互事件选中某一页面或组件，在工作栏右侧选择「全局事件」/「事件」——添加事件，即可设置触发页面状态更改的事件，具体操作可参考添加交互事件教程3、实际操作演示本教程在此演示通过设置页面状态，使得某个图片位置、大小发生改变的过程。    网页跳转/插入外部链接使用交互事件中的超链接功能即可实现网页跳转效果。  1、选中任意元素，添加事件，选择跳转超链接  2、选择跳转到当前页面或者新开窗口，输入允许跳转的http/https协议的地址定时跳转选中画布后，在链接设置面板中可以为页面或状态设置定时跳转的效果。

页面交互

动态组件

字体商用常见问题说明

Axure导入

编辑页面

文件设置

编辑组件

添加交互事件

添加批注

使用技巧

原型制作

素材面板

常用组件

表单组件

导航组件

图表组件

多媒体组件

图标组件

我的组件/图片

素材库

企业素材库

母版的使用

使用文件模板

组件素材

固定组件

交互案例教程（视频）

交互效果

分享与协作

分享设置

添加评论

版本管理

企业协作

文件演示

预览模式

演示常见问题

演示分享

导出交付

标注模式

开发交付

导入sketch设计稿

导入异常

设计稿交互

【原型】如何确定设备尺寸

墨刀嵌入第三方预览方法

页面相关问题

文件相关问题

导出相关问题

组件使用问题

演示分享问题

能使用iPad编辑文件吗

其他问题

<h1 id="页面交互">页面交互</h1>
<h2 id="页面状态">页面状态</h2>
<p>页面状态是通过为整个页面设置多个状态，使页面在演示时能够动起来，<mark>此功能在V8原型中已经删除，</mark> 目前在原型V7中仍能使用。
在V8原型中若想实现页面状态的效果，可以通过增加动态组件来实现。V8原型动态组件操作指路：<a href="/hc/articles/398" target="_blank">动态组件</a></p>
<h3 id="页面状态添加">页面状态添加</h3>
<ul>
<li>触发页面状态<br></li>
</ul>
<p>在文件编辑区的左栏选中某个页面，设置面板的右边有若干按钮，点击第一个圆形按钮后就可以触发页面状态编辑面板，设置这个页面的状态。</p>
<p><img src="https://cdn.modao.cc/v7/230801-56-1.png" width="400px"/>

<ul>
<li>添加页面状态<br></li>
</ul>
<p>有两种方式可以添加页面状态：</p>
<p>1、点击状态面板中的「新建」，将新建一个新的空白页面状态。</p>
<p><img src="https://cdn.modao.cc/v7/230801-56-2.png" width="400px"/>

<p>2、点击「复制」按钮，即可复制某个页面的状态为新的状态。  </p>
<p><img src="https://cdn.modao.cc/v7/230801-56-3.png" width="400px"/>

<h3 id="页面状态编辑">页面状态编辑</h3>
<ul>
<li><strong>页面默认状态设置</strong></li>
</ul>
<p>页面状态编辑面板中第一个状态就是页面的<strong>默认显示状态</strong>，也就是当我们打开一个页面时，页面最开始呈现的样子（状态）。如果想要更改默认页面状态，可以通过鼠标拖拽调整页面状态顺序。</p>
<p><img src="https://cdn.modao.cc/v7/230801-56-4.gif" width="400px"/>

<h3 id="页面状态切换和页面切换的区别">页面状态切换和页面切换的区别</h3>
<p>【页面状态切换】和【页面切换】都可以实现页面内的交互动画，但【页面状态切换】会有组件平滑移动的效果，如下图，我们可以称之为<strong>智能动画</strong>。</p>
<p><img src="https://cdn.modao.cc//hc/%E9%A1%B5%E9%9D%A2%E7%8A%B6%E6%80%81.gif" width="700px"/>

<p>相比之下，<strong>页面切换</strong>没有这种平滑移动的效果，会是生硬的切换，就像这样：</p>
<p><img src="https://cdn.modao.cc//hc/%E9%A1%B5%E9%9D%A2%E5%88%87%E6%8D%A2.gif" width="700"/>

<h3 id="如何实现页面状态实现交互">如何实现页面状态实现交互</h3>
<ul>
<li><strong>1、设置页面状态</strong></li>
</ul>
<p>通过以上步骤为页面设置多个状态。</p>
<ul>
<li><strong>2、增加交互事件</strong></li>
</ul>
<p>选中某一页面或组件，在工作栏右侧选择「全局事件」/「事件」——添加事件，即可设置触发页面状态更改的事件，具体操作可参考<a href="/hc/articles/9" target="_blank">添加交互事件教程</a></p>
<ul>
<li><strong>3、实际操作演示</strong></li>
</ul>
<p>本教程在此演示通过设置页面状态，使得某个图片位置、大小发生改变的过程。</p>
<p><video poster="https://cdn.modao.cc/v7/230801-56-6.png" width="720" controls>    <source src="https://cdn.modao.cc/v7/230801-56-5.mp4" type="video/mp4"></video></p>
<h2 id="网页跳转插入外部链接">网页跳转/插入外部链接</h2>
<p>使用交互事件中的超链接功能即可实现网页跳转效果。  </p>
<ul>
<li>1、选中任意元素，添加事件，选择跳转超链接</li>
</ul>
<p><img src="https://cdn.modao.cc//hc/wytz.png" width="400"/>
<br>
  
<ul>
<li>2、选择跳转到当前页面或者新开窗口，输入允许跳转的http/https协议的地址</li>
</ul>
<p><img src="https://cdn.modao.cc//hc/wytz2.png" width="400"/>

<h2 id="定时跳转">定时跳转</h2>
<p>选中画布后，在链接设置面板中可以为页面或状态设置定时跳转的效果。</p>
<p><img src="https://cdn.modao.cc//hc/dstz.png" width="700px"/>
<br>