TabSwitcher自定义控件(带拖动&滑动效果)

系统 1595 0
上一篇 实现了滑动效果,还是不爽,这次还添加了拖动效果,请大家帮忙测试。

上传于8.5 1:30
8.5 4:15一次更新

TabSwitcher自定义控件(带拖动&滑动效果)

    
package com.ql.view;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Color;
import android.util.AttributeSet;
import android.util.Log;
import android.view.Gravity;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.LinearInterpolator;
import android.view.animation.TranslateAnimation;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.ql.app.R;

public class TabSwitcher extends FrameLayout{

	private static final String tag="TabSwitcher";
	private Context context;
	private String[] texts;
	private int arrayId;
	private int selectedPosition=0;
	private int oldPosition=selectedPosition;
	private ImageView iv;
	private LinearLayout.LayoutParams params;
	private LinearLayout layout;
	private int iv_width;
	private TextView[] tvs;
	public TabSwitcher(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
		init();
	}
	public TabSwitcher(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
		Log.i(tag, "--------------TabSwitcher2---------------------");
		init();
		TypedArray a=context.obtainStyledAttributes(attrs,R.styleable.custom);  
		arrayId=a.getResourceId(R.styleable.custom_arrayId, 0);
//		selectedPosition=a.getInt(R.styleable.custom_selectedPosition, 0);
        a.recycle();
	}
	private void init(){
		context=getContext();
		FrameLayout.LayoutParams params=new FrameLayout.LayoutParams(FrameLayout.LayoutParams.FILL_PARENT,FrameLayout.LayoutParams.WRAP_CONTENT);
		setLayoutParams(params);
		setBackgroundResource(R.drawable.tabswitcher_long);
		
	}
	
	@Override
	protected void onFinishInflate() {
		// TODO Auto-generated method stub
		super.onFinishInflate();
		Log.i(tag, "--------------onFinishInflate---------------------");
		if(arrayId!=0){
			texts=getResources().getStringArray(arrayId);
		}else{
			texts=new String[]{};
		}
		tvs=new TextView[texts.length];
	}

	OnClickListener listener = new OnClickListener(){

		@Override
		public void onClick(View v) {
			// TODO Auto-generated method stub
			selectedPosition=(Integer)v.getTag();
			if(tvs[selectedPosition].isClickable()){
				tvs[oldPosition].setClickable(true);
				tvs[selectedPosition].setClickable(false);
				doAnimation();
				
				oldPosition=selectedPosition;
				if(onItemClickLisener!=null){
					onItemClickLisener.onItemClickLisener(v, selectedPosition);
				}
			}
			
		}
		
	};
	
	@Override
	protected void onSizeChanged(int w, int h, int oldw, int oldh) {
		// TODO Auto-generated method stub
		super.onSizeChanged(w, h, oldw, oldh);
		Log.i("tag", "---------------onSizeChanged--------------------");
		if(selectedPosition>texts.length-1){
			throw new IllegalArgumentException("The selectedPosition can't be > texts.length.");
		}
		layout=new LinearLayout(context);
		params=new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT,this.getMeasuredHeight());//为了居中显示文字
		params.weight=1;
		params.gravity=Gravity.CENTER_VERTICAL;
		for(int i=0;i<texts.length;i++){
			TextView child=new TextView(context);
			child.setTag(i);
			child.setText(texts[i]);
			child.setTextSize(16);
			child.setTextColor(Color.BLACK);
			child.setGravity(Gravity.CENTER);
			child.setOnClickListener(listener);
			if(i==selectedPosition){
				child.setClickable(false);
			}else{
				child.setClickable(true);
			}
			tvs[i]=child;
			layout.addView(child,params);
		}
		
		oldPosition=selectedPosition;
		//
		iv_width=this.getMeasuredWidth()/texts.length;//计算ImageView的宽
//		LinearLayout.LayoutParams p=new LinearLayout.LayoutParams(iv_width,LinearLayout.LayoutParams.FILL_PARENT);
		LinearLayout.LayoutParams p=new LinearLayout.LayoutParams(iv_width,this.getMeasuredHeight());
//		p.leftMargin=selectedPosition*iv_width;//无效,因为FrameLayout必须对齐左上角。
		iv=new ImageView(context);
//		iv.setImageResource(R.drawable.tabswitcher_short);
//		iv.setScaleType(ScaleType.FIT_XY);
		iv.setBackgroundResource(R.drawable.tabswitcher_short);
		iv.setOnTouchListener(touchListener);
		iv.setClickable(true);
		this.addView(iv,p);
		this.addView(layout,params);
	}
	
	private void doAnimation(){
//		TranslateAnimation animation = new TranslateAnimation(oldPosition*iv_width, selectedPosition*iv_width, 0, 0);  
		iv.layout(selectedPosition*iv_width, iv.getTop(),
	        		selectedPosition*iv_width+iv.getWidth(), iv.getBottom());//很关键!
		TranslateAnimation animation = new TranslateAnimation((oldPosition-selectedPosition)*iv_width, 0, 0, 0);  
		animation.setInterpolator(new LinearInterpolator());  
		animation.setDuration(400);  
		animation.setFillAfter(true);  
		iv.startAnimation(animation);  
	}
	
	private OnItemClickLisener onItemClickLisener;
	public void setOnItemClickLisener(OnItemClickLisener onItemClickLisener) {
		this.onItemClickLisener = onItemClickLisener;
	}
	public interface OnItemClickLisener{
		void onItemClickLisener(View view,int position);
	}
	
	public void setTexts(String[] texts) {
		this.texts = texts;
	}
