- 浏览: 20685 次
- 性别:
- 来自: 上海
最新评论
-
前进的路中没有月亮:
masuweng 写道那个爱码哥怎么用呢,我是初学者.还望指教 ...
仅用了一天开发了这样的app,再也不用担心排队的问题了 -
masuweng:
那个爱码哥怎么用呢,我是初学者.还望指教...
仅用了一天开发了这样的app,再也不用担心排队的问题了
使用imag.js开发过很多类型的模板,比如新闻、社交、办公类等,今天和大家分享如何开发电商类的app
电商类app的基本功能
商品商城首页、商品画面展示、商品信息录入(展示图片录入)、客户评价(商品图片录入)、会员中心(联系我们)、后台信息录入
电商类app制作流程一般分为七步:
1、明确表达和确立企业需求
2、需求评估
3、项目技术开发与视觉规划
4、程序开发
5、测试
6、交付上线
7、维护与版本升级
我们主要讲一下第四步程序开发
以下图为例,页面可分为四大部分
1、标题栏
第一部分的标题栏使用原生控件title标签,和HTML中的title不同的是他有且仅有三个子标签分别是<left><center><right>,第一部分可以划分为三个小模块扫码按钮、搜索框和消息按钮分别对应title的三个子标签
在left子标签添加扫码的脚本功能——$phone.barcode()
2、顶部标签栏
顶部标签栏tabbar需要写在header标签里,通过多个item来切换不同的页面
3、内容展示
内容展示部分大多数情况下都会使用list标签进行布局,需要跳转页面的可以在标签内添加onclick点击事件属性。
4、底部标签页
底部标签页切换不同的页面是tab标签实现的,tab标签很简单,只要把title和content等控件放到tab里面就可以了。
其他页面大家想要用什么样的布局方式都可以尝试一下,这里就不一一细讲了。
详细代码可以在github上查看
电商类app的基本功能
商品商城首页、商品画面展示、商品信息录入(展示图片录入)、客户评价(商品图片录入)、会员中心(联系我们)、后台信息录入
电商类app制作流程一般分为七步:
1、明确表达和确立企业需求
2、需求评估
3、项目技术开发与视觉规划
4、程序开发
5、测试
6、交付上线
7、维护与版本升级
我们主要讲一下第四步程序开发
以下图为例,页面可分为四大部分
1、标题栏
第一部分的标题栏使用原生控件title标签,和HTML中的title不同的是他有且仅有三个子标签分别是<left><center><right>,第一部分可以划分为三个小模块扫码按钮、搜索框和消息按钮分别对应title的三个子标签
<title style="background:#ffffff;padding:10 13"> <left> <button onclick="" style="background:sweep.png;height:20;width:20"></button> </left> <center> <input type="search" placeholder="在众多App开发中选择iMAG" style="tint-color:#ffffff;background:#e6e6e6;color:#323232;width:281;font-size:10;corner-radius:5"/> </center> <right> <button onclick="" style="background:message.png;height:20;width:20"></button> </right> </title>
在left子标签添加扫码的脚本功能——$phone.barcode()
2、顶部标签栏
顶部标签栏tabbar需要写在header标签里,通过多个item来切换不同的页面
<header> <tabbar style="background:#ffffff;label-color:#717171,#303030;indicator-color:#d80b08"> <item label="推荐"></item> <item label="精选"></item> <item label="国内"></item> <item label="海淘"></item> <item label="母婴"></item> <item label="美妆"></item> </tabbar> </header>
3、内容展示
内容展示部分大多数情况下都会使用list标签进行布局,需要跳转页面的可以在标签内添加onclick点击事件属性。
<contents> <content style="background:#FFFAFA"> <slideimage style="height:186" indicatorPosition="right" fillwidth="true" autoplay="true"> <item src="http://img1.efu.com.cn/upfile/bdvt/m-3d97ae02-1f65-463e-a0ad-cf1a39013135.png"/> <item src="http://img1.efu.com.cn/upfile/bdvt/m-7034ba7b-1177-4173-ad7a-4755957ef15a.jpg"/> </slideimage> <list style="height:55" type="transparent"> <item style="padding:12 26 9"> <col> <row style="background:signin.png;height:17;width:17"></row> <row><label style="font-size:11;align:center;color:#5c5c5c;padding-top:3">今日签到</label></row> </col> <col> <row style="background:update.png;height:17;width:17"></row> <row><label style="font-size:11;align:center;color:#5c5c5c;padding-top:3">每日上新</label></row> </col> <col> <row style="background:shoplimit.png;height:17;width:17"></row> <row><label style="font-size:11;align:center;color:#5c5c5c;padding-top:3">限时抢购</label></row> </col> <col> <row style="background:discount.png;height:17;width:17"></row> <row><label style="font-size:11;align:center;color:#5c5c5c;padding-top:3">推荐有礼</label></row> </col> </item> </list> </content> </contents>
4、底部标签页
底部标签页切换不同的页面是tab标签实现的,tab标签很简单,只要把title和content等控件放到tab里面就可以了。
其他页面大家想要用什么样的布局方式都可以尝试一下,这里就不一一细讲了。
详细代码可以在github上查看
发表评论
-
访问后台数据库有多6,看看这里便知
2016-10-14 17:29 581相信使用爱码哥的小伙 ... -
label和slideimage共存|用得到的就拿去
2016-09-13 18:12 538要求:Label标签置于slideimage之上并透明 限制: ... -
imag.js|快速掌握全局方法
2016-08-29 17:17 564使用爱码哥进行移动应用开发时,除了了解基本的内容控件、表单控件 ... -
imag.js|教你如何智做原生APP
2016-08-17 18:03 669手机计算器是我们日常中很熟悉并且使用起来非常简单的应用了,这样 ... -
开发技巧汇总|对于imag.js你不知道的事
2016-08-03 16:48 5631. imag.js里有哪些标准JavaScript对象? i ... -
爱码哥移动开发平台|让制作app更加便捷
2016-04-26 15:14 567本文来自爱码哥CTO邱杨(Terry)同学 随着HTM ... -
关于使用iMAG.js出现的问题及解决方法
2016-05-05 18:05 541●list子标签的Item默认交互效果能取消吗? se ... -
移动开发|浅谈list列表布局控件
2016-05-11 10:54 480在iMAG开发app中界面布 ... -
iMAG中的复用列表的使用说明
2016-05-11 17:29 460复用列表(resue list)在爱码哥中是不同于普通列表的 ... -
iMAG(爱码哥)新建应用
2016-05-18 14:22 448在爱码哥移动应用开发平台如何新建应用? 在首页找到工作台 ... -
微信页面的代码|你一定没有看过这么神奇的代码
2016-05-18 16:01 913Android iOS: 代码: &l ... -
移动开发|绘制饼图、柱状图、2d、3d统计图表
2016-05-31 12:29 614通过HTML5的canvas来绘制图表功能,需要用到web控 ... -
作为开发者不可不收藏的十大开发语言和框架
2016-06-02 09:48 4371.Android SDK Android开发者不可 ... -
作为开发者不可不知的Native App,Web App,Hybrid App等技术的对比
2016-06-12 18:10 378随着移动开发需求的不断增多,五花八门的开发方式也层出不穷,作 ... -
移动应用开发跨平台工具imag.js入门
2016-07-05 15:47 448imag.js是一种NativeScript形式的框架,它兼 ... -
爱码哥移动开发平台的4大开发环境
2016-07-06 14:16 437imag.js是一种NativeScript形式的框架,它兼 ... -
推荐爱码哥移动开发平台十大常用的原生UI控件
2016-07-06 17:52 433imag.js是一种NativeScript形式的框架,它兼 ... -
移动应用开发技术过多,该如何做选择
2016-08-01 18:11 413随着互联网创业的持续 ... -
一个初级开发者完胜十几人团队,此处有秘诀!
2016-07-22 18:55 671最近今日头条很火,作为一名喜欢钻研的开发者,仔细研究了他们的A ... -
H5实现APP和原生方式有多大差距,多少坑?JS才是王道!
2016-07-15 12:52 6941纯H5的APP,虽然开发起来要比纯原生开发畅快的多,但最终效果 ...
相关推荐
在本项目中,我们关注的是一个基于JAVA语言开发的电商应用程序,特别针对笔记本...以上便是基于JAVA开发的笔记本电商APP源码所涵盖的主要知识点。深入理解并熟练运用这些技术,对于开发高效、稳定的电商应用至关重要。
商品信息可能包含名称、价格、库存等字段,通过GET请求获取列表,POST请求添加新商品,PUT和DELETE请求分别用于更新和删除商品。 2. **订单处理**:订单接口需要处理用户的购买行为,包括创建订单、查询订单状态、...
【1】哪些人可以用到 1,不知道咋get、post请求的;...模拟请求串可以自己写,重点是借鉴一下加密方式,如果不会get和post的也可以翻一下里面的局部代码直接拿去用。 【4】留个 E麦 多多交流:guangxfxj圈sina.com
【SpringBoot电商系统源码.zip】是一个包含Spring Boot技术栈的电子商务系统源代码包,它提供了构建高效、可扩展的在线购物平台所需的核心功能。在这个项目中,Spring Boot的灵活性和自动化配置特性被充分利用,以...
5. 超链接:电商网站中的各个页面之间需要有链接,`<a>`标签用于创建超链接,如`产品详情</a>`,可以跳转到指定的页面。 6. 列表与网格布局:电商商品通常会以列表或网格形式展示,HTML的`<ul>`(无序列表)、`<ol>...
"如何让你的应用在App Store中被推荐"(29 How to Get Your App Featured on the App Store)是开发者们关注的焦点,这涉及到一系列策略和技巧。本篇将深入探讨这个主题,主要针对Java开发者,虽然Apple的iOS系统...
【C#电商平台网络爬虫】是一种使用C#编程语言编写的特定软件,其主要功能是自动从电商网站中抓取并收集商品信息。C#,作为Microsoft开发的一种面向对象的编程语言,因其强大的功能和易用性而常被用于开发各种类型的...
《基于uniapp的电商项目详解》 在移动互联网飞速发展的今天,电商平台的开发已经成为企业和开发者关注的重点。...同时,对电商应用的业务逻辑和用户体验也会有更深入的理解,为今后的项目开发积累宝贵经验。
这些代码主要用于教学目的,可以帮助学生理解和实践电商系统的关键技术,非常适合用作大学的大作业或毕业设计项目。下面我们将深入探讨其中涉及的重要知识点。 1. **Java基础与面向对象编程**: - Java语言特性:...
这个项目作为一个学习资源,可以帮助开发者了解并掌握电商网站的整体架构和关键技术,对于提升全栈开发能力非常有帮助。不过,需要注意的是,由于项目中可能包含敏感信息,如数据库连接字符串、API密钥等,所以在...
### 电商管理后台 API 接口文档解析 #### 一、概述 本文档旨在详细介绍电商管理后台API接口的具体实现方式及使用方法。该文档适用于所有与电商管理后台系统交互的应用程序开发者,帮助他们理解如何利用这些接口...
这个项目适合初学者,旨在帮助他们掌握Java开发的基本技能,并了解如何将这些技能应用到实际的电商项目中。下面我们将深入讲解相关知识点。 1. **Java基础知识**:在开始电商项目之前,首先需要熟悉Java的基础语法...
Java电商源码是用于构建电子商务平台的软件代码,它涵盖了从用户界面、商品管理、订单处理、支付系统到库存控制等多个关键模块。在企业级开发中,Java因其强大的稳定性和可扩展性而成为首选语言。本篇文章将深入探讨...
在当今数字化的时代,生鲜电商已经成为了一个热门的领域,它将传统的果蔬购物体验与现代的互联网技术相结合,为用户提供便捷的在线购买服务。在这个过程中,强大的后端框架和前端技术是至关重要的。本篇文章将深入...
通过上述接口的详细介绍,我们可以看出该电商项目涉及的功能较为全面,从用户登录注册到商品搜索、购物车管理等多个方面都有覆盖。这对于开发者来说是一份非常宝贵的资源,能够帮助他们快速了解并接入系统的各个模块...
`jQuery电商网站常用商品分类导航菜单代码.zip` 提供了一种高效解决方案,它旨在帮助开发者创建一个兼容IE8及更高版本浏览器的交互式菜单系统。这个菜单系统允许用户通过点击左侧的下拉菜单轻松浏览并筛选不同类别的...
在电商行业中,管理后台是系统运营的核心部分,它负责处理各种业务逻辑,提供高效的数据管理和操作功能。API(Application Programming Interface)接口则是管理后台与前端应用进行数据交互的关键桥梁。本文档将详细...
"get app_Getapk_android_" 提供了一个这样的工具,用于展示App的信息并导出APK安装包。下面将详细介绍这个工具及其相关知识点。 首先,`GetApk` 这个名称暗示这是一个获取APK的工具,可能包含对已安装应用的扫描、...
在后台模板管理中,我们可以修改模板,但是对有检测,我们可以用来绕过这个检测。然后,我们可以编写脚本得到超级管理员的session,然后登录。 这篇文章详细讲解了youdiancms最新版getshell漏洞的发现和利用过程,...
Node.js是一个流行的开源JavaScript运行环境,它允许开发者使用JavaScript进行服务器端编程。这个系统涵盖了电子商务领域中的多个核心功能,包括购物车、商品管理、订单处理以及订单评价等。 1. **Node.js基础**: ...