您的位置 首页 知识

android开发入门与实战(十步教你简单入门Android开发(一))

android开发入门与实战
随着梅罗双双把家还,世界杯即将进入四分之一决赛。少了大量球迷互撕,大家心态也佛系了。单纯的享受着足球带给我们的快乐:三喵军团、“内式翻滚”、啤酒毛豆小龙虾,简直不要太爽!
?

唯一美中不足的是时间有点尴尬,比赛都是集中在半夜进行。但是这丝毫减少不了国内球迷朋友们热情,大家一起熬夜狂欢,助威世界杯。But——

有这么一群人,哪怕没有世界杯他们也总是在半夜蛰伏在屏幕前,伴随着啪啪啪……的键盘声,用一行行代码创造世界。

Hello, World!正文开始!

随着软件工程部的团队越来越壮大,继产品大大,UI小姐姐们的满满干货,开发小哥哥们坐不住了,请让我们先在这里做个隆重的自我介绍。

程序猿
一种近几十年来出现的新物种,是信息革命的产物,在行为和物种归类上我们也可称为码字猴。程序猿是人类在科技研究上的一种新兴进化,拥有无与伦比的耐力、超越时代的智商、横穿社会的苦逼相和低于人类平均寿命的显著特点。

言归正传,其实我们就是大家熟知的程序员小哥哥,我们的职责就是实现产品大大的需求,UE小姐姐们的逻辑,以及UI小姐姐们的设计。我们是需求的实现者,也是问题的终结者。任何需求经过层层筛选,评审,最终到达我们手里,而我们,则是将它们噼里啪啦(默默地响起键盘声)地以程序的形式表达出来。

下面我将以一名Android程序员的视角来为大家解读程序员是如何一步步地将需求,落实到产品,这中间又会有哪些不为人知的故事呢?

任何岗位都是有输入、输出的,作为一个称职的程序员,不仅仅只和机器打交道,也是要和产品、UE、UI打交道,从外部获取完整的需求列表、功能清单以及UE稿、UI稿,拿到输入,进行程序概要设计、详细设计、编码开发、单元测试、集成测试,输出产品。对于整个流程,我们来一一梳理。

产品需求清单:产品在设计过程中,开发是不需要介入的,而当产品的基础功能由产品大大设计完成并输出给各团队进行评审时,这时开发就得介入了,有人要说,为什么开发介入这么早?因为在产品的需求进行评审时,开发就已经需要进行技术调研、技术研究,如果某一功能点技术无法实现,需要直接反馈给相关人员,以便进行调整。
UE稿:UE稿体现的是逻辑、用户体验,也是开发的重要输入之一,包括各个功能之间的跳转关系、业务逻辑。
UI稿:UI稿是效果及页面展示,同样作为重要的输入,包括各个页面的设计(布局,字体,位置、颜色等),UI小姐姐们在做好UI稿之后,会与开发一起评审UI稿的可实现性,在此过程中,开发需要对UI稿进行技术性的分解,并及时提出问题。

作为Android开发人员,在拿到了以上所有的输入之后,即开始开发工作,具体工作怎么开展,我将其分解了三大块。

程序设计:分概要设计和详细设计,概要设计的主要任务是根据需求分析后的结果,进入软件架构设计及数据结构设计,说的浅显点,就是,我们根据需求分析之后,得出采取什么软件架构比较好,基础的框架应该怎么搭,以及整个软件将分为几个功能模块。在概要设计完成之后,再进行各个模块的详细设计。
编码:在详细设计完成之后,进行实际的编码工作,这个过程最枯燥,但是也最重要。
测试:一个没有经过测试的产品是不能够发布的,测试是为了让我们的产品更健壮,稳定性更高。

Android是一种基于Linux的自由及开放源代码的操作系统,主要用于移动设备,如智能手机和平板电脑,由Google公司和开放手机联盟领导及开发,由于Android良好的开放性,对于软硬件的接口已相当成熟,文档规范也已颇具规模,所以它被我们选择作为预研项目的开发平台。

既然是开发软件,那么怎么得有一套趁手的家伙对不对?下图就是Android开发工程师必备的IDE(Integrated
Development Environment集成开发环境),Android
Studio,在该开发环境下我们完成代码的编写、编译、调试等工作。

Android Studio的界面主要分成5大块:
项目目录结构:这里会以树状结构显示当前项目所有文件夹及文件,并且支持模糊搜索。
编辑器:在这里创建和修改代码,编辑器会根据文件的不同显示不同的布局,比如如果是编辑layout文件,则会显示布局编辑器。
预览:如果当前正在编辑layout文件,如图所示,则会出现预览,所见即所得。
工具:提供Terminal窗口,版本控制,Logcat等工具显示。
导航栏及工具栏:提供简洁的项目目录导航及常用工具,便于快捷启动

