隨著比較全面智能手機時代的到來,移動上網速度不斷提升,大大提升了人們在網上消費的頻率。如今在電商APP上完成一筆消費,顯得太簡單了。手機已經成為日常生活中重要的工具之一。
這一現象也引發了電商APP創業潮,眾多創客們紛紛投身到APP的創業中,并且在移動互聯網中贏得了人生桶金。比如河貍家、愛鮮蜂、e袋洗等優秀的同城服務APP,都是很好的例子。如果你也具有這樣的一個APP創意,首先就要有自己的APP平臺。大多數電商APP是可以自己制作的,這樣既可以節約APP開發成本又可以讓自己在APP的制作過程中更加隨心所欲,何樂而不為呢?那么,如何自己制作APP軟件?有沒有一款能夠快速上手的APP在線制作平臺呢?
在此,小編就向大家推薦一款不用編程的APP在線制作工具:應用公園apppark,下面,就跟著這個訂餐APP開發教程來一步一步學會怎么制作屬于自己的電商APP平臺吧!下面以一款點餐APP為例:
先看看App客戶端的效果:
開始制作:
1、 新建App,上傳圖標、啟動頁,不贅述,自己搞定哈~
2、 進入操作界面,先在左邊新建一個頁面“主菜單”,歸入默認組,作為總的菜單頁。
3、 建好之后點擊它,在右邊控件欄中拖拽一個宮格控件到模擬器中,拉伸鋪滿整個屏幕。然后在右側控件屬性欄中,添加4個宮格,設置參數(列數2,列間距20,行間距50,外邊距20),并勾選“高度自適應”選項。如圖3-1所示;然后分別點擊已添加的每個宮格,分別為它們上傳圖標,這里我們不填寫宮格名稱,直接在圖片上展示即可。后設置宮格的總背景,此時效果就如下圖所示了;
訂餐APP制作" width="550" vspace="0" hspace="0" height="329" border="0" />
4、 菜單頁搞定,一定記得要保存哦!接下來就開始做菜單中包含的四大塊內容了~在左邊新建4個組,分別命名為這四大板塊的名字,方便管理。
5、 建好之后,進入個組“精品點菜”,新建頁面“精品點菜”,歸入該組;點擊這個頁面,先拖一個歷史導航控件到模擬器,在屬性欄設置“左邊導航按鈕”鏈接“主菜單”頁面。(如下圖)這樣,瀏覽到本頁時,便可點擊返回按鈕回到主菜單。這個歷史導航再配置所有下級頁面都會用到哦~如果不配置歷史導航條,將無法返回,只能直接退出(尤其是iphone)。
6、 然后拖動宮格控件到模擬器,添加9個宮格,3*3布局,拉伸鋪滿模擬器,在下方留出一條位置,然后為每個宮格上傳圖片,編輯名字,在留出位置使用一個按鈕控件,在屬性欄中命名為“點菜”,設置點擊后“調用功能—打電話”,并在下方輸入訂餐的電話這樣,客戶點擊即可直接撥打電話訂餐了~。保存后,效果如下圖。
7、 接著在本組再新建9個頁面,作為這9個宮格的下一頁,分別介紹這些精品菜式和價格~(如下圖)
8、 點擊個頁面,同樣先使用一個歷史導航控件,注意,這里設置左側按鈕是鏈接到上一頁,即剛做好的“精品炒菜”宮格頁。然后如圖所示,使用一個圖片控件上傳一張菜式的圖片。往下使用一個富文本頁面,輸入菜式的價格和介紹排版好(名稱和價格加粗標紅),并在旁邊添加一個按鈕控件,同樣命名為“點菜”,和設置“調用功能—打電話”。(如下圖
9、 余下的頁面也一一照此配置好,接著,回到“精品點菜”頁面,分別點擊9個宮格,在屬性欄中設置鏈接到對應的下一頁。如個宮格“招牌東坡肉”設置鏈接到“招牌東坡肉”頁面。
10、大塊就做好了,繼續第二塊。在“快餐系列”組內新建頁面,同樣先使用歷史導航,左側按鈕鏈接到“主菜單”,然后拖拽一個列表控件到模擬器,按需添加列表欄,這里添加了7個。然后設置標題文字為“加粗,綠色”,內容文字屬性默認即可,接著逐欄編輯列表的標題、內容,左側圖片框中編輯該快餐的圖片(50*50大?。?,右側圖片框使用一個小的圓形訂餐圖標做裝飾(PNG格式,25*25),并設置每欄的鏈接都為調用電話功能,這樣,用戶點擊每一欄都可直接撥號訂餐。(如下圖)
11、此時列表欄已做好,還可以繼續對列表的行高、間隔、行背景等作出編輯調整,獲得更美觀的效果。(如下圖)
12、在第三大塊“可口點心”組新建頁面,先使用歷史導航,設置鏈接到主菜單。然后拖動幾個圖片控件和單行文本控件到模擬器排列成如圖所示,然后分別上傳點心的圖片,在文本屬性中輸入點心名字;后,再添加一個按鈕,命名“點餐”,設置鏈接到調用電話功能,讓用戶可在本頁訂餐。
13、接著,我們來為這些點心圖片設置一個點擊放大的效果:在每個圖片控件屬性中,選擇“點擊事件—顯示大圖”,并上傳一張該點心的大圖片,保存。這樣,用戶在手機中點擊該圖片時,將會彈出一張大圖,并可縮放和拖動,看得更加清晰。(如下圖)
14、后的“沁爽飲品”組,新建頁面,歷史導航鏈接到“主菜單”。拖拽一個畫廊控件到模擬器,拉伸鋪滿。在屬性欄中點擊“上傳圖片”,上傳一組圖片,將出現在下面的框中,可自由調整播放順序。然后設置是否自動播放和播放速度(此處設置自動播放,速度為5000毫秒,即5秒播完一輪),后在底部添加一個按鈕控件,命名“點餐”,設置調用電話功能,保存搞定~點擊時就將在手機中自動播放飲品圖片,直接撥號訂餐。
15、所有頁面都做完了,不過還差后一步哦~返回到主菜單頁面,將4個宮格對應鏈接4大系列的菜單頁,如精品點菜宮格,鏈接“精品點菜”頁面~這樣,整個點餐App就完整串聯起來啦~記得保存哦(如下圖)
16、點擊右上方的生成按鈕,就得到一個精美實用的點菜App了。
應用公園作為國內早、功能強大的應用開發工具。內涵上百種功能控件,可以任意組合搭配。如果感覺上面的步驟比較復雜,那就選擇主題模式,里面有上百款經典模板、成功案例,可以一鍵運用,僅需要對文字圖片內容進行更換。十分鐘制作不是夢。