Android Android 实验设计实验设计
实验二:界面设计:控件与布局
08计应计应 08386038 08386038 08386038 胡巍巍胡巍巍
【目的】
Android 编程基础,编程基础,UI UI 设计。【要求】
1、了解Android 编程原理
2、掌握界面控件设计
3、掌握控件的事件处理编程【原理】
1.1.熟悉各种控件的基本功能熟悉各种控件的基本功能
常用控件包括:常用控件包括:TextView TextView TextView,,EditText EditText,,Button Button,,ImageView:
ImageButton ImageButton,,ProgressBar ProgressBar,,Radio button: 2.2.了解各种布局了解各种布局Layout 的应用
多种Layout Layout:: AbsoluteLayout FrameLayout GridView
LinearLayout ListLayout RadioGroup TableLayout TableLayout ………………
【实验过程】
新建一个Project Project,并对其布局文件进行简单修改,并对其布局文件进行简单修改。1.New New 一个一个一个 Android project Android project Android project::
Project Name: Practice ,Application name:name:Project Project ,Build Target 勾选Android 2.2,Package name:Android.Android.Practice ,Create Activity: ,Create Activity:Practice Practice ,Min SDK Version:8. ,Min SDK Version:8. 然后点击然后点击Next →Finish Finish。。
2.Finish 后,后,Eclipse Eclipse Platform 左边Package Explorer 栏中出现了我们刚才新建的project project。。
根据实验要求在layout l 中修改布局文件(我选的是相对布局relative layout layout),增加所需控件。分析实验要求后,对要求添加的控件按照从上到下,从左到右),增加所需控件。分析实验要求后,对要求添加的控件按照从上到下,从左到右的顺序添加。布局xml 实现如下:
<?xml version ="1.0"encoding ="utf-8"?>
<RelativeLayout xmlns:android ="schemas.android/apk/res/android"
android:orientation ="horizontal" //默认控件水平排列android:layout_width ="fill_parent" //相对布局的有效范围android:layout_height ="fill_parent"
android:background ="#ffffff"> //背景颜
<TextView android:id ="@+id/text1" //第一个文本控件
android:layout_width ="wrap_content" //控件宽度和高度有文本决定android:layout_height ="wrap_content"
android:text ="@string/hello"/>//文本内容:hello 所定义的字符串<TextView android:id ="@+id/text2" //第二个文本控件
android:layout_width ="wrap_content" //同上android:layout_height ="wrap_content"
android:layout_below ="@id/text1"//这里实现text2布局在text1的下方android:text ="Hello,It's Huweiwei's Android Project !"//内容android:textStyle ="bold"/>//文本字体样式,这里是粗体<EditText android:id ="@+id/ET1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/text2"
android:hint="Input what you want to say to TA"
android:shadowColor="#ff0000"/>//边框阴影眼测
<TextView android:id="@+id/text3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/ET1"
android:text="Do you miss Miss TA^0^?"
android:textStyle="bold"/>
<RadioGroup android:layout_width="wrap_content"//这里定义了一对单项android:layout_height="wrap_content" //选择,水平排列
android:checkedButton="@+id/RB1"
android:orientation="horizontal"
android:layout_below="@id/text3"
android:id="@+id/menu">
<RadioButton android:id="@+id/RB1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Yes!^0^)/"
android:textStyle="normal"
android:textColor="#000000"/>
<RadioButton android:id="@+id/RB2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#000000"
android:text="No~(T_T)"
android:textStyle="normal"/>
</RadioGroup>
<TextView android:id="@+id/text4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/menu"
android:text="Button,Do you want to marry with ImageView?"
android:textStyle="bold"/>
<ImageView android:id="@+id/IM1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/text4"
android:src="@drawable/icon"/>//图像来源
<Button android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/IM1"//button1安置在IM1的左侧,并且
android:layout_alignTop="@id/IM1"//与IM1并排
android:text="Yes T do !"
android:textColor="#0000ff"/>
<TextView android:id="@+id/text6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/text4"
android:layout_toRightOf="@id/button1"
android:visibility="invisible"
android:layout_marginTop="10dip" //在文本上方预留10dip的空间
android:text="Congratulations!"
android:textStyle="bold"/>
<TextView android:id="@+id/text5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/button1"
android:visibility="invisible" //设置text5默认情况下不可见
android:text="Years later their son was born~,It's
ImageButton~"
android:textStyle="bold"/>
<ImageButton android:layout_below="@+id/text5"
android:id="@+id/ImageButton01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible"
android:src="@drawable/icon">
</ImageButton>
</RelativeLayout>
以上完成了对各个控件的布局,由于是第一次使用xml文件进行布局工作,对控件的各种属性都不了解,因此我并没有采用拖拉的方法编写xml文件,而是一句句的编写,这虽然会花费相当长的时间,但我觉得这是值得的,因为在这个过程中,我知道了控件的每个属性的不同值决定控件怎样的特性,还
有不同的控件之间的关系如何用他们的属性表示,这对以后的工作会有很大帮助的。
3.接下来就是把这些控件显示在屏幕上并且对事件做出响应,这部分工作在Practice.java内完成:
Android.Practice;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.TextView;
////以上都是对所用到的组件的引用以上都是对所用到的组件的引用以上都是对所用到的组件的引用 public class Practice Practice extends extends Activity { // Activity { //新建的新建的新建的Practice Practice Practice类类 Button Button button1button1;//下面会对这个按钮做出响应 TextView Te
xtView tv tv ; ; ////被隐藏的文本对象,对button1做出响应后将会显现 OnClickListener OnClickListener listener listener = = null null ; ; ////,监听button1的动作
public public void onCreate(Bundle savedInstanceState) { super super .onCreate(savedInstanceState);.onCreate(savedInstanceState);////显示l 布局控件 setContentView(R.layout. setContentView(R.layout.main main ); ); ////从main 开始 listener listener = = new new OnClickListener(){ OnClickListener(){ ////监听变量的定义 public void onClick(View v){ onClick(View v){ //button1//button1被按了一下 tv tv = (TextView)findViewById(R.id. = (TextView)findViewById(6text6); ); ////获得被隐藏文 //本对象 tv tv .setVisibility(View..setVisibility(View.VISIBLE VISIBLE ); ); ////文本对象设置为可见 button1button1 = (Button)findViewById(R.id. = (Button)findViewById(R.id.button1button1); ); ////获得 //按钮对象 button1button1.setText(.setText("Thank you !""Thank you !"); ); ////按钮文本修改为 //Thank you ! } };
button1button1 = (Button)findViewById(R.id. = (Button)findViewById(R.id.button1button1); ); ////设置按钮 button1button1.setOnClickListener(.setOnClickListener(listener listener );
}
}
布局效果:
点击按钮“点击按钮“Yes I do!Yes I do!Yes I do!”” 后的事件响应效果:后的事件响应效果:
【实验心得】:
【实验心得】:
刚刚接到实验内容,就开始做这个实验,依照实验要求的效果模型一步步的添加控件,查看效果,修改控件属性。就这样一个控件一个控件的做,做了很长时间,终于把所有的都搞定了,我觉得在这个实验过程中最大的收获不是完成了实验要求,而是在这个实验过程中,了解
开发帮助很大。
textstyle了很多控件的属性和控件布局的方法,这对进一步的Android开发帮助很大。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论