我的uni框架APP(共享充电投放)独立开发日记 第一天

news/2024/11/25 16:38:38/

我的uni框架APP(共享充电投放)独立开发日记

  • 项目说明及介绍
    • 练习阶段
    • APP开发第一天(设计和功能归类)
      • 首页
      • 物品
      • 我的

项目说明及介绍

在前不久写完了第一个微信小程序之后,开始补课VUE,就在VUE的官网上看到了一个推荐IDE,发现了里面的5+APP开发框架,可以生产小程序网页和手机APP,并且部分是原生的系统组件,我就开始了我的APP开发。
这个APP是一个脑海中的想法,通过用户的购置,去投放共享的充电宝,我们在充电宝的可使用周期内给用户提供收益,双方共赢。

练习阶段

今天显示熟悉了uni的框架,发现他和微信小程序如出一辙,仅仅只是语法变成了VUE和微信小程序语法之间的。
uni有内置浏览器预览,但是我觉得效果无法比拟微信小程序的模拟器,巧的是,这个IDE可以支持微信小程序开发工具预览项目。就是可以这边编译了,就可以在微信小程序中预览,十分方便,为了练手,我特地做了一个仿QQ音乐的APP
在这里插入图片描述
在这里插入图片描述
通过练习,组件以及适应,包括每个组件的功效,等等

底下的文字滚动模仿,是我写的较烦的一个,反复推翻好几次。最后用scroll-view里面写了两个text,通过Interval实现了滚动以及滚动完毕等待5秒进行下次滚动,与QQ音乐完全一致

APP开发第一天(设计和功能归类)

一个完整的APP开发其实是比较烦的,从功能再到界面元素的设计,初期是三个tap_bar。

首页

用来展示软件,里面要能够很好的展现出我们软件的特点特性,以及刺激消费,所以我选择添加了一个排行榜在首页,软件采用邀请机制,拉取下线获得佣金或者分成占比,添加了一个轮播的用户购买记录,目的如上,当然,肯定也不能少了充值的,在首页专门设立一个便捷购买的位置,直接点击即可跳入购买界面。
在这里插入图片描述

物品

这个界面内展示可自己的已购买的机器,在其中查看收益,机器剩余时间,使用率等信息,增加购买通道,让用户选择需要购买的机器,然后发起购买。
在这里插入图片描述

我的

这个界面先是个人资料的展示,比如头像,推荐码,用户名,收益,机器数量,下级数量。这是在个人资料展示框内所需要的,底下会有tap按钮,里面可以进入其他页面。因为是堆成式设计,所以为双数,

  • 会员资料(里面可以查看资料修改资料密码等等)。
  • 下载app(因为我们还有H5和小程序端口,所以还需要适配机器进行下一步的操作)。
  • 我的收益(里面有资金流水和实时收益和余额),我要提现(提现)。
  • 我的下级(用来展示我拉来的朋友们,和他们的收益情况)。
  • 推荐好友(点击出现一个推广二维码,可以保存到手机发送给朋友,就可以通过扫码即可快速注册)。
  • 帮助中心(一些软件的使用说明)。
  • 关于我们(有点和上一个冲突,但是为了对称式设计,里面塞一些关于公司说明)。
  • 收入排行(里面展示收入最多的6个用户的收益展示)。
  • 退出系统(退出登录,跳转到首页,待用户点击到其他需要post的页面时,重新发起登录)。

到此为止,一个大概的软件所需的功能就已经分布好了,由于我现在已经距开发之后已经好几天了,暂时贴不了第一天地图,我直接在第二天上设计实现UI的图片。
在这里插入图片描述

第一天就到这结束了。界面设计就在第二天哦,我画画课真是强透了呢!


http://www.ppmy.cn/news/217415.html

相关文章

来电街电小电怪兽,这三电一兽如何把充电宝练成了吞金兽?

文|ihahe 来源 | 智能相对论(ID:aixdlun) 不知不觉中,充电宝练成了吞金兽。 1、盈利了还涨价,共享充电宝在试探价值极限 最近共享经济涨价传闻传得很快,尤其是充电宝涨价更是惊人,在有的地方甚至达到8元…

充电宝不耐用怎么恢复?2022最耐用的充电宝排行榜

在以前没有手机的那个年代,远在异地的亲友联系必须要通过邮件的方式,但这种方式往往非常费时费力。手机的频繁使用,手机电量也是大家所担忧的。因此,我为大家整理了2022年最耐用的充电宝排行榜,彻底解决你的用电焦虑症…

Spring Cloud Alibaba - Sentinel(一)

目录 一、Sentinel介绍 1、什么是Sentinel 2、Sentinel好处 3、Sentinel下载和安装 二、搭建Sentinel项目 1、创建项目cloudalibaba-sentinel-service8401 三、Sentinel流控规则 1、流控规则基本介绍 2、新增流控 2.1、QPS直接失败案例 2.2、线程数直接失败案例 3、…

Spring Cloud Alibaba - Nacos源码分析(一)

目录 一、源码 1、为什么要分析源码 2、看源码的方法 二、Nacos服务注册与发现源码剖析 1、Nacos核心功能点 2、Nacos服务端/客户端原理 2.1、nacos-example 2.2、Nacos-Client测试类 3、项目中实例客户端注册 一、源码 1、为什么要分析源码 1. 提升技术功底&#x…

Win11双屏设置双壁纸--2K屏+1080P使用不同壁纸的方法

先上方法及效果: 方法:两张图片(图1尺寸:19201080,图2尺寸:25601440),Photoshop裁减图1并与图2拼接成一张图片(尺寸:44801440)设置为背景图片&…

电脑高清2K/4K图片下载网站

电脑高清2K/4K图片下载网站 3g手机壁纸站 https://desk.3gbizhi.com/ *缺点:不可以搜索🔍,只有分类可查找 wallpaperModal https://wall.alphacoders.com/?langChinese *可以搜索🔍,有中英文,可切换 v…

Backiee 8K壁纸(电脑端)

今天给大家分享一个好用的壁纸软件,有网站和软件站点。我建议你使用网站使它更流畅。 网站是英文的,现在所有浏览器都有翻译功能,对这些英文网站没有压力。一键翻译就够了。 壁纸的分类真的很贵,比如抽象、动物、动漫等。分类近20…

Nvidia GTX 10系列显卡

在GTX 10系列(GTX 1050Ti/1060)显卡上,已经不支持模拟输出,因此它不仅没有VGA接口,连DVI也是采用了241的DVI-D接口,而普通的DVI转VGA转接头只是将245的DVI-I中的模拟信号提取出来,这样当普通的DVI转VGA接头插入DVI-D接…