第一步：在設計區域中添加三個(gè)一級標題部件，分別將其文本內容設置為cat、dog、fox，然后添加一個(gè)【動(dòng)態(tài)面板】部件到設計區域，給動(dòng)態(tài)面板命名為pets，將準備好的三張動(dòng)物圖像填充到三個(gè)動(dòng)態(tài)面板狀態(tài)中，并且將動(dòng)態(tài)面板狀態(tài)與其中的圖像對應，分別命名為cat、dog、fox（注意：這一步一定不可忽略，否則這個(gè)效果將無(wú)法正常執行），見(jiàn)圖92。

（圖92）

第二步：選中標題cat，在右側的部件【屬性】面板中，雙擊【鼠標點(diǎn)擊時(shí)】事件，在彈出的【用例編輯器】對話(huà)框中設置用例名稱(chēng)為【設置value為cat】，添加【設置面板狀態(tài)】動(dòng)作，然后在右側的【配置動(dòng)作】中勾選pets動(dòng)態(tài)面板，在選擇狀態(tài)下拉列表中選擇【Value】，見(jiàn)圖93。點(diǎn)擊【fx】（見(jiàn)圖93-5），在彈出的【編輯值】對話(huà)框中單擊【添加局部變量】，在中間的下拉列表中選擇【部件文字】，在右側的下拉列表中選擇【This】（也就是當前所選中的標題部件），見(jiàn)圖94。繼續單擊【插入變量或函數…】，在下拉列表中選擇我們剛剛添加的局部變量【LVAR1】，見(jiàn)圖95。插入變量后如圖96，單擊【確定】按鈕關(guān)閉【編輯值】對話(huà)框，再次單擊【確定】按鈕關(guān)閉【用例編輯器】。

第三步：按照上一步的過(guò)程給標題dog和fox添加【鼠標單擊時(shí)】事件。

第四步：在頂部的工具欄中單擊【預覽】按鈕，或者按下快捷鍵F5/Shift+Command+P，快速預覽交互效果。

（圖93）

（圖94）

（圖95）

（圖96）

內聯(lián)框架

使用內聯(lián)框架，可以嵌入視頻、地圖和HTML文件到原型設計中。外部的HTML文件、視頻、地圖等內容都可以嵌入到內聯(lián)框架中。對于視頻和地圖，選擇鏈接到外部url；鏈接到本地已經(jīng)存在的HTML文件，內聯(lián)框架要鏈接到本地文件路徑，見(jiàn)圖97。

（圖97）

編輯內聯(lián)框架指定目標網(wǎng)址或視頻地址：拖放內聯(lián)框架部件到網(wǎng)站設計區域中，雙擊內聯(lián)框架，在彈出的對話(huà)框中指定哪些內容要在內聯(lián)框架中顯示?？蛇x擇內部頁(yè)面或者任何站外url，見(jiàn)圖97。

隱藏邊框：右鍵點(diǎn)擊內聯(lián)框架，在彈出菜單中勾選【切換邊框可見(jiàn)性】可切換顯示內聯(lián)框架周?chē)暮谏吙?，?jiàn)圖98。

顯示滾動(dòng)條：要隱藏或按需顯示內聯(lián)框架的滾動(dòng)條，可以右鍵點(diǎn)擊內聯(lián)框架，選擇【滾動(dòng)條】，或者在部件【屬性】面板中設置滾動(dòng)條。滾動(dòng)條可以按需要顯示（當內聯(lián)框架中嵌入的內容大小超過(guò)內聯(lián)框架大小時(shí)才顯示），也可以總是顯示，見(jiàn)圖99。

（圖98）

（圖99）

內聯(lián)框架預覽圖像：你可以給內聯(lián)框架添加Axure 內置的預覽圖像，如視頻、地圖，也可以自定義預覽圖像。注意，預覽圖像僅在設計區域中顯示，讓我們清楚該部件顯示的是什么內容，但不會(huì )在生成的原型中顯示，見(jiàn)圖100。

（圖100）

內聯(lián)框架的局限性

樣式：內聯(lián)框架的樣式被限定為切換顯示邊框和滾動(dòng)條，如果想添加其他樣式，請在內聯(lián)框架下面添加一個(gè)矩形部件，然后調整矩形部件的樣式即可。

導航和傳遞變量：內聯(lián)框架不能用來(lái)制作導航，也不能通過(guò)父頁(yè)面傳遞變量和設置動(dòng)態(tài)面板狀態(tài)。你可以使用含有內容的動(dòng)態(tài)面板來(lái)替代內聯(lián)框架，實(shí)現內容滾動(dòng)效果。