|
不知大家有沒有玩過“QQ秀”？玩過的話一定會想自己也做一個類似的功能。不過沒有玩過也沒關(guān)系，你可以看看下面的演示。用戶可以在列出的圖片中自由定制自己的形象，用在論壇社區(qū)、留言本等地方的形象顯示可是個不錯的主意哦！怎么樣？心動了吧？那讓我們看看這東西到底是怎么回事吧！
演示：
實際上，左邊“形象預(yù)覽”的形象是由多幅圖片一層一層拼成的，呵呵，了解Photoshop的層技術(shù)就很容易理解了。每層圖片的大小一樣，必要顯示的地方都調(diào)整在特定范圍，其他地方都是透明的。在換形象時，只要把相應(yīng)層的圖片替換掉就可以了。不難理解，演示中只有20幅用于拼湊形象的圖片（原始的形象有4幅），卻可以拼出54=625個形象！
我們用一個特定格式的字符串來記錄用戶的形象配置，也是根據(jù)該字符串來顯示虛擬形象，該字符串暫且稱為配置碼。存取形象時，就存取該配置碼即可。因為這十分簡單，所以這里不討論服務(wù)器端語言的操作。配置碼的格式舉個例子就容易明白，例如“df>2>1>0”表示第一層圖片名為“df.gif”，第二層名為“2.gif”，第三層名為“1.gif”，沒有第四層。所以不要給圖片起名為“0.gif”。
下面我們看看虛擬形象具體是如何實現(xiàn)的。演示中用了四層拼湊一個形象（其際上您可以用更用層）：第一層褲子，第二層上衣，第三層發(fā)型，第四層帽子。各層供選圖片都放在各自的目錄中，目錄名分別為1、、2、3、4，即和層數(shù)相同。另外列表中的圖片和拼湊形象的圖片不相同，列表中的只是縮略圖。大圖“1.gif”對應(yīng)的縮略圖是“1x.gif”，依此類推。另外每個目錄都有一個圖片“df.gif”，是該層的默認(rèn)原始圖片。
照此這安置好圖片后，開始編寫代碼，為了便于理解，以下代碼的順序并不完全按照演示中的順序：
點擊“保存形象”將向服務(wù)器提交配置碼變量“userequip”，可用服務(wù)器端語言進(jìn)行處理。要在其他地方顯示該形象，則可根據(jù)注釋選取上面代碼中的部分代碼就行了。
有興趣的朋友可點擊這里（注：將example.htm和equipment打包供下載，因為讀者看不到圖片放置格式）下載演示的源文件及圖片。
| 
