Axure 不同選單 頁面不同位置

2022-09-18 21:57:12 字數 2729 閱讀 3004

頁面效果如下:

具體設定內容:

第一:給名字

五個選單,命名為cd1,cd2,cd3一直到cd5;選單對應的位置,這裡用的熱區,也可以直接設定為1-1標題本身,也要給個名字,熱區1,熱區2,一直到熱區5,我對應的名字是1,2,3,4,5;

第二右側頁面內容設定

右側頁面內容,設定為動態面板,裡面加標題1-1,標題位置加個熱區1.標題1-2,加熱區2;依次類推;

第三選單加動作

五個選單,設定用例;滑鼠單擊時,設定cd1為選中狀態,滾動到1的位置(垂直方向);設定cd2為選中狀態,滾動到2的位置;依次設定五個選單;

第四動態面板加動作

動態面板中,設定成顯示垂直滾動條;且動態面板的內容很長很長,動態面板本身是一定高度,如果沒有垂直滾動條,那個滾動就無法生效了。

5個選單加5個case;用到scrolly,垂直方向滾動的值?縱向滾動?怎麼更好理解呢;

以下是我的理解,有問題請大家及時指出來。

xcrolly   小於 熱區1y值,即:縱向滾動的數值小於熱區1y的值,選單1為選中狀態,這裡的設定達到的效果是,選單1保持選中效果;點選選單,動態面板內容顯示那個標題,是通過選單1上的用例來實現的;

----------------這是乙個說明-------------start-----

這裡是將小於熱區1y的值,改成了500,就是只要垂直滾動的數值小於500,那麼選單1就一直是選中狀態;導致的結果就是,點選選單2,選單3,選單4,滾動效果都是有的,但是選單的選中狀態效果,一致都在選單1上;

-----------------這是乙個說明-------------end-----

xcrolly   小於熱區3y值,大於等於熱區2y值,選單2是選中狀態;

xcrolly   小於熱區4y值,大於等於熱區3y值,選單3是選中狀態;

xcrolly   小於熱區5y值,大於等於熱區4y值,選單4是選中狀態;

xcrolly   大於等於熱區5y值,選單5是選中狀態。

依次類推;

所有設定完後,則效果就出來了;

具體的設定內容如下:

在axure中,設定分為兩部分,乙個是左側帶單,乙個是右側的動態面板;

命名

左側選單設定,選中選單1,命名為cd1;將對應的1-1上加了乙個熱區,命名為1;

用例:滑鼠單擊時,設定cd1的狀態為選中狀態,並且滾動到熱區1的位置,設定為垂直滾動;設定一下cd1,選中後,展示的乙個效果;

具體用例設定**

設定選中狀態:動作【元件】-選中,配置動作cd1的值為true。

設定垂直滾動到熱區1的位置,也就是1-1標題的位置;這裡可以設定進入的動畫,線性進入視覺效果更好;

cd1,cd2,cd3,cd4,cd5,五個選單都依次設定;動畫效果類似;

接下來第二步,設定右側的動態面板;

首先,動態面板設定固定高度即可;

例如,我這裡的高度是630;動態面板中頁面內容一定是很多的,這樣那個垂直滾動的效果才能出來;設定動態面板進顯示垂直滾動條;

接下來在動態面板上設定動畫;採用的是【滾動時】;涉及到的概念乙個是scrolly,乙個是動態變數;設定完成後用例展示如下;

具體的設定過程:這裡scrolly代表的是【垂直方向滾動的值】;最終配置出來的意思就是:如果垂直方向滾動的值小於熱區1的y值,則執行cd1的狀態為true,也就是是說,cd

1(選單1)為真,也就是動態面板滾動到1-1的位置;(這裡字面邏輯理解是這樣,需要再細化)但是測過,這種設定是ok的;

同理,設定case2,步驟跟上面的步驟是一樣的,唯一的區別

if "[[this.scrolly]]" >= "[[lvar1.y]]"

and "[[this.scrolly]]" < "[[lvar1.y]]",這裡的垂直方向滾動的值,要大於等於熱區2的y值位置,小於熱區3的y的位置;

也就是說,這裡的

選單3,設定的時候,這裡的區域性變數就大於等於熱區3的y值,小於熱區4的y值;

依次類推,最終就是這樣的結果:

設定好以後,生成的html頁面中,就能達到預期的效果了。

const 不同位置的不同含義

型別宣告中const用來修飾乙個常量,有如下兩種寫法 1 const 在型別前面 const int nvalue nvalue 是const const char pcontent pcontent是 const,pcontent可變 const char pcontent pcontent是 c...

位置問題 不同位置長痘痘,代表不同內臟有問題嗎?

別聽據說,聽專家說 我最近下巴周圍老是不停的冒痘痘,是不是我這段時間肝臟不好啊?這個場景你一定很熟悉,一旦哪個部位長了痘痘,就開始給自己 看病 今天我們請來了 科 美容方向 的專家黃惠玲醫師,為大家揭秘長痘痘的位置到底和內臟有沒有關係。長痘痘的部位和內臟有關嗎?細心觀察,會發現,痘痘的分布有很多種畫...

const 不同位置的不同含義以及使用方法

一 一般用法 對於乙個變數使用const使之變為常量 const int a 0 二 對於指標 一句話總結 在誰的前面就是修飾誰 1 如果想要讓指標所指位置的內容不能修改則應該如下定義 前面放置const int a 0 const int b 1 const int p p a 可以將非const...