项目——用自定义View在屏幕的左侧写上a~z,并加上点击事件

来源:互联网 发布:儿童唱歌软件 编辑:程序博客网 时间:2024/05/23 00:19
   用自定义View在屏幕的左侧写上a~z,并加上点击事件,可以在onDraw中用canvas.drawText进行绘制,重点在与如何计算每个Text所占的宽和高。高度我们用height/26,宽度我们用with-mpainText.measureText("m"),在(with-mpainText.measureText("m"),height/26(i+1))点上我们写Test,并设置画笔为: mpainText.setTextAlign(Paint.Align.CENTER);//居中

mpainText.setTextSize(height/26f);//设置文件的大小。
要对其进行点击事件即要重写onTouchEvent()方法,在用户接触屏幕的时候一般有三种Event:MotionEvent.ACTION_MOVE, MotionEvent.ACTION_DOWN,MotionEvent.ACTION_UP,第一种为按下屏幕滑动,第二种为按下屏幕,第三种为离开屏幕。可以在onTouchEvent()中判断是什么状态,并且可以通过:

 x=event.getX();//获得点击的坐标。                y=event.getY();

获得点击的坐标,这样就可以得到是点击的是哪一个字母了。并且我们可以设置两个画笔,当按下的时候就显示为红色。并将按下的字母显示在TextView中,这里就用到了观察者模式。
1)在自定义View中建立一个interface:onItemSelect,并在接口中定义一个方法:onItemSelected(int index,String nameString)。并设置一个这个接口的引用,
2)对这个引用设置set方法,使其可以在activity中对这个引用初始化。由于是在activity中调用的,所以可以在onItemSelected(int index,String nameString)中根据传入的参数的不同对其他View进行设置。
3)在activity的oncrea()方法运行完成了,这个引用也就被赋予了对象。可以在onTouchEvent()中用这个引用调用onItemSelected(int index,String nameString)方法了,并根据状态的不同传入相应的参数。
这样就实现了由于点击状态的不同而设置其他View显示不同的状态。
完整的代码如下:

mysolider:

public class mysolider extends View  {    private int with;    private int height;    private Paint mpainText;    private Paint mpainText_Red;    private  int index=-1;    private String []array ={"a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"};    public mysolider(Context context) {        super(context);    }  public   interface onItemSelect{      public void onItemSelected(int index,String nameString);  }    private onItemSelect linser;    public void setonItemSelectLinser(onItemSelect linser) {        this.linser = linser;    }    public mysolider(Context context, AttributeSet attrs) {        super(context, attrs);        mpainText = new Paint();        mpainText.setTextAlign(Paint.Align.CENTER);        mpainText_Red = new Paint();        mpainText_Red.setTextAlign(Paint.Align.CENTER);        mpainText_Red.setColor(Color.RED);    }    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        with=getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);        height=getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);        //这个不能再构造器中设置,因为调用构造器时heigth还没有测量默认是0.        mpainText.setTextSize(height/26f);//设置文件的大小。        mpainText_Red.setTextSize(height/26f);    }    private float x;    private float y;    @Override    public boolean onTouchEvent(MotionEvent event) {        switch (event.getAction()){            case MotionEvent.ACTION_MOVE:            case MotionEvent.ACTION_DOWN:                x=event.getX();//获得点击的坐标。                y=event.getY();                if(x>with-mpainText.measureText("m")*2){                    index = (int)y/(height/26);//获得点击的是哪一个字母                    Log.d("on","点击的是"+array[index]);                    invalidate();//刷新界面                    if(linser!=null){                        linser.onItemSelected(index,array[index]);                    }                    return true;                }                break;            case MotionEvent.ACTION_UP:                    index=-1;                linser.onItemSelected(index,array[0]);                invalidate();               break;        }        return super.onTouchEvent(event);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        for(int i = 0;i<array.length;i++){            //mpainText.measureText("m")为当为m字符时所占的宽度            if(index==-1||index!=i){                canvas.drawText(""+array[i],with-mpainText.measureText("m"),height/26*(i+1),mpainText);            }else {                canvas.drawText(""+array[i],with-mpainText.measureText("m"),height/26*(i+1),mpainText_Red);            }        }    }}

在XML中:

<RelativeLayout 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=".MainActivity">    <com.example.administrator.myview.myview.mysolider        android:id="@+id/my_view"        android:layout_width="match_parent"        android:layout_height="match_parent" />   <TextView       android:id="@+id/my_textView"       android:text="A"       android:textSize="150sp"       android:gravity="center"       android:layout_width="200dp"       android:layout_height="200dp"      android:layout_centerInParent="true"       android:visibility="invisible"       /></RelativeLayout>

在Activity中:

public class MainActivity extends Activity {private TextView textView;    private mysolider my_view;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        textView= (TextView) findViewById(R.id.my_textView);        my_view= (mysolider) findViewById(R.id.my_view);        my_view.setonItemSelectLinser(new mysolider.onItemSelect() {            @Override            public void onItemSelected(int index, String nameString) {                if(index!=-1){                    textView.setText(nameString);                    textView.setVisibility(View.VISIBLE);                }else {                    textView.setVisibility(View.INVISIBLE);                }            }        });    }}

结果如下:
这里写图片描述

这里写图片描述

当按下某个字母时这个字母会变红,并在TextView中显示出来,当不按下时TextView消失。

0 0
原创粉丝点击