開始制作

怎么自己制作APP軟件?這款A(yù)PP軟件制作工具讓你快速上手 | 附APP教程

2017-04-05 19:05:00 來自于應(yīng)用公園

隨著比較全面智能手機(jī)時(shí)代的到來,移動(dòng)上網(wǎng)速度不斷提升,大大提升了人們?cè)诰W(wǎng)上消費(fèi)的頻率。如今在電商APP上完成一筆消費(fèi),顯得太簡(jiǎn)單了。手機(jī)已經(jīng)成為日常生活中重要的工具之一。


這一現(xiàn)象也引發(fā)了電商APP創(chuàng)業(yè)潮,眾多創(chuàng)客們紛紛投身到APP的創(chuàng)業(yè)中,并且在移動(dòng)互聯(lián)網(wǎng)中贏得了人生桶金。比如河貍家、愛鮮蜂、e袋洗等優(yōu)秀的同城服務(wù)APP,都是很好的例子。如果你也具有這樣的一個(gè)APP創(chuàng)意,首先就要有自己的APP平臺(tái)。大多數(shù)電商APP是可以自己制作的,這樣既可以節(jié)約APP開發(fā)成本又可以讓自己在APP的制作過程中更加隨心所欲,何樂而不為呢?那么,如何自己制作APP軟件?有沒有一款能夠快速上手的APP在線制作平臺(tái)呢?


在此,小編就向大家推薦一款不用編程的APP在線制作工具:應(yīng)用公園apppark,下面,就跟著這個(gè)訂餐APP開發(fā)教程來一步一步學(xué)會(huì)怎么制作屬于自己的電商APP平臺(tái)吧!下面以一款點(diǎn)餐APP為例:


先看看App客戶端的效果




開始制作:

1、 新建App,上傳圖標(biāo)、啟動(dòng)頁(yè),不贅述,自己搞定哈~

2、 進(jìn)入操作界面,先在左邊新建一個(gè)頁(yè)面“主菜單”,歸入默認(rèn)組,作為總的菜單頁(yè)。







3、 建好之后點(diǎn)擊它,在右邊控件欄中拖拽一個(gè)宮格控件到模擬器中,拉伸鋪滿整個(gè)屏幕。然后在右側(cè)控件屬性欄中,添加4個(gè)宮格,設(shè)置參數(shù)(列數(shù)2,列間距20,行間距50,外邊距20),并勾選“高度自適應(yīng)”選項(xiàng)。如圖3-1所示;然后分別點(diǎn)擊已添加的每個(gè)宮格,分別為它們上傳圖標(biāo),這里我們不填寫宮格名稱,直接在圖片上展示即可。后設(shè)置宮格的總背景,此時(shí)效果就如下圖所示了;



訂餐APP制作" width="550" vspace="0" hspace="0" height="329" border="0" />





4、 菜單頁(yè)搞定,一定記得要保存哦!接下來就開始做菜單中包含的四大塊內(nèi)容了~在左邊新建4個(gè)組,分別命名為這四大板塊的名字,方便管理。


5、 建好之后,進(jìn)入個(gè)組“精品點(diǎn)菜”,新建頁(yè)面“精品點(diǎn)菜”,歸入該組;點(diǎn)擊這個(gè)頁(yè)面,先拖一個(gè)歷史導(dǎo)航控件到模擬器,在屬性欄設(shè)置“左邊導(dǎo)航按鈕”鏈接“主菜單”頁(yè)面。(如下圖)這樣,瀏覽到本頁(yè)時(shí),便可點(diǎn)擊返回按鈕回到主菜單。這個(gè)歷史導(dǎo)航再配置所有下級(jí)頁(yè)面都會(huì)用到哦~如果不配置歷史導(dǎo)航條,將無法返回,只能直接退出(尤其是iphone)。




6、 然后拖動(dòng)宮格控件到模擬器,添加9個(gè)宮格,3*3布局,拉伸鋪滿模擬器,在下方留出一條位置,然后為每個(gè)宮格上傳圖片,編輯名字,在留出位置使用一個(gè)按鈕控件,在屬性欄中命名為“點(diǎn)菜”,設(shè)置點(diǎn)擊后“調(diào)用功能—打電話”,并在下方輸入訂餐的電話這樣,客戶點(diǎn)擊即可直接撥打電話訂餐了~。保存后,效果如下圖。




7、 接著在本組再新建9個(gè)頁(yè)面,作為這9個(gè)宮格的下一頁(yè),分別介紹這些精品菜式和價(jià)格~(如下圖)