那我们如何来开发最基础的Android应用呢?首先我们来了解一下Android一些基本的概念。首先是四大组件Activity,Broadcast Receiver,Service,Content Provider.
Activity — 表示具体用户界面的单一屏幕,即与用户直接交互的入口,承载着布局显示。
Broadcast Receiver — 用于响应系统范围广播通知的组件,其中大部分广播都是系统发起的,我们可以拿到这些系统事件来执行某项工作。
Service — 一种在后台运行的组件,通常用于执行耗时操作,其他组件可以启动服务或绑定并与其交互。
Content Provider — 共享数据以供外部读取和写入。

除了这四大组件,我们还会经常接触到AndroidManifest.xml和资源文件: 
AndroidManifest.xml — 系统的清单文件,用于声明所有的组件,权限等。在系统启动组件前,必须先确认其是否在清单文件中已存在。
资源文件 — Layout、Strings、Style、Colors、dimens等,均以xml形式存在,drawable包括位图文件,所有的资源文件均位于res目录下。

接下来我们来新建一个全新的Android项目,苦于没有素材,特意找UI小姐姐要了一个简单的UI需求,我们来看看,如何将UI需求转化为code并运行起来。在这里也要强烈推荐sketch这款神器,高效、专业,对于Android开发小哥哥来说,所有界面一目了然,对于开发来说,以下是布局时着重关注的两点:
对于图片类资源:宽度,高度、左上角坐标、透明度、模糊程度、边角是否特殊样式等。
对于文字类资源:左上角坐标,字号、字体、颜色、是否相对居中等。

这么多信息是驳杂的,但也是有序的,以前开发小哥哥在不知道有sketch这类神器时,用的是excel统计以上这些数据,可以想象一下,大几十的页面,每个页面有十几二十个控件,每个控件又有这么多属性,眼睛都花了,再想想现在,自从有了sketch,所有的信息触手可及,撸起代码来都有劲了呢…(不知道这波sketch的广告能不能给开发小哥哥加一个鸡腿?)

我们拿到UI小姐姐的需求如下图:

对于开发小哥哥来说,我们需要将图片进行分解,分解到什么程度呢,请看下图:

可以看到我们将整张图片分成了四部分:1为工具栏 ; 2为背景;3、4均为list item。而针对List item,我们又将其分成以下两部分:

每部分也包含有更细节的地方。我们用下面这个图来描述我们要把得到的UI图分解到啥地步。

准备工作完成。接下来我们首先来新建一个Android Studio项目(以下多图,流量党慎入):

1.点击Start a new Android Studio project.

2.填好项目名称及公司域名,保证app的名称唯一性,同时选择项目存放路径,Include C++ support及Include Kotlin support不勾选,我们暂时用不到

3.选择设备类型及SDK版本,这里我们选择手机或者平板(Android 7.0)

4.选择”Add No Activity“,点击”finish”,当然可以在当前页面新建Activity,但我们先把项目创建好,后面再新增Activity。

5.项目新建成功。

6.我们来将UI小姐姐提供的切图导入,并且将颜色、字符串等转化为项目的资源文件如下。
colors.xml:

strings.xml:

图片:

7.新建Activity,勾选”Launcher Activity”,让程序运行起来第一个运行该Activity,新建完成后在项目结构窗口中同步新增MainActivity.java和activity_main.xml文件。

8.重头戏来了,编辑Layout文件activity_main.xml,我们根据之前的UI分解图来进行layout的布局,这样我们得出我们的视图的树状结构,如下图:

是不是觉得上面的视图结构很复杂?在此我们来了解一下视图的基本概念。
ViewGroup——又称layout,是可以存储并控制其子视图布局的一种容器。
View——又称Widget,是一些UI组件,类似于按钮,文本框等。

也就是说ViewGroup可以包含各种View,同时ViewGroup也可以包含ViewGroup,形成嵌套关系。LinearLayout与RelativeLayout就是两种不同的ViewGroup,而TextView,ImageView则是View。

LinearLayout是线性布局容器,其中的子元素均以横向或纵向排布。
RelativeLayout是相对布局容器,其中的子元素可根据父元素的顶点任意排布。
TextView是文本View,用于显示简要文本。
ImageView是图片View,用于显示图片。

这么看下来我们的视图的树状结构也就很简单了。
我们将复杂的UI图分解为一个树状结构,这个树状结构对应我们android项目中的layout文件。

9.我们根据sketch中得到的坐标信息来填充ViewGroup及View的相关属性(坐标,宽高等)最终形成了我们以下的代码。(我终于可耻的贴代码了..)

10.编译无误,运行。

大功告成!当然,这只是最简单的界面布局开发,太多的布局细节没有赘述。一个完整的app,不仅仅只有展示,更重要的是要与用户互动,后续开发小哥哥会持续更新Android相关的技术点,敬请期待吧。

自开号以来,我们得到了越来越多同事的支持。大家百忙之中抽出时间为我们提供文章。本身作为球迷的他们放弃观看比赛,深夜赶稿。今后我们会有更多的原创文章奉献给大家,其中还会有连载的形式,敬请期待!

编辑|太史简

长按识别下方的二维码关注我们

android开发入门与实战相关文章