前端之Android入门(2):程序目录及UI简介

ct

在这次的文章中,将会介绍Android程序的目录结构以及UI知识,为下一篇实际例子的编写打下基础。由于文章篇幅有限,所以本着先浅后深的思路,从简单介绍入手,然后在往后实际例子编写中再深入扩展学习各个知识点,希望使学习曲线更加平滑。

正如和我们编写网页项目时一样,通常会建立html、css、js等目录区分不同内容,Android程序也有其固定的目录结构。和Html与Css的关系一样,Android也是通过一系列属性控制视图元素的视觉呈现。对于这个概念,各位前端小伙伴应该非常容易理解。那它们之间有什么区别呢?事不宜迟,让我们赶快进入这次学习,Let's Go!

一,Android程序的目录结构

android_2_directory

打开我们上次创建的HelloWorld项目,会看到一个目录结构,这就是Android的程序目录,这些目录的大致作用如下:

  • src:源码的组织管理目录。
  • gen:自动生成的目录,会生成一些重要的文件,如R.java,该目录一般不需要我们编写。
  • assets:该目录文件不会被编译成二进制编码,多用于放音视频,文本等原始格式文件。
  • bin:用于存放编译后的Java文件及apk文件。
  • libs:存放Android的源码包或需要引入的源码包。
  • res:程序资源的所在目录,包括图片,数值等各类资源。
  • AndroidManifest.xml:程序配置文件,它向系统描述了程序的信息。

这里先介绍我们常用到的目录:

1)src目录

android_2_src

打开项目的src目录,会立即明白,原来 com.tencent.helloworld 的"."号相当于路径分隔符,Java就是通过此方式管理存放不同文件,也就是Java的包机制,现在只需知道此概念即可。

 2)res目录

android_2_res

该目录用于存放Android程序的各类资源,非常重要,用于管理资源和Android UI的适配,在后面的例子中将会逐步使用到。其中主要包含下列目录:

 drawable-xxx

用于存放位图(Bitmap files)(.png,.9.png,.jpg,.gif)或者状态列表(State lists),动画(Animation drawables),图形(Shapes)等绘制性资源的xml文件。相当于网页中的图片资源。其中-xxx用于适配不同像素密度的屏幕。这里先不作展开。

layout

该目录的xml文件用于描述一个Android UI界面(Activity)或一个系统桌面组件(AppWidget)的界面结构。相当于网页的Html结构。

menu

该目录下的main.xml文件用于定义Android底部的弹出菜单结构。

values-xxx

用于存放定义各种:字符值,颜色值,数值,样式等的xml文件,例如dimens.xml用于定义各尺寸值,strings.xml用于定义文字,colors.xml用于定义各颜色值,其中最为最重要的styles.xml用于定义View元素的视觉样式(相当与网页的Css)。-xxx作用也是用于Android的适配,这里也先不作展开。

AndroidManifest.xml文件

每个Android应用程序都有一个AndroidManifest.xml文件在根目录,该文件用于向系统提供一些程序运行前需要提供的信息。该文件主要包含以下信息:

  • 命名该应用的Java包名,包名将作为应用的唯一标识。
  • 描述应用的构成,包括Activity,Services等。
  • 声明应用所必须具备的权限,用以访问受保护部分的API。
  • 声明应用运行时需要的环境配置信息。
  • 声明应用所需的系统Android API的最低版本级别。
  • 列举应用所需要链接的库。

二,Android的UI简介

从Html角度出发,一个网页界面,通常由Div元素完成结构布局,Img,Input,Button等元素完成界面构建。Android的界面构建思想也如此,在Android的UI世界中,所有UI元素均由View类继承而来,然后衍生出用于布局的元素如:FrameLayout,LinearLayout,RelativeLayout,TableLayout等,用于界面呈现的组件元素如:TextView,EditText,ImageView,VideoView等。只是View元素及其子元素有严格的继承体系,这点和Html不同。下图展示了Android中的View元素体系:

android_2_view

和Css控制Html的视觉呈现一样,Android也是通过各属性控制View元素的视觉呈现,我们先来看看熟悉的Html和Css关系:

