自由模式 餐馆点餐App制作实例

前段时候有不罕用户暗示想做一个餐馆订餐的App , 这里小编就来教用“应用公园”自助式App在线建造平台大师做一个吧 , 固然实现不了数据库记实主动下单这种牛逼的年夜型客户端结果(那需要很长时候去专业定制哈) , 但可以让客户经由过程手机浏览你所有的菜单、菜式介绍以及价钱等 , 并可直接拨打你的德律风订餐哦~并且只需半小时摆布即可完当作 , 建议所有的快餐店都普及建造一下 , 哈哈~
别的 , 这里面利用了宫格控件、列表控件 , 图片控件排版以及画廊控件进行演示 , 大师趁便学学这些控件的用法 , 斗胆去触类旁通的创作吧~
方式/
1新建App , 上传图标、启动页 , 不赘述 , 本身搞定哈

2进入操作界面 , 先在左边新建一个页面“本家儿菜单” , 归入默认组 , 作为总的菜单页 。

自由模式 餐馆点餐App制作实例

文章插图

3建好之后点击它 , 在右边控件栏中拖拽一个宫格控件到模拟器中 , 拉伸铺满整个屏幕 。 然后在右侧控件属性栏中 , 添加4个宫格 , 设置参数(列数2 , 列间距20 , 行间距50 , 外边距20) , 并勾选“高度自顺应”选项 。 如图3-1所示;然后别离点击已添加的每个宫格 , 别离为它们上传图标 , 这里我们不填写宫格名称 , 直接在图片上展示即可 。 最后设置宫格的总布景 , 此时结果就如图3-2所示了 。

自由模式 餐馆点餐App制作实例

文章插图

自由模式 餐馆点餐App制作实例

文章插图

4菜单页搞定 , 必然记得要保留哦!接下来就起头做菜单中包含的四年夜块内容了~在左边新建4个组 , 别离定名为这四年夜板块的名字 , 便利办理 。

自由模式 餐馆点餐App制作实例

文章插图

5建好之后 , 进入第一个组“精品点菜” , 新建页面“精品点菜” , 归入该组;点击这个页面 , 先拖一个汗青导航控件到模拟器 , 在属性栏设置“左边导航按钮”链接至“本家儿菜单”页面 。 (如图5-1)如许 , 浏览到本页时 , 便可点击返回按钮回到本家儿菜单 。 这个汗青导航再设置装备摆设所有下级页面城市用到哦~若是不设置装备摆设汗青导航条 , 将无法返回 , 只能直接退出(尤其是iphone) 。

自由模式 餐馆点餐App制作实例

文章插图

6然后拖动宫格控件到模拟器 , 添加9个宫格 , 3*3结构 , 拉伸铺满模拟器 , 在最下方留出一条位置 , 然后为每个宫格上传图片 , 编纂名字 , 在留出位置利用一个按钮控件 , 在属性栏中定名为“点菜” , 设置点击后“挪用功能—打德律风” , 并鄙人方输入订餐的德律风如许 , 客户点击即可直接拨打德律风订餐了~(图6-1) 。 保留后 , 结果如图6-2所示 。

自由模式 餐馆点餐App制作实例

文章插图

自由模式 餐馆点餐App制作实例

推荐阅读