教你親手製作QQ聊天場景

　第一、背景屬性設置

　　在背景屬性設置中包括：聲音、尺寸大小和在該場景的IM窗口中各部分文字顏色的設置等，此外針對文字顏色的設置，還提供了“預覽”功能，可以隨時查看修改了顏色之後的效果！

圖1 背景屬性設置　　
　　聲音：指該場景的背景音樂，可以通過“選擇”把文件添加進來，同時還可以進行試聽，所有添加的聲音文件都會出現在“下拉列表”中和界面左下角的“元件圖庫”中，如圖1中的綠色區域。

　　説明：“元件圖庫”中的各個文件可以通過鼠標左鍵雙擊進行選中

　　最小大小：指設計區可以拉伸的最小限制大小

　　當前大小：指設計區目前實際的大小尺寸，這個尺寸至少要大於等於“最小大小”的數值。

　　顏色：這裏的包括對背靜、消息窗口背景、對方和自己發言標識、聊天消息、系統消息的文字和鏈接等場景中元素的顏色設置。

　　説明：顏色設置部分還提供了“預覽”功能，為便於隨時查看顏色設置的效果，大家可以選中“預覽”功能。這樣，當改變各部分顏色後，即可隨時在背景中看到修改後的效果。

　　第二、圖片

　　在背景屬性中僅可以設置背景的顏色等，為了場景更生動豐富，我們還可以在背景上添加一張或者多張圖片。

　　2．1 圖片導入

　　通過“導入圖片”可以將切好的各種用來製作場景的圖片導入到場景編輯器界面中左下的元件圖庫中，供需要時使用。

　　當需要對某個圖片進行屬性設置時，可以通過鼠標左鍵雙擊元件圖庫中該圖片就可以把它添加到背景上（或者可以通過鼠標左鍵選中圖片把它拖拽添加到背景上），同時這個圖片也出現在場景編輯器界面中左上角的場景元件的列表中，進而就可以對該圖片進行屬性設置了。

圖2 導入圖片　　2．2 圖片添加

　　“圖片添加”實際上是將“導入圖片”和添加到背景中這個兩個功能的合成。可以通過以下兩種方式添加圖片到場景編輯器的背景，同時這個圖片也出現在場景編輯器界面中左上角的場景元件的列表中，進而就可以對該圖片進行屬性設置了：

　　1、在背景區域中選擇右鍵菜單中的“添加圖片”

　　2、在菜單中選擇“編輯”—“添加圖片”，如圖3：
　　

圖3 圖片添加
　　2．3 圖片屬性設置

　　由於在QQ中，場景是可隨IM窗口拉伸的，所以為了更好保證場景的效果，背景中各圖片在拉伸情況下的位置、拉伸方式等都需要進行設置。

　　圖片屬性設置包括名稱、位置大小、拉伸方式等。
　　

圖4 圖片屬性設置界面
　　名稱和大小：圖片添加到背景中時，該圖片的默認名稱和大小就已經被自動顯示出來，大家還可以根據需要自行修改。如圖5，可以通過鼠標拉動圖片各個方向上的9個紅點直接調整圖片尺寸，也可以輸入圖片的寬和高的具體數值（如圖5中的綠色區域），還可以設定圖片為原始大小等。

　　窗口拉伸：具體又分為左右、上下位移方式和填充方式的設置

　　説明：

　　左右拉伸：如果希望圖片隨窗口左右均勻拉伸，即可選擇“寬度隨着窗口變化而變化”，

　　一般説來水平方向上均勻的圖片更適合左右拉伸，如圖5中的圖片：

　　如果圖片左右拉伸會變型失去原來效果，或者希望圖片在IM窗口拉伸過程
　中左右長度不變，則可以選擇“保持相對位置”，並進一步在下拉列表中設置該圖片為左或者右對齊。

　　左對齊：該圖片在在IM窗口拉伸過程中相對左邊框的位置是不變的。

　　填充方式：分為直接拉伸和平鋪兩種。

　　直接拉伸：就是對圖片進行均勻拉伸的一種效果，如下圖5.1為將圖片左右方向直接拉伸後的效果，圖5.2為將圖片上下方向直接拉伸後的效果：
　　

圖5.1 將圖片左右方向直接拉伸後的效果

圖5.2 將圖片上下方向直接拉伸後的效果
　　平鋪：就是在拉伸時對圖片進行重複的拼接，以此來填充指定的該圖片顯示區域的一種效果，如下圖5.3為將圖片左右方向平鋪後的效果，圖5.4為將圖片上下方向平鋪後的效果：

圖5.3 將圖片所有方向平鋪後的效果

圖5.4 將圖片上下方向平鋪後的效果　座標視圖：幫助大家確定當前圖片的四邊相對於背景四邊的位置，如圖5所示：

　　2．4 圖片屬性設置舉例

　　以場景“春天”為例來對圖片的屬性設置進一步説明：

　　1、如圖5中的，天空圖片在水平方向是均勻的，所以可以將圖片屬性設置中設置如下圖6，設成“寬度隨窗口變化而變化”、保持“上端對齊”和設定圖片為直接“拉伸”方式。
　　

圖6 圖片天空的屬性設置　　
　　2、“田野”圖片屬性設置中設置如下圖7，設成“寬度隨窗口變化而變化”、保持“下端對齊”和設定圖片為直接“平鋪”方式，“平鋪”可以更好的體現“田野”的綿延。

圖7 圖片田野的屬性設置
　3、場景中的其他元素如山巒、雲朵、新枝等圖片在IM窗口尺寸變化時，大小都被我們設置為不變的，我們只需要設置他們在IM窗口尺寸變化時的相對位置即可。

　　新枝：設成保持“右端”“上端”對齊和設定圖片為直接“平鋪”或者“拉伸”方式都可以。
　　

圖8 圖片新枝的屬性設置
　　2．5 圖層及相關操作

　　在上面圖片屬性設置舉例中，大家可能已經發現，背景中各圖片之間可能存在彼此重疊的情況，比如圖8中的雲和天空等，當圖片出現彼此重疊，就涉及到誰覆蓋誰的問題，為了更好的標識這種關係，我們可以將不同的圖片看作不同的圖層。

　　在場景編輯器的背景部分，提供各個圖層間的操作“上移”、“下移”、“最上層”、“最下層”等，如下圖9，為將新枝圖層設置到天空圖層之下的效果，可以看到天空圖層和新枝圖層重疊的部分中，天空覆蓋了新枝。

　　説明：在場景元件列表中可以看到各個圖層之間的上下關係，如下圖9綠色的區域中可以看到，新枝圖層已經移到天空圖層下。