1. 综合使用TextView,ImageView,RadioButton控件实现一个图片选择器,通过勾选花朵的名称显示相应的图片,界面如附件图1、图2所示。具体要求如下:
a) 使用滚动字幕显示标题“请选择你喜欢的花”
b) 使用RadioGroup 和RadioButton 创建两行三列的单选按钮;
c) 当用户选中某一花名,在页面上显示该种花的图片
首先是设置TextView的跑马灯的功能,在百度上查阅了很多的资料之后,终于找到了一种方法能够使TextView中的内容横向滚动,但是要有些前提:
1、文字的长度必须要超过TextView本身的长度
2、文字要以单行显示在TexiView上
3、TextView要获得焦点
了解到这些之后,在XML中给TextView设置一些关键的属性,以下是其代码:
<TextView
android:id="@+id/subtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="marquee"--以跑马灯的方式显示横向滚动
android:focusable="true"--设置TextView进入界面自动获的焦点
android:focusableInTouchMode="true"--设置TextView触摸屏幕时就获得焦点
android:marqueeRepeatLimit="marquee_forever"--设置跑马灯滚动的次数,forever就是一直滚动
android:singleLine="true"--设置TextView的内容为单行显示
android:text="Please chose a flower you like"
android:textColor="@android:color/holo_blue_bright"
android:textSize="50sp" />
就是通过以上的属性设置使得TextView的内容能够横向滚动。
然后在布局中写ImageView
<ImageView
android:id="@+id/imageView"
android:layout_width="285dp"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_weight="0.44" />
再然后我设置了两个RadioGroup
<RadioGroup
android:id="@+id/radioGroup1"
android:layout_width="244dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="horizontal"
android:weightSum="1">
<RadioButton
android:id="@+id/rb_lihua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="false"
android:text="梨花 " />
<RadioButton
android:id="@+id/rb_meihua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.16"
android:text="梅花" />
<RadioButton
android:id="@+id/rb_mudan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="牡丹" />
</RadioGroup>
<RadioGroup
android:id="@+id/radioGroup2"
android:layout_width="243dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="horizontal">
<RadioButton
android:id="@+id/rb_shinanhua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="石楠 " />
<RadioButton
android:id="@+id/rb_xiangyahua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="象牙花" />
<RadioButton
android:id="@+id/rb_yulanhua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="玉兰花" />
</RadioGroup>
用这种方法实现两行单选按钮。
以上的所有布局代码都是在下面的Layout中
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.a15083.zuoye_1.MainActivity"
android:weightSum="1">
</LinearLayout>
接着是在activity中进行相关功能的实现
package com.a15083.zuoye_1;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.RadioButton;
public class MainActivity extends AppCompatActivity {
private ImageView imageView ;
private RadioButton li ;
private RadioButton mei;
private RadioButton mudan ;
private RadioButton shinan ;
private RadioButton xiangya;
private RadioButton yulan;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//获取所有需要使用的控件对象
imageView = (ImageView) findViewById(R.id.imageView);
li = (RadioButton) findViewById(R.id.rb_lihua);
mei = (RadioButton) findViewById(R.id.rb_meihua);
mudan = (RadioButton) findViewById(R.id.rb_mudan);
shinan = (RadioButton) findViewById(R.id.rb_shinanhua);
xiangya = (RadioButton) findViewById(R.id.rb_xiangyahua);
yulan = (RadioButton) findViewById(R.id.rb_yulanhua);
//设立6个监听事件来监听每个RadioButton的动作
li.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(li.isChecked()){
clear2();//调用clear2()方法
imageView.setImageResource(R.drawable.lihua);//设置imageview所显示的图片
}
}
});
mei.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(mei.isChecked()){
clear2();
imageView.setImageResource(R.drawable.meihua);
}
}
});
mudan.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(mudan.isChecked()){
clear2();
imageView.setImageResource(R.drawable.mudan);
}
}
});
shinan.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(shinan.isChecked()){
clear1();
imageView.setImageResource(R.drawable.shinanhua);
}
}
});
xiangya.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(xiangya.isChecked()){
clear1();
imageView.setImageResource(R.drawable.xiangyahua);
}
}
});
yulan.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(yulan.isChecked()){
clear1();
imageView.setImageResource(R.drawable.yulanhua);
}
}
});
}
//这里的方法是使得第一个RadioGroup中的所有radiobutton的选中状态全部为false,即不选中
void clear1(){
li.setChecked(false);
mei.setChecked(false);
mudan.setChecked(false);
}
//这里的方法是使得第二个RadioGroup中的所有radiobutton的选中状态全部为false,即不选中
void clear2(){
shinan.setChecked(false);
xiangya.setChecked(false);
yulan.setChecked(false);
}
}
因为我是把那两排radiobutton分为两个组,但是这两个组之间会出现非单选的情况,所以我就使用了一种比较笨拙的方法,在第一组的radiobutton被选中是就把第二组的radiobutton的选中状态全部改为false,第二组的radiobutton也是使用同样的操作。这样就能够实现六个radiobutton中同时只有一个被选中(因为我实在找不到更好的办法来实现这个功能了/(ㄒoㄒ)/~~)。到此,第一个任务就完成了。
2. 完成如附件图3、图4所示的任务:
a) 图片随着鼠标移动位置,并显示出当前位置的坐标信息。
b) 当用户点击退出按钮,给出提示信息:“再按一次退出程序”。
这第二个任务布局方面的都比较好做,所以就不做什么解释了。
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.a15083.zuoye_2.MainActivity">
<ImageView
android:id="@+id/ima"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/mov"/>
</android.support.constraint.ConstraintLayout>
在第二个任务里使用了两个新的方法(当然,都是从百度上获知的),第一条就是
"setPadding()"这个方法需要有一个ImageView的对象来调用,通过这个方法可以动态的设置imageview的位置。
还有就是“System.currentTimeMillis()”这个方法用来取到当前的系统时间,会返回一个类型为long的数据。
下面是功能实现的代码:
package com.a15083.zuoye_2;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.MotionEvent;
import android.widget.ImageView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
private ImageView ima;
private long time;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//获取imageview控件的对象
ima = (ImageView) findViewById(R.id.ima);
}
//重写onTouchEvent方法
@Override
public boolean onTouchEvent(MotionEvent event) {
if(event.getAction()==MotionEvent.ACTION_DOWN){
String ce="";
float x = event.getX();//获取触碰位置的X坐标
float y = event.getY();//获取触碰位置的Y坐标
ima.setPadding((int)x-100,(int)y-300,0,0);//根据获取的坐标给ima设置位置
ce="x坐标:"+x+"\ny坐标:"+y;
Toast.makeText(this,ce, Toast.LENGTH_SHORT).show();
}
return super.onTouchEvent(event);
}
//重写onKeyDown方法
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if(event.getKeyCode()==KeyEvent.KEYCODE_BACK){//判断点击的是手机上的返回键
exit();
return false;
}
return super.onKeyDown(keyCode, event);
}
void exit(){
//当第一次调用的时候,time为0,所以这一次应用不会退出
if(System.currentTimeMillis()-time>2000){
Toast.makeText(this,"再次点击退出程序!",Toast.LENGTH_SHORT).show();
time=System.currentTimeMillis();//取出系统时间在第二次点击返回键时会用到的
}else {
finish();
}
}
}
在设置imageview的位置的时候,为了大致能够使图片的中心位置放在触碰点上,所以我是这样写的:
ima.setPadding((int)x-100,(int)y-300,0,0)
这样能够达到一个比较舒服的视觉效果,至于那个减掉的100和300,是多次试验出来的,至于为什么,我也不知道。
做电击两次返回键退出的主要思路就是对两次点击间隔的时间的判断,用了一个取系统时间,这样就可以清楚的知道两次点击时的间隔时间,从而做出相应的事件处理。
最后再附上程序的运行图:
任务一:
任务二:
这是第一次写博客,有些不好的地方,请多多包涵,也非常欢迎大家能够多给一些意见!