原型設計工具Axure RP新手教程（十二）：工具提示

---

Axure RP是一套專門為網(wǎng)站或應用程序所設計的快速原型設計工具， 可以讓應用網(wǎng)站策劃人員或網(wǎng)站功能界面設計師更加快速方便的建立Web AP和Website的線框圖、流程圖、原型和規(guī)格。

免費下載Axure RP 優(yōu)惠購買Axure RP

---

在本教程中，您將學習如何創(chuàng)建將鼠標懸停在頁面上的元素上時出現(xiàn)的工具提示。您將通過兩種探索方法來做到這一點：Axure RP的內置工具提示功能（用于創(chuàng)建瀏覽器樣式的工具提示）以及Mouse Hover事件（可用于顯示使用小部件創(chuàng)建的自定義工具提示）。（點擊此處可查看本教程視頻操作）

內置工具提示功能

小部件設置

• 打開一個新的RP文件，然后在Pages（頁面）窗格中雙擊Page1（頁面1）以在畫布上將其打開。

• 將一個占位符小部件從Libraries（庫）窗格拖到畫布上。

添加工具提示文字

• 選擇占位符，然后切換到Interactions（交互）窗格。
  

• 在窗格的右上角，單擊More Interactions（更多交互）圖標。
  

• 在出現(xiàn)的菜單頂部，在工具提示字段中進入This is a tooltip！。
  

預覽頁面

• 預覽頁面并將光標懸停在占位符上以顯示工具提示。

• 將鼠標移離占位符，工具提示將再次消失。

提示：以這種方式創(chuàng)建的工具提示的樣式完全由Web瀏覽器控制。 如果您需要使工具提示看起來不同，請按照下一部分中的步驟創(chuàng)建自定義工具提示。

鼠標懸停時顯示的自定義工具提示

• 打開一個新的RP文件，然后在Pages（頁面）窗格中雙擊Page1（頁面1）以在畫布上將其打開。

• 從Libraries（庫窗格中將占位符小部件和標簽小部件拖到畫布上。

將標簽小部件上的文本設置為This is a tooltip！。

• 通過選擇標簽小部件并單擊Style（樣式）窗格或樣式工具欄中的Hidden（隱藏）圖標來隱藏標簽小部件。

在占位符的鼠標懸停事件中顯示工具提示

• 用占位符的鼠標顯示工具提示選擇占位符，然后在Interactions（交互）窗格中單擊New Interaction（新建交互）。

• 在出現(xiàn)的列表中選擇Mouse Hover（鼠標懸停）事件，然后選擇Show/Hide（顯示/隱藏）操作。

• 在Target（目標）下拉列表中選擇標簽小部件，然后在其下方保留顯示。

• 單擊確定以保存操作。

使用占位符的鼠標退出事件隱藏工具提示

• 在仍選擇占位符的情況下，再次單擊New Interaction（新建交互）。

• 選擇Mouse Exit（鼠標退出）事件，然后選擇Show/Hide（顯示/隱藏）動作。

• 再次定位標簽小部件，然后選擇其下方的Hide（隱藏）。

• 單擊確定以保存操作。

預覽頁面

• 預覽頁面，然后將光標懸停在占位符上。大約一秒鐘后，將出現(xiàn)自定義工具提示。

• 將鼠標移離占位符，工具提示將再次消失。

附加信息和提示

要顯示或隱藏帶有動畫的自定義工具提示，請在顯示/隱藏操作的動畫下拉列表中選擇一個。

關注慧聚IT微信公眾號???，了解產(chǎn)品的最新動態(tài)及最新資訊。