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

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

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

在 Mockups 視圖中添加圖像

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

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

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

圖像的特定屬性如下：

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

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

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

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

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

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

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

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

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

在 Assets 視圖中添加圖像

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

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

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

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

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

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

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

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

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

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

圖像管理

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

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

重命名圖像

在上下文菜單中使用重命名圖像會(huì)改變你的項(xiàng)目中資源的名字。這不會(huì)影響到你的本地文件，因?yàn)閳D像是添加到項(xiàng)目中的一個(gè)副本。重命名圖像會(huì)在你的 mockups 中更新，所以并不需要手動(dòng)的更新它們。

刪除圖像

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

將圖像從工程保存到本地

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