[干货]如何在一天之内完成一款具备cool属性的Android产品<简诗>

版权声明:本文原创发布于公众号 wingjay,转载请务必注明出处! https://www.jianshu.com/p/cf496fc408b2

简诗

2016/12/02 更新:
新文章《我的第一款全栈side project》介绍了我在开发简诗 v2.0 中对Android端及服务端累积的一些经验。

2016/11/09 更新:
v2.0正式版下载地址:http://fir.im/vd1r
该正式版中本人添加了服务端,支持了注册登录、数据同步和截屏分享,而且添加了不少很有意思的小功能。
Android 和 Server 源码: https://github.com/wingjay/jianshi

一、简介

实现一款具备cool属性的产品是众多独立开发者都渴望的。
然而,很多独立开发者之所以迟迟无法下手,并非热情不够,而是对于整个开发流程的未知与畏惧。而本文就是介绍本人耗时一天左右完成的一款Android产品的开发流程,从idea,到产品原型及设计,再到code架构与编写
希望读者看完后能对独立开发有不同的认识,然后挥舞起手中的键盘,开发出很cool的个人产品。

二、开发流程

1. idea
首先,你要有一个idea。好的想法来自哪呢?生活。多观察生活中点滴,每当你对现有事物有要抓狂的感觉时,往往就意味着一个绝妙idea的诞生。

当然,不要再闹`只差一个程序员`的系列笑话啦!

举个例子,本人有点文艺情怀,非常希望有个好的记录工具让我以一种优雅而复古的方式记录文字。然而,现有的记录工具大都集社交、多种信息流为一体,绚丽的界面反而让我感觉到一种缺失,找不回曾经字字斟酌的写作感觉。
所以,本文要介绍的就是我为自己开发的一款(自认为)优雅、简洁的写作应用

2. 产品原型和设计稿

这一关,很多开发者不重视且不擅长。

不过也能理解,一般而言,developer更加注重代码层面的美观,逻辑的抽象与性能的优化。然而,作为独立开发者,我们的目标是一款受用户喜爱的产品,而不仅是深藏巷中的好酒。而用户对一款产品最直观的感受,就是界面与交互,只有当用户对UI、UX满意之后,才会去深入感受产品的功能与速度。

 所以,一位合格的独立开发者,一定会在第一时间找到自身产品的槽点然后骂骂咧咧又毫不犹豫地把它修掉。

文末,本人推荐了一些相关的工具,可以帮助开发者快速设计产品原型。
本文的设计草稿来源于Kevin《Producter》一书中的想法,下图为草稿图纸。

小记设计稿

从设计图纸中可以看出,该设计很古典、简洁,而又不失个性,正好是我所追求的。
ok,下面开始写代码!

3. Android架构
各位看官不要急着啪啪啪敲键盘,先思考下这个app会涉及到哪些技术细节,以防后知后觉。

a. 自定义View,容易发现,该产品有三个特点,一是`红点按钮`,二是`竖排文字`,需要自己写新的view来实现;
   三是`字体`,设计稿采用了`康熙字典体`与`文悦古仿宋`。
b. SQLiteDabase数据库.这款产品核心功能是`写和读`,第一版本暂不作服务器端开发(后续本人会抽空实现后台)。
c. 时间,内部的时间会以`中文繁体`的形式显示给用户,如`2015.10.6`会显示成`二零一五年 十月 六日`,
   所以需要实现一个`时间转换器`把数字转换为繁体时间格式。
d. 还有一个容易被忽视的,`布局`。设计稿里看似排版简洁,实际下了很大功夫在`文字排版及间距设计`上。
   作为一款记录工具,文字排版可谓是核心一环,直接影响用户体验。
基本点

