独立双端App《瓦格相机》的开发过程分享

2024-09-06 22:58

本文主要是介绍独立双端App《瓦格相机》的开发过程分享,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前言

Hello大家好,我是灯灯,独立开发者灯灯,也是天天学藏语的灯灯,哈哈哈...
好了屁话少说,今天和大家分享一下最近自己独立制作一款应用的经验历程,希望能对刚刚起步的新手们、还有独立开发者们有所帮助。

什么样的应用

我想做的是一款能够将照片转换成文字拼成的图片应用,也就是,图片中的每一个像素点都将会被文字取代,同时对应色彩、密集程度等。
之所以想做这样的应用是因为早在我高中的时候,我就用VB做过一个类似的应用,当时朋友们很喜欢,经常问我要这个软件。如今PC时代已经离我而去,自然就想在移动平台也做一个。
其实之前我已经用Python脚本写了一个,效果还算不错,大家可以前往使用:
图片转文字Python版本GitHub

构思与设计

软件的需求很简单,因为是自己独立开发而且软件结构比较简单,就没有设计流程图之类的。
初步构思,软件只有几个界面:

  • 首页:让用户打开图片或者拍照
  • 素材库:瀑布流,提供一些素材
  • 裁剪:让用户对图片进行裁剪
  • 设置:让用户对要生成图片的文字进行输入
  • 生成:得出结果,保存、社交分享

所以整体还是很简单的,核心技术肯定是生成页面,其余只是布局和第三方开源库(原谅我这么懒)的问题。
然后,设计师登场(还是我)。
我不怎么会用Sketch,于是还是用PS进行设计,一开始想采用唯美清新文艺小青年风格,整体浅绿色调,给人一种马卡龙配色的感觉。等我设计完,在不同手机查看的时候发现由于色温关系,不同手机显示效果差异极大,非常恶心。
一怒之下重新设计,这一次决定采用白色、橙色为主色调的卡通风格。


效果图


图标是自己用PS绘制的,采用了MBE风格,形象就是一只照相机...
至于名字,我一贯地总是想到什么就是什么。

技术方案

设计完后没有急着立马动手,先想了下每个页面的技术方案。

  • 首页:毫无难度
  • 素材库:collectionView,自己再写个简单的php接口
  • 裁剪:不会,求救GitHub开源库,我坚信一定有很多
  • 设置:毫无难度
  • 生成:算法已经用Python做过了,照搬就行了
  • 分享:友盟或者ShareSDK

于是,经过我在GitHub上苦苦的搜寻,和一遍遍地Demo尝试,最终确定下来用这些开源库:

  • 安卓:
    android-gif-drawable 用来显示Gif加载动画
    SimpleCropView 用来裁剪照片
    PhotoView 用来全屏显示图片
    ShareSDK 用来分享,友盟的AndroidStudio不支持
  • iOS:
    TKImageView 用来裁剪照片
    UIImage-Resize 用来缩放图片
    uiimage-from-animated-gif 用来显示加载动画
    友盟分享 社交分享

着手开发

这一次我没有先选择开发iOS端(以往总是先做iOS),选择了先做Android,原因是一开始测试核心代码的时候iOS没有写成功,安卓成功了。
先把PS设计图用CutterMan(切图神器)生成切图,然后就动手开发。
安卓端使用AndroidStudio开发,一遍遍构建Activity,构建xml布局,码字、测试...
遇到的棘手问题又:

  • 图像在Activity间的传递问题,我转换成bytes传递,经常发生崩溃的情况,不得已全部将图片压缩后再传输,知道原因的朋友可以留言告诉我下。
  • 像素读取的时候的横竖问题,x和y轴总是搞反,大家可以参考python版代码看下到底该如何写宽高。
  • ShareSDK的集成问题,由于不需要它的UI,采用直接分享接口,数据传递遇到了很多bug,总之,在AndroidStudio上,友盟和sharesdk都一塌糊涂,大家慎用。

安卓端基本做完后,着手开发iOS,第一步还是去解决核心图像算法,这一次终于成功解决,而且iOS生成的图片效果要比安卓好得多,不知道为什么。
iOS上的项目依赖我还是用的CocoaPods,暂时没有尝试其他的,代码采用OC。
然后开始搭建界面,我不喜欢用storyboard或者xib,所有界面都是用代码按照比例计算布局写的。
iOS上问题不大,比起安卓反而容易,前前后后安卓和iOS双端总共花了3天左右的时间完成。

上线之前的准备

不是开发完了就能发布的,还有很多很多事情要做。

  • 制作应用预览图(宣传图)
  • 申请分享需要的AppKey,包括微信、QQ、新浪
  • 制作简单的应用官网
  • 制作素材库需要的php接口

好在做这些事情已经得心应手,申请AppKey的过程提醒下大家:新浪最麻烦,需要demo、官网,其他的不需要demo和官网。


宣传图


自适应的“官网”,也就是下载页面 www.winterfeel.com/vug:


手机版官网

针对官网补充一些技巧,因为微信是无法直接下载apk和跳转AppStore的,所以在JS代码中我进行了检测,如果发现是微信,则弹出一个提示,引导用户用浏览器打开进行下载。

