UI开发
一、常用控件
控件的基本属性有android:id、android:layout_width、android:layout_height、android:text、 android:gravity、android:visibility等。
android:layout_width和android:layout_height属性用于设置控件的宽和高,可选值基本有match_parant和wrap_content,分别表示由父布局决定和由内容决定。
android:graviry用于指定文本对齐方式,可选值有:top、bottom、left、right、center、center_vertical、center_horizontal等,可用“|”符号来同时指定多个值。
android:visibility属性用于设置控件的可见性。可选值有visible(可见,默认值)、invisible(不可见,占据空间)、gone(不可见,不占空间)。
1.Textview
最简单的android控件,用于显示文本。
基本属性还有android:textSize、android:textColor等,用于设置字体大小(以sp作为单位)和颜色
注:TextView类中的setText()方法的参数必须是String类型,否则程序无法正常运行。
2.Button
用于和用户交互的重要控件。
特点:系统会自动将Button中的所有英文字母显示为大写形式,若不想要这种效果,可通过将android:textAllCaps属性值设置为false即可
Button作为可与用户交互的重要控件,可以响应用户的一系列操作事件,要实现这一功能,需要在活动类重写的onCreate()方法中为事件注册监听器
两种方式:
Button button = (Button) findViewById(R.id.button); button.setOnClickListener(new View.OnClickListener(){ @Override public void onClick(View v){ //实现逻辑功能 } } );
当Button较多时,可以使用实现接口的方式来进行注册:
@Override protected void onCreate(Bundle savedInstanceState){ ...... button.setOnClickListener(this); } @Override public void onClick(View v){ switch (v.getId()){ case R.id.button: //添加逻辑功能 break; ...... default: break; } }
3.EditText
用于和用户进行交互的另一个重要控件,可以在控件里输入和编辑内容,并对内容进行过处理。基本属性还有android:hint(指定输入框中的提示性文本)、android:maxLines(指定输入的最大行数,超出时文本向上滚动)等。
EditText类获取输入框输入内容的方法是getText(),通常还需要调用toString()方法将其转换文字符串
4.ImageView
用于在界面上展示图片。图片资源通常放在"drawable"开头的目录下,一般放在drawable-xhdpi(没有就新建)目录下。
导入图片的属性为android:src,由于图片的宽和高都是非未知的,所以在设定是都是设为wrap—content。
此外,也可以通过事件动态地更改图片,只需要调用ImageView类的setImageResource()方法即可。
5.ProgressBar
用于显示一个进度条。
可根据需要使用ProgressBar类的setVisibility()方法来控制进度条的可见性,
该方法可传入View.VISIBLE、View.INVISIBLE、View.GONE(不仅表示不可见还表示不占用屏幕)这3个值;也可通过它的getVisibility()方法获取该进度条当前的可见性。
此外,还可以通过style属性更改进度条样式,如水平进度条。若是水平进度条,则可以通过android:max属性给进度条设置最大进度值,然后配合使用getProgress()方法和setProgress()方法动态地修改进度条的进度值。
int progress = progressBar.getProgress(); progress += 10; //每一次点击按钮都会让进度条快进10个长度 progressBar.setProgress(progress);
6.AlertDialog
弹出一个对话框,置于所有界面元素之上,屏蔽其他控件的交互能力,一般用于提示一些非常重要的内容。此控件无需在布局文件中进行设置,只需在活动类中设置。
AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this); //创建Dialog实例 dialog.setTitle("this is a dialog"); //设置标题 dialog.setMessage("something important"); //设置内容 dialog.setCancelable(false);//是否可用“返回”键关闭对话框 dialog.setPositiveButton("ok",new DialogInterface.OnClickListener(){//设置确定按钮点击事件 @Override public void onClick(DialogInterface dialog,int which){ } }); dialog.setNegativeButton("cancel",new DialogInterface.OnClickListener(){//设置取消按钮点击事件 @Override public void onClick(DialogInterface dialog,int which){ } }); dialog.show();
7.ProgressDiglog
与.AlertDialog有些类似,不同的是,ProgressDialog会在对话框中显示一个进度条。
代码也是类似,只是不用构造点击事件,记得在setcancelable(true),如果传入了true,表示该控件无法通过back键取消掉的,数据加载完后必须调用dissmiss()方法关闭对话框,否则会一直存在。
二、4种基本布局
布局是一种用于放置很多控件的容器,按一定规律来放置控件,当然布局里还可以放置布局,以多层布局实现更加复杂丰富的界面。
1.线性布局(LinearLayout)
会将它包含的所有控件在线性方向上依次排列
可以通过android:orientation="vertical|horizontal";控制LinearLayout的排列方向是垂直方向还是水平方向。
注意点1:排列方法如果是水平方向的话,内部的控件就绝对不能将宽度指定为match—parent,因为这样的话,单独一个控件就会将整个水平方向占满,其他控件就没有可放置的空间的了。同样的道理,如果排列方式的是vertical,内部的控件就不能将高度指定为match—parent。
注意点2: android:layout_gravity 属性,用于指定控件在布局中的对齐的方法。可选值与android :gravity(指定文本的对齐方法)的差不多。 当排列方向是horizontal时只有垂直方向上的对齐方式才会生效,因为此时水平方向上的长度都是不固定,每添加一个控件,水平方向上的长度都会发生改变,因而无法指定该方向上的对齐方式,同样的vertical也是如此,只有水平方法上的对齐方式能生效。
另一重要属性android:layout_weight;通过比例的方式控制控件的大小。(该属性用在LinearLayout(父控件)的子控件(如EditText)中,对手机的适配性起到很大作用)
<EditText android:id="@+id/input_message" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:hint="Type something" /> <Button android:id="@+id/send" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android"text="Send" />
这里将EditText和Button的宽度指定为0dp(dp是用于指定控件大小,间距等属性的单位),是比较规范的一种写法,因为使用了android:layout_weight属性,此时控件打宽度就不由width来决定
将weight指定为1,表示将在水平方法上平分宽度。
原理:系统先将该布局下所有控件指定的layout_weight值相加,得到一个总之,然后每个控件的大小所占的比例就是用weight去除以刚才算出来的总值。、
可以通过指定部分控件的weight值来实现更好的效果。
<EditText android:id="@+id/input_message" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:hint="Type something" /> <Button android:id="@+id/send" android:layout_width="wrap_content" android:layout_height="wrap_content" android"text="Send" />
只改变了Button控件,是其宽度有wrap_content来计算,而EditText则会沾满屏幕所有的剩余空间,这样编写的界面,不仅在各种屏幕的适配方面会非常好,而且看起来更加的舒服。
2.相对布局(RelativeLayout)
排列规则相比上一个比较随意,通过相对定位的方式让控件出现在布局的任何位置。
相对于父布局进行定位。
android:layout_alignParentTop="true" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_alignParentRight="true" android:layout_centerInParent="true" 控件还可以相对于控件进行定位
-
android:layout_above="@id/view3"
-
android:layout_below="@id/view3"
-
android:layout_toRightOf="@id/view3"
-
android:layout_toLeftOf="@id/view3"
相对于控件边缘进行定位
android:layout_alignRight="@id/view3" android:layout_alignLeft="@id/view3" android:layout_alignTop="@id/view3" android:layout_alignBottom="@id/view3" 其他:
android:layout_centerVertical="true" android:layout_centerHorizontal="true" 注意1:引用的控件一定要先定义。 注意2:可以在一个控件中使用上面的一个或多个。例如,相对于父布局的“左上”布局,就需要填写两个属性android:layout_alignParentTop="true";android:layout_alignParentLeft="true"。
3.帧布局(FrameLayout)
布局更加简单,应用场景少,所有控件都会默认摆放在布局的左上角
4.百分比布局
在之前只有LinearLayout支持使用layout_weight来实现按比例指定控件大小的功能
允许直接指定控件在布局中所占百分比,无需使用wrap_content,match_parent等方式来指定控件的大小。百分比只为FrameLayout和RelativeLayout进行了功能拓展。提供了PercentFrameLayout和PercentRelativeLayout这两个全新的布局
百分比布局属于新增的布局,需要添加内容才能在所有Android版本上使用,该布局定义在support库当中,我们只需要在项目的build.gradle添加百分比布局库的依赖,就能保证其兼容性。
在dependencies闭包中添加complie 'com.android.support:percent:24.2.1'
<Buttton android:id="@+id/button2" andorid:text="Button 2" android:layout_gravity="right|top" app:layout_widthPercent="50%" app:layout_heightPercent="50%" /> </android.support.percent.PercentFrameLayout>
由于百分比布局不是内置在系统SDK当中,所以需要把完整的包路径写出来,然后还必须定义一个app的命名控件,这样才可以使用百分比布局的自定义属性,当然该布局还是会继承FrameLayout的特性。为了不使这些按钮重叠,还是借助了layout_gravity分别放置位置。当然另一种PercentRelativeLayout的用法也是非常类似的,同样继承了所有的属性
控件和布局的继承结构
view | ||
---|---|---|
TextView | ImageView | ViewGruop |
EditText Button | LinearLayout RelativeLayout | |
所用的所有控件都是直接或间接继承自View的,所用的布局都是直接或间接继承自ViewGroup的。
view是Android中最基本的一种UI组件,可以在屏幕上绘制一块矩形区域,因此,我们使用的各种控件都是在view的基础上又添加了各自特有的功能。viewGroup是一种特殊的View,他可以包含很多子View和子ViewGruop,是用于放置控件和布局的容器。
引入布局
创建一个标题栏布局。
android:background用于为布局或控件指定一个背景,可以用颜色或者是图片来进行填充
如android:background=“@drawable/edit_bg” 引用了edit_bg.png这一图片
android:layout_margin可以指定控件在上下左右方向上偏移的距离
android:layout_marginLeft或者android:layout_marginTop等属性来单独指定控件在某个方向上偏移的距离。
使用该标题栏
修改activity_main.xml中代码 <include layout ="@layuout/title" />
添加上面一行代码就可以将标题栏布局引入进来
最后别忘了在MainActivity中系统自带的标题栏隐藏掉。
ActionBar actionbar =getSupportActionBar(); if(actionbar != null){ actionbar.hide(); }
这里调用了getSupportActionBar()方法来获得ActionBar的实例,然后调用hide方法就可以隐藏标题栏。
使用这种方法,不管有多少布局需要添加标题栏,只需要一行include语句就可以了。
创建自定义控件
上述引入布局的技巧解决了编写布局代码问题,但是如果布局中有一些控件要求你能够响应时间,还是需要在每个活动中为这些控件单独编写一次事件注册的代码,而比如说标题栏中的返回按钮,功能都是相同的即为销毁当前活动,此时在每一个活动中都要重新注册一遍点击事件显然麻烦,这时最好使用自定义控件的方式来解决。
新建TitleLayout继承自LinearLayout,成为自定义的标题栏控件。
public class TitleLayout extends LinearLayout { public TitleLayout (Context context , AttributeSet attrs){ super (context , attrs); LayoutInflater.from(context).inflate(R.layout.title,this); } }
首先重写了LinearLayout中带有两个参数的构造函数,在布局中引入TitleLayout控件就会调用这个构造函数,在构造函数中需要对标题栏布局进行动态加载。这需要通过LayoutInflater的from()方法构建一个LayoutInflater对象,然后调用inflate()方法就可以动态加载一个布局文件,inflate()方法接受两个参数,第一个是要加载的布局文件的id,另一是给加载好的布局再添加一个父布局(这里指定TitleLayout,所有传入了this)