android_2_html+css

聪明的小伙伴一定会问,Css中的属性只有平级关系,为什么会区分开呢?没错,上图简单模拟了Android中“Css”的层级关系。在Android中,各属性是有严格区分和有其自身的继承体系。

所以这里有一个很重要的概念:在Android中,是由两类属性控制View类的视觉呈现。一类是Viwe类自身的属性,如背景、透明度、内空白等;一类是布局属性、如长度、宽度,边距、位置等。下图展示了它们之间的关系:

android_2_attribute

在这里我们需要明白3个概念:

1,View类的自身属性,是可以继承的,例如Android中,View类有id、alpha、padding等属性,而TextView继承自View,所以TextView除了可以设置自身的属性textColor外,还可以设置id,alpha等。所以我们可以这样设置一个TextView的呈现:

android_2_tv1

2,处在什么布局元素内,该布局元素内的视图就可以使用什么布局属性。例如TextView若处在LinearLayout内,则可以使用LinearLayout.LayoutParams定义的布局属性,如:

android_2_tv2

3,布局属性也是可以继承使用的,例如LinearLayout.LayoutParams继承自ViewGroup.MarginLayoutParamsViewGroup.MarginLayoutParams则继承自ViewGroup.LayoutParams,最终可以像如下设置:

android_2_tv3

所以,通常在一个的界面中,布局属性的使用就像下图所示一样:

android_2_layout

结束:在这次的文章中,简要介绍了一下程序目录。也对Android UI的概念作了总体介绍,理清UI属性的关系,对我们后面的编程,特别是用程序代码生成视图和设置属性都尤为重要。在下一篇文章中,我们将实际完成一个界面的制作,并借例子深入到Android UI的知识点中。希望这次的文章能给小伙伴们在Android学习之路上带来帮助。

 

Tags: , , ,

ct
ct
图标字体化浅谈
上一遍
[多维星际、轻录时空]QQ空间手机版4.2设计总结
下一遍
10,701
QQ空间 新浪微博 Facebook Google+

相关推荐

留下你的想法吧

  1. 蔚蓝Bleu says:

    看见大神用苹果系统弄安卓,其实我想请问下是不是在苹果系统上编程比微软效率更高呢?更容易操作呢?或者能否告知利弊

    • ct says:

      个人觉得,就单个IDE来说,MAC上和WIN上的效率其实是没差别的。可能的优势点:
      1,MAC在软件设计规范上给了很多建议和约束,所以很多软件用起来让人有统一的操作感,所以效率可能好点。
      2,MAC笔记本的触控板比WIN笔记本的好用
      3,个人觉得最重要的,MAC的命令行终端工具,比起WIN上被阉割了的cmd,实在好太多

      感谢你的支持

  2. 把android和web前端类比这样子讲真的容易理解多啦!最近正在学android,看视频真的是各种抽象,希望快点出更新~

    • ct says:

      你好,迟了回复,这个教程系列我会尽快更新。后面的课程中,都会有让大家练习的元素,让完成一个练习点,就刚好更新下一篇。
      你的评论和回复是我最大的动力 :)

  3. TME8 says:

    很好的教程,比起网上其他教程来的更加实际和易懂。恭祝新年快乐 万事如意!

  4. 话说图片上是什么编辑器啊 好像很高端的样子

  5. 讲得很好,很细,深入浅出,怒赞!!!坐等更新!!感谢分享

  6. 两篇文章都写得非常棒,很期待下一篇。不知ct能否再稍微普及一下制作教程的过程,如树状图、体系图是用什么工具制作的。

  7. 陈琳 says:

    可以把完成后的代码打包发一下吗?我写了就是运行不起来,想对照一下你的代码。
    PS. 文章很赞~期待第三篇。

  8. Jay says:

    建议这一系列的文章最后加入简单的目录跳转

  9. luke says:

    我是个不靠谱的设计师,最近也在学安卓,期待小编的更新,教程十分赞赞 强赞

  10. WenSion says:

    Tencent,真是一个人才辈出的地方,居然可以这样理解,顿时领悟了,好文章,nice!