UI的定义

全称user interface, 意为:用户界面
UIViewViewGroup组成       
View类是所有视图(包括ViewGroup)根基类
View在屏幕上占据一片矩形区域,并会在上面进行内容绘制
ViewGroup包含一些ViewViewGroup,用于控制子View的布局


ViewAPI结构

UI用户界面(2018.5.7)UI用户界面(2018.5.7)UI用户界面(2018.5.7)


UI的组成:

       

界面的整体布局(layout)

UI用户界面(2018.5.7)

组成可视界面的各个UI组件(Component)

UI用户界面(2018.5.7)


理解UI事件

当用户通过手指触摸UI,系统会自动创建对应的Event对象
Android中提供了多种方式拦截处理不同类型的事件
视图本身就可以处理发生在该视图上的事件
UI用户界面(2018.5.7)


使用UI事件

Android提供了很多不同类型的事件监听器接口

View.OnClickListeneronClick()

View.OnLongClickListener: onLongClick()

View.OnTouchListener: onTouch()

View.OnCreateContextMenuListener: onCreateContextMenu()

View.OnFocusChangeListeneronFocusChange()

View.OnKeyListeneronKey()

给视图添加事件监听的方式

       view.seton…Listener(listener)


测试用例


UI用户界面(2018.5.7)UI用户界面(2018.5.7)



常用的简单Component

UI用户界面(2018.5.7)UI用户界面(2018.5.7)


TextView文本视图

<TextView

    android:id=“@+id/tv_test1_message“     //指定id

    android:layout_width=“match_parent“  //宽度

    android:layout_height=“wrap_content//高度

    android:text=“这是TextView的内容“     // 文本

    android:textColor=“#ff0000“                    // 文本颜色

    android:textSize=“20sp”/>                       // 字体大小


EditText文本输入框

<EditText

        android:id="@+id/et_test1_number"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:hint=“请输入手机号“                                //默认提示文本

       android:inputType=“phone”>    // 输入数据类型限定

</EditText>


Button:  按钮

<Button

    android:id="@+id/btn_test1_submit"

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    android:text="提交" />


ImageView: 图片视图

<ImageView

    android:id="@+id/iv_test1_play"

    android:layout_width="70dp"

    android:layout_height="70dp"

   android:background=“@drawable/ic_launcher“          //背景图片

    android:src=“@android:drawable/ic_media_play”/> //前景图片

//设置前景图片

publicvoid setImageResource(intresId)

//设置背景图片

publicvoid setBackgroundResource(intresid)


CheckBox: 选框

<CheckBox

            android:id="@+id/cb_test1_basket"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="篮球"

            android:checked=“true”/>//标识默认是否勾选

//判断当前是否勾选

booleanisChecked()

//设置CheckBox是否勾选

void setChecked(booleanchecked)

//设置选中状态改变的监听

void setOnCheckedChangeListener(OnCheckedChangeListener listener)


RadioGroup/RadioButton: 单选框

<RadioGroup     

            android:id="@+id/rg_test1_sex"

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:orientation="horizontal" >

            <RadioButton

                android:id="@+id/rb_test1_male"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="" />

            <RadioButton

                android:id="@+id/rb_test1_female"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content

                android:checked="true"

                android:text="" />

        </RadioGroup>


——————————————————————————————————————————————

 关于异常

UI用户界面(2018.5.7)


————————————————————————————————————————————————————

代码如下:

一.主界面

初始化

setContentView(R.layout.activity_main);

findViewById(R.id.button1).setOnClickListener(this);

findViewById(R.id.button2).setOnClickListener(this);

findViewById(R.id.button3).setOnClickListener(this);

findViewById(R.id.button4).setOnClickListener(this);

}

public void onClick(View v){

switch (v.getId()) {//简单的

case R.id.button1:

startActivity(new Intent(this,SimpleComponentActivity.class));

break;

case R.id.button2:

break;

case R.id.button3:


break;

case R.id.button4:

break;

}

简单的Component 

RadioButto设置

rg_sex=(RadioGroup)findViewById(R.id.rg_sex);//获取Id

rg_sex.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {//设置监听

public void onCheckedChanged(RadioGroup group, int checkedId) {

//checkedId就是RadioButton的id

RadioButton rb = (RadioButton) findViewById(checkedId);

String sex = rb.getText().toString();//得到文本

Toast.makeText(SimpleComponentActivity.this, sex, Toast.LENGTH_SHORT).show();

//同理都获取ID设置监听

 tv_simple_msg=(TextView)findViewById(R.id.tv_simple_msg);

et_simple=(EditText)findViewById(R.id.et_simple);

bt_simple_submit=(Button)findViewById(R.id.bt_simple_submit);

//对图片视图设置监听

iv_simple_play=(ImageView) findViewById(R.id.iv_simple_play);

iv_simple_play.setOnClickListener(new View.OnClickListener() {

public void onClick(View v) {

if (status) {

//设置背景图片

iv_simple_play.setBackgroundResource(R.drawable.ic_launcher);

//系统自带

iv_simple_play.setBackgroundResource(android.R.drawable.alert_dark_frame);

//设置前景图片

iv_simple_play.setImageResource(android.R.drawable.ic_media_pause);

status =false;

}else{

iv_simple_play.setBackgroundResource(android.R.drawable.alert_light_frame);

//设置前景图片

iv_simple_play.setImageResource(android.R.drawable.ic_media_play);

status =true;

}

}

});

//对选框获取Id设置 选择监听

cb_basketball=(CheckBox) findViewById(R.id.cb_basketball);

textView2=(CheckBox) findViewById(R.id.textView2);

cb_pingpong=(CheckBox) findViewById(R.id.cb_pingpong);

//选中状态改变的监听    我们对篮球设置   其他控件同理

cb_basketball.setOnCheckedChangeListener(new OnCheckedChangeListener() {

public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {

if (isChecked) {

Toast.makeText(SimpleComponentActivity.this, "选中篮球", Toast.LENGTH_SHORT).show();

}else{

Toast.makeText(SimpleComponentActivity.this, "未选中篮球", Toast.LENGTH_SHORT).show();

}

}

});

//是否选中 控件

public void confirm(View v){

StringBuffer sb = new StringBuffer();

if (cb_basketball.isChecked()) {

sb.append(cb_basketball.getText().toString().trim());

}

if (textView2.isChecked()) {

sb.append(textView2.getText().toString().trim());

}

if (cb_pingpong.isChecked()) {

sb.append(cb_pingpong.getText().toString().trim());

}

}


相关文章:

  • 2021-11-21
  • 2021-08-11
  • 2022-12-23
  • 2021-06-27
  • 2021-06-21
  • 2021-09-25
猜你喜欢
  • 2022-01-12
  • 2021-12-18
  • 2021-07-09
  • 2021-06-20
  • 2022-02-01
  • 2021-09-24
  • 2021-12-29
相关资源
相似解决方案