4. Code实现
好了,下面就开始舞动键盘啦。

  • 想好产品的名字,本款产品直接命名为<简诗>,寓意简单的小诗,简单的生活

  • Android studio创建一个新工程。包名 com.wingjay.jianshi

  • 创建需要的Activity。这里包含了SplashActivity[产品介绍页], MainActivity[主页面], EditActivity[编辑界面], ViewActivity[浏览界面]。这些是主要的,其它的后续再加。

  • 先完成视图层的实现。

    • SplashActivity[最初产品介绍页] 可以放一张简洁的介绍页面,用handler定时1秒钟跳转到主页面。
    • MainActivity[主页面],先实现竖排文字VerticalTextView,原理很简单,给每个文字字符后加'\n'即可。然后实现红点按钮RedPointView,写一个红色circle shape作为背景,允许更改里面的text内容。
    • EditActivity[编辑界面]ViewActivity[浏览界面] 布局简单,主要包含两个EditText 和 一个RedPointView来执行保存等,这里我们先不实现竖排文字编辑,只要横排即可。
    • 字体,本人采用了TpldKhangXiDictTrial.otf暂时作为主要字体,不过,在编辑和浏览界面的字体仍保持系统默认,防止有些字体丢失之类问题。
  • 然后进行逻辑层的实现。

    • 时间转换器,即将数字时间转化为繁体中文时间,2015.10.6->二零一五年 十月 六日,对于,可逐个字符转换:2->,0->。对于,若小于10则逐个转换,但大于等于10要注意,如11->十一而非一一21->二十一而非二一
    • 获取时间戳,上面讲了将数字时间转换为繁体时间,那么如何获取数字时间呢?这里采用Joda Time 来获取时间如getYear(), getMonthOfYear(), getDayOfMonth()即可。在数据库及应用内部使用的都是Joda Time转换来的秒级时间戳,只有在显示给用户时才把时间戳传给转换器去显示。
  • 最后是数据层的实现

    • 数据库设计,我们要设计一张日记表,包含了
  • id自增长

  • device_id设备id,以后如果要添加帐号及上传服务器可以此标记每个日记来源

  • title,content记录内容

  • created_time, modified_time 更改时间,存储以秒为基准的时间戳

  • deleted_flag 删除标记,若为1则表示删除

    • SQLiteDatabase,需要实现两个类:DbOpenHelperDbUtilDbOpenHelper继承SQLiteOpenHelper,主要负责db的创建更新和对外提供db实例来进行读写。DbUtil主要封装db操作,如读取日记getDiary(long diaryId),该函数会利用DbOpenHelper获取SQLiteDatabase实例来进行读写。

三、粗糙版demo

完成上面几个步骤后,基本可以搭建产品demo,正常实现记录与阅读的功能。而且产品也具有一定味道,不至于湮没大众。读者只需要进行一些bug调试工作即可。
下面给大家看第一版粗糙的demo

介绍页

主界面

阅读页

编辑页

四、改进版demo

当然,上面有点粗糙,而且不支持竖排文字,这是原版设计风格的一大缺失,所以本人在改进版中支持用户选择竖排浏览方式,而且作为一款新产品,获取用户的反馈是极为重要的,故也添加反馈入口(由于没搭后台,只能先让用户以邮件形式反馈😭)。
下面是改进版的demo截屏。

介绍页
主界面
支持`左右滑动`的竖排方式浏览
支持`上下滑动`的横排方式浏览
设置界面
简诗-new icon.png

五、下载及版权

  1. 36Kr NEXT推荐。
    稀土掘金 推荐
    [稀土掘金日报] andriod开发新资源新干货
  2. apk 下载网址:JianShi lastest version in Fir.im
  3. 源代码:简诗——GitHub,欢迎各位fork并和我一起丰富简诗
  4. Follow me. 欢迎在Github上follow我哦,😄
  5. 若有幸简诗得到各位喜爱,希望能把邮箱发给本人(私信),之后若有更新会通知你的😄
  6. 设计草稿创意使用已获得作者Kevin同意
  7. 本产品用作分享与学习,若转载须征得本人同意,勿作任何商业用途

六、服务端

本人从2016/09月开始进行服务端的开发,最新的代码请关注 https://github.com/wingjay/jianshi

目前已经完成了v2.0的服务端开发。

如果读者有任何意见,可以与本人联系:yinjiesh@126.com

感谢!

七、必备工具推荐

谢谢!

wingjay

GitHub: https://github.com/wingjay
微博: http://weibo.com/u/1625892654

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,445评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,889评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,047评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,760评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,745评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,638评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,011评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,669评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,923评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,655评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,740评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,406评论 4 320
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,995评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,961评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,197评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,023评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,483评论 2 342

推荐阅读更多精彩内容