8、 點(diǎn)擊個(gè)頁(yè)面,同樣先使用一個(gè)歷史導(dǎo)航控件,注意,這里設(shè)置左側(cè)按鈕是鏈接到上一頁(yè),即剛做好的“精品炒菜”宮格頁(yè)。然后如圖所示,使用一個(gè)圖片控件上傳一張菜式的圖片。往下使用一個(gè)富文本頁(yè)面,輸入菜式的價(jià)格和介紹排版好(名稱和價(jià)格加粗標(biāo)紅),并在旁邊添加一個(gè)按鈕控件,同樣命名為“點(diǎn)菜”,和設(shè)置“調(diào)用功能—打電話”。(如下圖






9、 余下的頁(yè)面也一一照此配置好,接著,回到“精品點(diǎn)菜”頁(yè)面,分別點(diǎn)擊9個(gè)宮格,在屬性欄中設(shè)置鏈接到對(duì)應(yīng)的下一頁(yè)。如個(gè)宮格“招牌東坡肉”設(shè)置鏈接到“招牌東坡肉”頁(yè)面。



10、大塊就做好了,繼續(xù)第二塊。在“快餐系列”組內(nèi)新建頁(yè)面,同樣先使用歷史導(dǎo)航,左側(cè)按鈕鏈接到“主菜單”,然后拖拽一個(gè)列表控件到模擬器,按需添加列表欄,這里添加了7個(gè)。然后設(shè)置標(biāo)題文字為“加粗,綠色”,內(nèi)容文字屬性默認(rèn)即可,接著逐欄編輯列表的標(biāo)題、內(nèi)容,左側(cè)圖片框中編輯該快餐的圖片(50*50大?。覀?cè)圖片框使用一個(gè)小的圓形訂餐圖標(biāo)做裝飾(PNG格式,25*25),并設(shè)置每欄的鏈接都為調(diào)用電話功能,這樣,用戶點(diǎn)擊每一欄都可直接撥號(hào)訂餐。(如下圖)




11、此時(shí)列表欄已做好,還可以繼續(xù)對(duì)列表的行高、間隔、行背景等作出編輯調(diào)整,獲得更美觀的效果。(如下圖)





12、在第三大塊“可口點(diǎn)心”組新建頁(yè)面,先使用歷史導(dǎo)航,設(shè)置鏈接到主菜單。然后拖動(dòng)幾個(gè)圖片控件和單行文本控件到模擬器排列成如圖所示,然后分別上傳點(diǎn)心的圖片,在文本屬性中輸入點(diǎn)心名字;后,再添加一個(gè)按鈕,命名“點(diǎn)餐”,設(shè)置鏈接到調(diào)用電話功能,讓用戶可在本頁(yè)訂餐。





13、接著,我們來為這些點(diǎn)心圖片設(shè)置一個(gè)點(diǎn)擊放大的效果:在每個(gè)圖片控件屬性中,選擇“點(diǎn)擊事件—顯示大圖”,并上傳一張?jiān)擖c(diǎn)心的大圖片,保存。這樣,用戶在手機(jī)中點(diǎn)擊該圖片時(shí),將會(huì)彈出一張大圖,并可縮放和拖動(dòng),看得更加清晰。(如下圖)






14、后的“沁爽飲品”組,新建頁(yè)面,歷史導(dǎo)航鏈接到“主菜單”。拖拽一個(gè)畫廊控件到模擬器,拉伸鋪滿。在屬性欄中點(diǎn)擊“上傳圖片”,上傳一組圖片,將出現(xiàn)在下面的框中,可自由調(diào)整播放順序。然后設(shè)置是否自動(dòng)播放和播放速度(此處設(shè)置自動(dòng)播放,速度為5000毫秒,即5秒播完一輪),后在底部添加一個(gè)按鈕控件,命名“點(diǎn)餐”,設(shè)置調(diào)用電話功能,保存搞定~點(diǎn)擊時(shí)就將在手機(jī)中自動(dòng)播放飲品圖片,直接撥號(hào)訂餐。



15、所有頁(yè)面都做完了,不過還差后一步哦~返回到主菜單頁(yè)面,將4個(gè)宮格對(duì)應(yīng)鏈接4大系列的菜單頁(yè),如精品點(diǎn)菜宮格,鏈接“精品點(diǎn)菜”頁(yè)面~這樣,整個(gè)點(diǎn)餐App就完整串聯(lián)起來啦~記得保存哦(如下圖)




16、點(diǎn)擊右上方的生成按鈕,就得到一個(gè)精美實(shí)用的點(diǎn)菜App了。


應(yīng)用公園作為國(guó)內(nèi)早、功能強(qiáng)大的應(yīng)用開發(fā)工具。內(nèi)涵上百種功能控件,可以任意組合搭配。如果感覺上面的步驟比較復(fù)雜,那就選擇主題模式,里面有上百款經(jīng)典模板、成功案例,可以一鍵運(yùn)用,僅需要對(duì)文字圖片內(nèi)容進(jìn)行更換。十分鐘制作不是夢(mèng)。


粵公網(wǎng)安備 44030602002171號(hào)      粵ICP備15056436號(hào)-2

在線咨詢

立即咨詢

售前咨詢熱線

0755-27805158

[關(guān)閉]
應(yīng)用公園微信

官方微信自助客服

[關(guān)閉]