php接口由于接口简单,只是一个查询返回json,我就只用了原生php写了个select语句,没有采用任何框架。

结束的话

至此,这款小小的独立App已经差不多开发完成了,然后就是提交给各大应用商店以及苹果了,苹果总是很顺利的发布,安卓我就不想多说了,只上了应用宝和360。
整个软件可以说是很简单的小应用,但是开发中涉及到的问题还是很多的,尤其是作为独立开发者,所有的一切都得自己做的时候,还是很麻烦的。
我想,除了我这样闲的没事做的人应该也没有多少人会去做这样的一个应用吧,毕竟做完也没几个人下载,哈哈,毕竟

大四不考研,天天像过年

如果整个历程能够对大家所有帮助的话,希望大家支持下这个独立小应用。
如果你也喜欢自己做程序,如果你有好想法、缺伙伴,交个朋友一起玩!


个人微信,添加注明简书

瓦格相机 - 官方网站 欢迎大家下载试玩
GitHub Python版代码

这篇关于独立双端App《瓦格相机》的开发过程分享的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1143361

相关文章

Golang操作DuckDB实战案例分享

《Golang操作DuckDB实战案例分享》DuckDB是一个嵌入式SQL数据库引擎,它与众所周知的SQLite非常相似,但它是为olap风格的工作负载设计的,DuckDB支持各种数据类型和SQL特性... 目录DuckDB的主要优点环境准备初始化表和数据查询单行或多行错误处理和事务完整代码最后总结Duck

基于Python开发电脑定时关机工具

《基于Python开发电脑定时关机工具》这篇文章主要为大家详细介绍了如何基于Python开发一个电脑定时关机工具,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1. 简介2. 运行效果3. 相关源码1. 简介这个程序就像一个“忠实的管家”,帮你按时关掉电脑,而且全程不需要你多做

SpringBoot 整合 Grizzly的过程

《SpringBoot整合Grizzly的过程》Grizzly是一个高性能的、异步的、非阻塞的HTTP服务器框架,它可以与SpringBoot一起提供比传统的Tomcat或Jet... 目录为什么选择 Grizzly?Spring Boot + Grizzly 整合的优势添加依赖自定义 Grizzly 作为

Java中的Opencv简介与开发环境部署方法

《Java中的Opencv简介与开发环境部署方法》OpenCV是一个开源的计算机视觉和图像处理库,提供了丰富的图像处理算法和工具,它支持多种图像处理和计算机视觉算法,可以用于物体识别与跟踪、图像分割与... 目录1.Opencv简介Opencv的应用2.Java使用OpenCV进行图像操作opencv安装j

mysql-8.0.30压缩包版安装和配置MySQL环境过程

《mysql-8.0.30压缩包版安装和配置MySQL环境过程》该文章介绍了如何在Windows系统中下载、安装和配置MySQL数据库,包括下载地址、解压文件、创建和配置my.ini文件、设置环境变量... 目录压缩包安装配置下载配置环境变量下载和初始化总结压缩包安装配置下载下载地址:https://d

将Python应用部署到生产环境的小技巧分享

《将Python应用部署到生产环境的小技巧分享》文章主要讲述了在将Python应用程序部署到生产环境之前,需要进行的准备工作和最佳实践,包括心态调整、代码审查、测试覆盖率提升、配置文件优化、日志记录完... 目录部署前夜:从开发到生产的心理准备与检查清单环境搭建:打造稳固的应用运行平台自动化流水线:让部署像

macOS怎么轻松更换App图标? Mac电脑图标更换指南

《macOS怎么轻松更换App图标?Mac电脑图标更换指南》想要给你的Mac电脑按照自己的喜好来更换App图标?其实非常简单,只需要两步就能搞定,下面我来详细讲解一下... 虽然 MACOS 的个性化定制选项已经「缩水」,不如早期版本那么丰富,www.chinasem.cn但我们仍然可以按照自己的喜好来更换

springboot整合gateway的详细过程

《springboot整合gateway的详细过程》本文介绍了如何配置和使用SpringCloudGateway构建一个API网关,通过实例代码介绍了springboot整合gateway的过程,需要... 目录1. 添加依赖2. 配置网关路由3. 启用Eureka客户端(可选)4. 创建主应用类5. 自定

C#读取本地网络配置信息全攻略分享

《C#读取本地网络配置信息全攻略分享》在当今数字化时代,网络已深度融入我们生活与工作的方方面面,对于软件开发而言,掌握本地计算机的网络配置信息显得尤为关键,而在C#编程的世界里,我们又该如何巧妙地读取... 目录一、引言二、C# 读取本地网络配置信息的基础准备2.1 引入关键命名空间2.2 理解核心类与方法

基于Qt开发一个简单的OFD阅读器

《基于Qt开发一个简单的OFD阅读器》这篇文章主要为大家详细介绍了如何使用Qt框架开发一个功能强大且性能优异的OFD阅读器,文中的示例代码讲解详细,有需要的小伙伴可以参考一下... 目录摘要引言一、OFD文件格式解析二、文档结构解析三、页面渲染四、用户交互五、性能优化六、示例代码七、未来发展方向八、结论摘要