//	public void setSelectedPosition(int selectedPosition) {
//		this.selectedPosition = selectedPosition;
//	}
	
	OnTouchListener touchListener=new OnTouchListener(){
		int temp[] = new int[]{0, 0};
		@Override
		public boolean onTouch(View v, MotionEvent event) {
			// TODO Auto-generated method stub
			int action = event.getAction();
			int x = (int)event.getRawX()-getLeft();//获得拖动点在屏幕的坐标
//			int x = (int)event.getX();//很奇怪,为什么这样x就会“跳”呢?
//			Log.i(tag, "x======="+x);
//            int y = (int)event.getRawY();//只能水平拖动,所以y方向不需要
			switch (action) {
			case MotionEvent.ACTION_DOWN:
				temp[0] = (int)event.getX();  
//                temp[1] = (int)(y-v.getTop());
                v.postInvalidate();
			break;
			case MotionEvent.ACTION_MOVE:
				int left = x - temp[0];  
                int right = left + v.getWidth();  
//                int top = y - temp[1];  
//                int bottom = top + v.getHeight();  
                int top=0;//y
                int bottom=0+v.getHeight();
                if (left < 0){//边界判断
                    left = 0;
                    right = left + v.getWidth();
                }

                if (right > getMeasuredWidth()){
                    right = getMeasuredWidth();
                    left = right - v.getWidth();
                }

                /*if (top < 0) {  
                    top = 0;  
                    bottom = top + v.getHeight();  
                }  

                if (bottom > getMeasuredHeight()) {  
                    bottom = getMeasuredHeight();  
                    top = bottom - v.getHeight();  
                }*/
                v.layout(left, top, right, bottom);
                v.postInvalidate();
			break;
			case MotionEvent.ACTION_UP:
				tvs[oldPosition].setClickable(true);
				setBestPosition();
				if(oldPosition!=selectedPosition){//回调
					if(onItemClickLisener!=null){
						onItemClickLisener.onItemClickLisener(tvs[selectedPosition], selectedPosition);
					}
				}
				oldPosition=selectedPosition;//
			    tvs[selectedPosition].setClickable(false);
			break;
			}
			return false;
		}
		
	};
	/**
	 * 获得最佳停留位置
	 */
	private void setBestPosition() {
		int left = iv.getLeft();
        selectedPosition = Math.round(1.0F*left/iv_width);//四舍五入
        int toPosition = selectedPosition*iv_width;
        iv.layout(selectedPosition*iv_width, iv.getTop(),
        		selectedPosition*iv_width+iv.getWidth(), iv.getBottom());
        TranslateAnimation animation = new TranslateAnimation(left-toPosition,0,0,0);
        animation.setInterpolator(new LinearInterpolator());  
        animation.setDuration(400);
		animation.setFillAfter(true);  
        iv.startAnimation(animation);
//        iv.invalidate();
        
    }
}

  

    
package com.ql.app;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Toast;

import com.ql.view.TabSwitcher;
import com.ql.view.TabSwitcher.OnItemClickLisener;

public class App extends Activity{
	private Context context;
	private TabSwitcher tabSwitcher;
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        context=this;
        tabSwitcher=(TabSwitcher)findViewById(R.id.tabSwitcher);
        
        tabSwitcher.setOnItemClickLisener(onItemClickLisener);
//        tabSwitcher.setTexts(new String[]{"1","2","3"});
    }
    
	
    OnItemClickLisener onItemClickLisener=new OnItemClickLisener(){

		@Override
		public void onItemClickLisener(View view, int position) {
			// TODO Auto-generated method stub
			//
			switch (position) {
			case 0:
			case 1:
			case 2:
			case 3:
			case 4:
				Log.i("App", "position:"+position);
//				Toast.makeText(context, "position clicked:"+position, Toast.LENGTH_SHORT).show();
				break;

			default:
				break;
			}
		}
    	
    };
}

  

TabSwitcher自定义控件(带拖动&滑动效果)


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论