【搬运】7.构建一个简单的用户界面--Android初级教程
aide吧
全部回复
仅看楼主
level 8
这节课我们来讲讲如何构建一个简单的用户界面。想必使用安卓的大家知道的,很多软件的界面都是很漂亮的,一个用户界面是如何构建出来的呢?大家知道,我们这里讲的用户界面布局实际上就是Activity的布局,Activity的布局是res/layout文件夹下与之相对应的一个.xml后缀文件所决定的,这里我们用上节讲到的例子继续,没有源码的同学可以去第6课的帖子去下载。
首先我们先回忆一下上课节源码的运行结果和newone.xml中的代码,下面两图:
2013年06月17日 12点06分 1
level 8
我们运行起来的起来的界面中只有“好个飞飞”四个字,为什么会有这四个字呢?我们先来看看newone.xml中的源码,源码的第一行是声明xml文件以及字符编码的,一般xml文件第一行要有这个。第二行我们看到LinearLayout是什么意思呢?它代表一种布局方式,下面我们来罗列一下常用布局方式(布局管理器):
LinearLayout:线性布局
RelativeLayout:相对布局
FrameLayout:框架布局
TableLayout:表格布局
TabLayout:标签布局
ListLayout:列表布局
AbsoluteLayout:绝对布局
2013年06月17日 12点06分 2
跟html差不多,所说的布局,其实理解为界面排版也一样。.xml就好比一个.html页面文件
2013年06月23日 22点06分
第一行的意思倒是和html很像。如果不用utf-8就会出现乱码。或者其他国家语言。LL呢。其实就和html里面的排版开头要有的body的含义差不多。呵呵。楼主别介意我和html相比。没办法,如果我不按这种方法比可能就不会明白它的意思了。
2013年06月23日 22点06分
回复 死仔仔骚冲 :可以没有body的。如果有frame集合不允许出现body
2013年07月21日 09点07分
@死仔仔骚冲 楼主把笔一丢,来来来你来教
2016年11月13日 16点11分
level 8
很多吧?我们常看到的软件个界面就由这些布局搭配嵌套而成的。那么我现在就来理解下newone.xml中使用到的LinearLayout线性布局。线性布局顾名思义就是排成一线,也就是说,被LinearLayout标签包裹的控件会排成一线,线有两个形式:横和竖。准确的说就是:垂直排列(vertical)和水平排列(horizontal)两种形式。从代码中的android:orientation="vertical"(注:android:xxx=yyy一般指布局方式或者控件的xxx属性,属性的值为yyy),可以看出,这个LinearLayout标签里的控件将会以垂直排列(vertical),好,下面我们来做个实验,看下图代码:
由于原本只有一个TextView(文本控件),垂直排列线性布局效果显示不出来,这里我将TextView的代码多复制了两段,现在我们的界面就有3个TextView控件了,下面我们看看运行效果:
2013年06月17日 12点06分 3
level 8
如上图,我们看到,3个TextView(文本控件)已经垂直排列垂直排列在界面上了。这只是线性布局垂直排列的效果,那么水平排列是什么效果呢?我们把LinearLayout标签下的android:orientation="vertical"改为android:orientation="horizontal"在运行看看:
嗯?怎么又只有一个控件了呢?按道理来讲,我们设置了horizontal水平排列运行起来应该是3个“好个飞飞”并排在一行才对啊,为什么现在只有一个了呢?我们来先来看看TextView控件下的属性设置:android:layout_width="fill_parent",这句话什么意思呢?从字面的英语上理解,width是宽度,fill是充满填满,,然后我们就可以大概的理解:这个TextView控件width宽度属性是fill填满,也就是这一个TextView控件的宽度将填满屏幕宽度。问题知道了,其中一个TextView控件的宽度就填满了屏幕宽度,哪还容得下其他两个TextView控件啊~怎么办呢?改改这3个控件的属性,把TextView控件标签下的android:layout_width="fill_parent"改为android:layout_width="wrap_content"(wrap_content值的意思是,文字有多宽,控件就多宽)。代码如下图:
2013年06月17日 12点06分 4
我想问下,如果width使用成百分比行不行??比如layout_width="100%"按正常情况来说,应该会以屏幕的大小自动适应没宽度100的。也就是屏幕分辨率宽为400那么,这个软件里面的这个地方就会以400的宽度显示。。
2013年06月23日 23点06分
level 8
Save保存运行一下,呵呵,我们期待的效果就出现了~其实,一个.xml布局文件可以有多个布局相互嵌套(比如LinearLayout线性布局),我们可以试试在垂直排列的LinearLayout标签里嵌入两个水平排列的LinearLayout布局,每个LinearLayout布局里有3个控件,这样写的目的是让两个水平排列的LinearLayout布局一个上一个下垂直排列,代码如下:
要注意的是,嵌套在里面的两个水平排列的LinearLayout布局的属性android:layout_height="fill_parent"要改为android:layout_height="wrap_content"(height为高度的意思),不然其中一个会水平布局的高度会占满整个屏幕的高度,到时你就只能看到一个嵌套在里面的水平排列的内容。Save保存运行一下,如下图:
可以看到,两个水平排列的LinearLayout布局的内容垂直排列在屏幕上。
.
一个简单布局基本就是这样,当然我们这里只放了TextView控件,常用的控件或组件有TextView(文本显示)、EditText(文本输入框)、Button(按钮).....等等。大家可以把代码中的TextView改成EditText或者Button试试看效果~
布局的东西以后不会专门讲,关于更多布局方面的知识,请认真阅读Android开发技巧集合.pdf的35~151页。。。。实在看不懂的地方可以略过,这一百多页内容看完,你一定会有不少收获的。
2013年06月17日 12点06分 5
我是在百度文库里找到了
2013年09月11日 02点09分
level 8
课后练习作业:
在一个Activity里进行布局,里面有TextView(文本显示)、EditText(文本输入框)、Button(按钮),效果如下图(不同版本的安卓系统,控件的样式会有点不同,可以不管):
2013年06月17日 12点06分 6
怎么让按钮能重置上面的输入框?
2013年06月23日 07点06分
@慕焚丶😂 设置内容为一个空字符串就可以了,直接写一对双引号
2013年06月23日 07点06分
回复 爱上疯人院姑娘 :不会,,,,我能做出按钮,但是不知道怎么让按钮跟其他控件产生关系。。。。求教
2013年06月23日 07点06分
@慕焚丶😂 把教程看下去。
2013年06月23日 08点06分
level 11
学着做的, 就是在文本输入框 输入文字时,边框跟着边长
2013年06月17日 17点06分 7
图不见了
2013年06月17日 17点06分
因为edittext设置的宽度为包含内容。
2013年06月18日 00点06分
level 11
补图
2013年06月17日 17点06分 8
level 9
为什么我按教程来的,结果运行时提示解析包时出问题呢回复1楼:
2013年06月17日 18点06分 9
请尽量使用aide原版。
2013年06月18日 00点06分
回复 爱上疯人院姑娘 :有没有目前最新版v2.2的汉化版呢
2013年06月18日 00点06分
level 11
在补图
2013年06月17日 23点06分 10
你怎么美化的
2015年08月11日 12点08分
level 8
顶啊啊啊啊啊
2013年06月21日 14点06分 11
level 7
几天没进,高手都来了,精彩
2013年06月22日 15点06分 12
level 5
看看我这个
2013年06月22日 19点06分 13
level 5

2013年06月22日 19点06分 14
level 5
哈哈,大家都很聪明啊'。
2013年06月23日 23点06分 15
level 9
如何把输入框排列到下一行呢是调整?输入框可以固定长度吗
2013年06月25日 17点06分 16
后面讲了距离单位了解。
2013年06月25日 22点06分
回复 爱上疯人院姑娘 :谢谢,我会了
2013年06月25日 23点06分
level 7
我是不是整得有点晚?。。。。。。
我的下面那两个按钮点击没反应,作业没有些明白需不需要有反应
2013年07月08日 14点07分 17
level 8
新手学习中
2013年07月20日 16点07分 18
level 5
楼主,能否问一下我们使用AIDE编译生成的apk文件在哪?
2013年07月25日 12点07分 19
bin文件夹内
2013年07月26日 03点07分
level 5
顶起!爱死你了!
2013年09月22日 13点09分 22
1 2 3 尾页