1、第2章 Android用户界面-1,本章学习目标,了解界面编程和视图组件 掌握各种基本组件的使用 掌握各种界面布局的特点和使用方法 掌握各种高级组件的使用,2.1 用户界面基础,设计手机用户界面应解决的问题 需要界面设计与程序逻辑完全分离,这样不仅有利于他们的并行开发,而且在后期修改界面时,也不用再次修改程序的逻辑代码 根据不同型号手机的屏幕解析度、尺寸和纵横比各不相同,自动调整界面上部分控件的位置和尺寸,避免因为屏幕信息的变化而出现显示错误 能够合理利用较小的屏幕显示空间,构造出符合人机交互规律的用户界面,避免出现凌乱、拥挤的用户界面 Android已经解决了前两个问题,使用XML文件描述用
2、户界面;资源资源文件独立保存在资源文件夹中;对界用户面描述非常灵活,允许不明确定义界面元素的位置和尺寸,仅声明界面元素的相对位置和粗略尺寸,2.1 用户界面基础,Android用户界面框架 用户界面(User Interface,UI)是系统和用户之间进行信息交换的媒介,实现信息的内部形式与人类可以接受形式之间的转换。 Android应用的绝大部分界面组件都放在android.widget包及其子包android.view中。 Android应用的所有组件都继承了View类。View来有一个重要的子类ViewGroup。ViewGroup通常作为其他组件的容器使用。Android的所有UI组件
3、都是建立在View、ViewGroup基础之上的。对于一个Android应用的图形用户界面来说,ViewGroup作为容器来盛装其他组件,而ViewGroup里除了可以包含普通View组件之外,还可以再次包含ViewGroup组件。,2.2 程序控制界面,程序控制界面 Android推荐使用xml布局文件控制UI界面,但Android允许开发者抛弃xml布局文件,完全在Java代码中控制UI界面。,LinearLayout layout=new LinearLayout(this);super.setContentView(layout);layout.setOrientation(Linea
4、rLayout.VERTICAL);final TextView show=new TextView(this);Button btn=new Button(this);btn.setText(“ok“);btn.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,ViewGroup.LayoutParams.WRAP_CONTENT );layout.addView(show); layout.addView(btn);btn.setOnClickListener(new OnClick
5、Listener()public void onClick(View v) show.setText(“Hello,Android,“+new java.util.Date(); );,2.3 基本界面控件,Android系统的界面控件分为定制控件和系统控件 定制控件是用户独立开发的控件,或通过继承并修改系统控件后所产生的新控件。能够为用户提供特殊的功能或与众不同的显示需求方式 系统控件是Android系统提供给用户已经封装的界面控件。提供在应用程序开发过程中常见功能控件。系统控件更有利于帮助用户进行快速开发,同时能够使Android系统中应用程序的界面保持一致性 常见的系统控件包括TextV
6、iew、EditText、Button、ImageButton、Checkbox、RadioButton、Spinner、ListView和TabHost,2.3.1 TextView基本使用,在程序中创建TextView对象 在xml布局文件中使用,/在程序中创建TextView对象 import android.app.Activity; import android.os.Bundle; import android.widget.TextView;public class MainActivity extends Activity public void onCreate(Bundle
7、 savedInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main);TextView tv=new TextView(this);tv.setText(“你好,android!“);setContentView(tv); ,在程序中创建TextView对象,2.3.1 TextView基本使用,/使用布局实现(建议使用这种方式:设计和开发分开) import android.app.Activity; import android.os.Bundle; import android.widg
8、et.TextView;public class MainActivity extends Activity /* Called when the activity is first created. */Overridepublic void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main); ,在xml布局文件中使用,2.3.1 TextView基本使用,Android:textSize=“20sp” 设置字体大小推荐使用sp作为单位 设置
9、宽度或高度等属性时使用dp作为单位,(1)改变字体颜色:android:textColor=“#00ff00“,TextView颜色设置,(2) 改变局部字体颜色,public class MainActivity extends Activity /* Called when the activity is first created. */Overridepublic void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main);TextVi
10、ew tv=new TextView(this); TextView tv=(TextView)findViewById(R.id.textview);/改变局部字体颜色tv.setText(Html.fromHtml(“我们学习的android教材是android应用开发详解 ,这边书很不错!“); ,2.3.1 TextView基本使用,(3)改变局部字体颜色,public class MainActivity extends Activity public void onCreate(Bundle savedInstanceState) super.onCreate(savedInsta
11、nceState);setContentView(R.layout.main);TextView tv=(TextView)findViewById(R.id.textview);String str=“我们学习的教材是应用开发详解!“;SpannableStringBuilder style=new SpannableStringBuilder(str);style.setSpan(new ForegroundColorSpan(Color.RED), 0, 5, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);style.setSpan(new Foreground
12、ColorSpan(Color.GREEN), 5, 10, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);style.setSpan(new ForegroundColorSpan(Color.BLUE), 10, 15, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);tv.setText(style);,TextView颜色设置,2.3.1 TextView基本使用,Android:autolink设置是否当文本url链接/email/电话号码/map时,文本显示为可点击的链接。可选值 (none/web/email/phone/map/
13、all),public class MainActivity extends Activity public void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main);,TextView-设置超链接,2.3.1 TextView基本使用,public class MainActivity extends Activity /* Called when the activity is first created. */Overridepubli
14、c void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main);,TextView-设置超链接,2.3.1 TextView基本使用,public class MainActivity extends Activity /* Called when the activity is first created. */Overridepublic void onCreate(Bundle savedInstanceState) super.onCr
15、eate(savedInstanceState);setContentView(R.layout.main);,TextView-设置超链接,2.3.1 TextView基本使用,android:ellipsize设置当文字过长时,该空间该如何显示。有如下值可以设置:(1)”start”:省略号显示在开头(2)”end”:省略号显示在结尾(3)”middle”:省略号显示在中间(4)”marquee”:以跑马灯方式显示(动画横向移动) android:marqueeRepeatLimit在ellipsize指定marquee的情况下,设置重复滚动的次数,当设置为marquee_forever时
16、表示无限次。 Android:focusableInTouchMode:是否在触摸模式下获得焦点。 Android:focusable控件是否能够获取焦点,TextView-跑马灯效果,2.3.1 TextView基本使用,TextView-跑马灯效果,2.3.1 TextView基本使用,2.3.2 EditText基本使用,TextView和EditText TextView是一种用于显示字符串的控件,直接继承View,它还是EditText、Button两个组件的父类。TextView其实就是一个文本编辑器,只是android关闭了它的文字编辑功能。 如果想要定义一个可以编辑内容的文本框
17、,则可以使用它的子类:EditText。 EditText则是用来输入和编辑字符串的控件 EditText是一个具有编辑功能的TextView, -默认聚焦,-移除EditText上的焦点,在xml布局文件中使用,2.3.2 EditText基本使用,限制EditText中输入字符数量:android:maxLength=“11”电话号码限制11位,EditText中单行/多行输入:android:singleLine=“true/false”,EditText中输入的数据类型:android:inputType=“number”,设置提示信息: ,2.3.2 EditText基本使用,在xm
18、l布局文件中使用,在EditText中显示图片,2.3.2 EditText基本使用,在xml布局文件中使用,设置圆角,把shape.xml文件引入EditText组件中 ,在res/drawable-hdpi下创建shape.xml,内容如下:,2.3.2 EditText基本使用,在xml布局文件中使用,Button和ImageButton Button是一种按钮控件,继承了TextView ImageButton用以实现能够显示图像功能的控件按钮,继承了Button 用户能够在该类控件上点击,按钮会触发一个OnClick事件 两者区别: 为ImageButton按钮设置android:t
19、ext属性没用,2.3.3 Button基本使用,Button和ImageButton,2.3.3 Button基本使用,Button事件处理 View.OnClickListener() View.OnClickListener()是View定义的点击事件的监听器接口,并在接口中仅定义了onClick()函数 当Button从Android界面框架中接收到事件后,首先检查这个事件是否是点击事件,如果是点击事件,同时Button又注册了监听器,则会调用该监听器中的onClick()函数 每个View仅可以注册一个点击事件的监听器,如果使用setOnClickListener()函数注册第二个点
20、击事件的监听器,之前注册的监听器将被自动注销。,2.3.3 Button基本使用,public class MainActivity extends Activity private Button btn1;public void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main);btn1=(Button)findViewById(R.id.Button01);btn1.setOnClickListener(new BtnListener();
21、 class BtnListener implements OnClickListenerpublic void onClick(View v) System.out.println(“click Button“);/这种方法好用,但是不推荐使用,给Button添加事件,2.3.3 Button基本使用,Question:输出字符串为中文时显示乱码? class BtnListener implements OnClickListenerpublic void onClick(View v) System.out.println(“你点击了button按钮!“); ,这个问题不是程序的原因,而
22、是adt版本的原因,adt10.0就没有这个问题了,给Button添加事件,2.3.3 Button基本使用,-使用匿名内部类 public class MainActivity extends Activity private Button btn1;public void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main);btn1=(Button)findViewById(R.id.Button01);btn1.setOnClickList
23、ener(new OnClickListener()public void onClick(View v) Toast.makeText(MainActivity.this,“点击click按钮了“,Toast.LENGTH_LONG).show(); ); ,给Button添加事件,2.3.3 Button基本使用,-有两个按钮的情况 public class MainActivity extends Activity private Button btn1;private Button btn2;public void onCreate(Bundle savedInstanceState)
24、 super.onCreate(savedInstanceState);setContentView(R.layout.main);btn1=(Button)findViewById(R.id.Button01);btn2=(Button)findViewById(R.id.Button02);btn1.setOnClickListener(new OnClickListener() public void onClick(View v) Toast.makeText(MainActivity.this,“点击click1按钮了“,Toast.LENGTH_LONG).show(); );bt
25、n2.setOnClickListener(new OnClickListener() public void onClick(View v) Toast.makeText(MainActivity.this,“点击click2按钮了“,Toast.LENGTH_LONG).show(); );,出现代码重复,给Button添加事件,2.3.3 Button基本使用,public class MainActivity extends Activity private Button btn1; private Button btn2;public void onCreate(Bundle sav
26、edInstanceState) super.onCreate(savedInstanceState);setContentView(R.layout.main);btn1=(Button)findViewById(R.id.Button01); btn2=(Button)findViewById(R.id.Button02);btn1.setOnClickListener(listener); btn2.setOnClickListener(listener);private OnClickListener listener=new OnClickListener()public void
27、onClick(View v) Button btn=(Button)v;switch(btn.getId()case R.id.Button01:Toast.makeText(MainActivity.this,“点击click1按钮了“,Toast.LENGTH_LONG).show();break;case R.id.Button02:/Toast.makeText(MainActivity.this,“点击click2按钮了“,Toast.LENGTH_LONG).show();System.out.println(“click button2“);break; ; ,给Button添
28、加事件,2.3.3 Button基本使用,练习,CheckBox和RadioButton CheckBox和RadioButton都继承了Button,可以直接使用Button支持的各种属性和方法 CheckBox是一个同时可以选择多个选项的控件 RadioButton则是仅可以选择一个选项的控件 RadioGroup是RadioButton的承载体,程序运行时不可见,应用程序中可能包含一个或多个RadioGroup 一个RadioGroup包含多个RadioButton,在每个RadioGroup中,用户仅能够选择其中一个RadioButton,2.3.4 单选按钮和复选按钮,2.3.4 单
29、选按钮,RadioButton和RadioGroup的关系: 1、RadioButton表示单个圆形单选框,而RadioGroup是可以容纳多个RadioButton的容器 2、每个RadioGroup中的RadioButton同时只能有一个被选中 3、不同的RadioGroup中的RadioButton互不相干,即如果组A中有一个选中了,组B中依然可以有一个被选中 4、大部分场合下,一个RadioGroup中至少有2个RadioButton 5、大部分场合下,一个RadioGroup中的RadioButton默认会有一个被选中,并建议您将它放在RadioGroup中的起始位置,2.3.4 单
30、选按钮,group.setOnCheckedChangeListener(new OnCheckedChangeListener()public void onCheckedChanged(RadioGroup group, int checkedId) int radioId=group.getCheckedRadioButtonId();RadioButton rb=(RadioButton) findViewById(radioId);tx.setText(“你选择的性别是:“+rb.getText().toString(); );,2.3.4 复选按钮,RadioButton和Chec
31、kBox的区别: 1、单个RadioButton在选中后,通过点击无法变为未选中单个CheckBox在选中后,通过点击可以变为未选中 2、一组RadioButton,只能同时选中一个一组CheckBox,能同时选中多个 3、RadioButton在大部分UI框架中默认都以圆形表示CheckBox在大部分UI框架中默认都以矩形表示,2.3.4 复选按钮,CheckBox check1=(CheckBox) findViewById(R.id.sing);check1.setOnCheckedChangeListener(listener);CheckBox check2=(CheckBox) f
32、indViewById(R.id.dancing);check2.setOnCheckedChangeListener(listener);CheckBox check3=(CheckBox) findViewById(R.id.basketball);check3.setOnCheckedChangeListener(listener);CompoundButton.OnCheckedChangeListener listener=new CompoundButton.OnCheckedChangeListener()public void onCheckedChanged(Compound
33、Button buttonView,boolean isChecked) CheckBox check=(CheckBox)buttonView;switch(check.getId()case R.id.sing:Toast.makeText(RadioandcheckActivity.this,“选择了音乐“, Toast.LENGTH_LONG).show(); break;case R.id.dancing:Toast.makeText(RadioandcheckActivity.this,“选择了舞蹈“, Toast.LENGTH_LONG).show(); break;case R.id.basketball:Toast.makeText(RadioandcheckActivity.this,“选择了篮球“, Toast.LENGTH_LONG).show(); break; ;,练习,练习,总结,通过本讲学习,掌握TextView、EditText、Button、ImageButton、CheckBox、RadioButton等控件的各种表现效果,