在產品經理製作項目原型的時候，購物車是最常用的到的功能，今天小編就分享一下購物車的原型製作。
在動手之前我們先來分析一下購物車到底都有些什麼功能，需要展示些什麼。 分析過程中，我們可以參照一些電子商城的購物車，找到他們共性功能。
- 購物展示的內容包括：產品圖片、產品名稱、單價、數量、數量增減按鈕、立即支付按鈕、總價等
- 頁面加載之後自動計算總價
- 當產品數量增減時，總價自動變化
- 當產品數量為1 的時候，進行減數量操作就是刪除該產品，彈出系統刪除提示框。
打開axure，新建一個購物車頁面，製作相應的元素，如圖所示：
把產品一的價格數字命名為price1，減號按鈕為reduce1，文本框為 digital1，加號為plus1，產品二的價格數字命名為price2，減號按鈕為reduce2，文本框為 digital2，加號為plus2。
購物車基本元素這樣就基本完成了，然後開始製作交互，首先我們來製作頁面加載完成自動計算總價，添加頁面載入時事件，消費的總價=產品一的數量*價格+產品二數量*價格；拖入一個文本框，刪除其默認文字。
載入時，設置總價的文字，添加局部變量a為產品一的價格，b為產品一的數量，c為產品二的價格，d為產品二的數量，那麼總價就是a*b+c*d，點擊摻入變量，選擇a*b+c*d。
F5運行一下就會，就會發現在頁面加載過程中，總價那塊就會出現數字。
然後開始製作數量的增減，數量變化時，總價會跟著變化，當數量為1的時候，再次點擊加號，那麼就會彈出提示框，點擊是就刪除該產品。
製作提示框：拖入動態面板，為了使程序更加的友好；製作兩個狀態；
以狀態“刪除產品一為例”
添加鼠標單機事件：按鈕“是”隱藏：產品一的所有元素以及動態面板，按鈕“否”只隱藏動態面板
所以再製作減號的時候需要考慮考慮兩種情況，一種是等於1的情況，一種是大於等於2的情況，因為數量都是整數，所以不用考慮1-2之間的情況。
當數字等於1的時候，添加鼠標單機事件：
添加條件
設置面板狀態，選擇狀態一，並勾選如果隱藏則現實面板
然後添加數量大於2的情況，雙擊鼠標單擊事件嗎，添加條件：
設置本文digital1-1。
按照以上流程製作產品二。
F5運行一下，購物車基本流程就製作完成了
閱讀更多 夢室筆談 的文章
