最近已經(jīng)上傳完畢！

這篇網(wǎng)頁是為了 Balsamiq Mockups 3 而上傳的。原來的文件您可以點擊這里來觀看。

有多種方式可以向你的 mockups 中添加圖像。最簡單的方法只需要拖拽一個圖片文件從你的電腦到你的 Mockups 畫布上。來閱讀一些更多在你的工程中添加并使用圖像的方法吧。

在 Mockups 視圖中添加圖像

正如上面提到的，從你的電腦上拖拽一個圖像到 Balsamiq Mockups 會把它添加到你的畫布上。這樣做會將圖片放在你選中的 Mockups 中并拷貝圖像文件到你的 Assets 目錄中，所以你可以很輕松的在其他 Mockups 上重復使用它。

你可以在屬性檢視視圖中修改圖片屬性，和其他 UI 控制一樣。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/image-properties.png" alt="image-properties.png" />

圖像的特定屬性如下：

• 下拉菜單顯示你當前圖片的名字。打開它會允許你選擇一個其他的你已經(jīng)上傳到 Assets 目錄中的圖像。
• 在下拉菜單旁邊的"+" 圖標允許你從你的電腦里添加一個圖像。這與你拖拽一個圖片進來效果相同。
• 單擊下載圖標打開一個對話框可以通過輸入 URL 來從網(wǎng)絡上直接或者從網(wǎng)絡相冊上搜索并添加圖像。Mockups 支持 GIF, JPG/JPEG, 和 PNG 圖像格式。文件將從網(wǎng)上下載并復制到你的工程中。
• 單擊下拉菜單下面的旋轉(zhuǎn)圖標每次讓你的圖像旋轉(zhuǎn) 90 度。
• 單擊方框中有一個 "x" 的圖標將會還原你的圖像成為一個默認的占位符圖像。
• 素描！復選框將轉(zhuǎn)換你的圖像成為一個僅使用黑白線條描繪的版本。

如果你還沒有準備好一個圖像文件或者你想使用一個占位符圖像來保證你的 mockup 低保真度，你可以從 UI 庫中添加一個圖像控制，然后它就會顯示一個方框里面有一個 "x"。你可以稍后再使用上面提到的圖像屬性來用一張圖像代替它。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/image-default.png" alt="image-default.png" />

只要圖像添加到你的項目中，它將在 UI 庫中顯示，然后你就可以輕松的將它應用在你項目中的任何 mockup 中。"Assets" 分類下將顯示所有你添加到項目中的圖像。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/assets-uilibrary.png" alt="assets-uilibrary.png" />

這也意味著你可以從 Quick Add 中給你的 mockups 添加圖片。只需要輸入圖像名的前幾個字母它就會出現(xiàn)在列表之中。

注釋：你可以通過在 UI 庫中在圖像上單擊右鍵并選擇 "Move Image to Trash" 或者從Assets 視圖的上下文菜單中刪除圖像。

圖片屬性面板還允許你修剪或掩蓋圖片使得只顯示它們的一部分。你可以在這里看一個修剪圖像的指導。已經(jīng)修剪過的圖像會在屬性面板上顯示移除修剪的圖標。

除了圖像控件，你也可以在 Cover Flow 控制中嵌入圖像。

在 Assets 視圖中添加圖像

Balsamiq Mockups 3 有一個專用的用戶接口區(qū)域來管理圖像，稱為 Assets 視圖。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/assets.png" alt="assets.png" />

assets 視圖顯示所有已經(jīng)添加到項目中的圖像和常用圖標。你可以選擇 assets 中的導航視圖來看到它。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/assets1.png" alt="assets1.png" />

你可以通過從你的電腦里拖拽的方式或者使用工具欄的圖標來在 Assets 視圖中添加圖像。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/assets2.png" alt="assets2.png" />

"Import Asset..."圖標允許你從你的電腦里選擇一個或多個圖像，同時可以在 Mockups 視圖里使用 "Download Asset..."得到相同的對話框輸入 URL 從網(wǎng)絡相冊上獲得圖像。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/add-from-web.png" alt="add-from-web.png" />

只要你添加了圖像，就可以以縮略圖或者是列表的形式查看它們，在縮略圖視圖也一樣。

右側(cè)的屬性面板顯示了選中圖像邊框的像素，并且允許你在上面添加注釋。面板的下面顯示了這個圖片被應用在了哪些 Mockups 中（如果有的話）。舉個例子，這一般常常用來管理圖像，你可以刪除一些沒有被使用的圖像。點擊一個 mockup 的名字將跳轉(zhuǎn)至它的 Mockups 視圖。

圖像管理

像在 Mockups 視圖中那樣，在 Assets 視圖中有一個上下文菜單,你可以在導航欄或者下拉菜單中右鍵單擊來打開。這樣你可以重命名、克隆、丟棄或者下載你的圖像。

http://wiki.jikexueyuan.com/project/balsamiq-mockups-doc/images/assets-context-menu.png" alt="assets-context-menu.png" />

重命名圖像

在上下文菜單中使用重命名圖像會改變你的項目中資源的名字。這不會影響到你的本地文件，因為圖像是添加到項目中的一個副本。重命名圖像會在你的 mockups 中更新，所以并不需要手動的更新它們。

刪除圖像

你同樣可以使用上下文菜單來從項目中刪除圖像。正如你的 mockups,刪除將會把圖像移至回收站，從那里你可以永久地刪除或者是還原它們。值得注意的是從 mockups 畫布上刪除它們并不意味著從工程中刪除它們。

將圖像從工程保存到本地

你可以在上下文菜單中使用 "Download" 選項來將圖像從工程保存到本地，這樣你可以從工程中提取出圖像來做其他事情。