`

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

android 
阅读更多
上一篇是不带滑动效果的，这次更新一下，带滑动效果的。喜欢什么随便挑。



注意：目前工程里的代码可是最新的。8.4 5:00 
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.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 android.widget.ImageView.ScaleType;

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;
	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[]{};
		}
		
	}

	OnClickListener listener = new OnClickListener(){

		@Override
		public void onClick(View v) {
			// TODO Auto-generated method stub
			selectedPosition=(Integer)v.getTag();
			if(selectedPosition!=oldPosition){
				//
				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);
			
			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);
		this.addView(iv,p);
		this.addView(layout,params);
	}
	
	private void doAnimation(){
		TranslateAnimation animation = new TranslateAnimation(oldPosition*iv_width, selectedPosition*iv_width, 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;
//	}
	
}


用法：这里要注意selectedPosition不再是自定义属性了，所以不能设置初始化的时候选种哪个！也就是说初始化的时候只能选择第一个选项，只有这点与上一篇不同。 

package com.ql.app;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
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:
				Toast.makeText(context, "position clicked:"+position, Toast.LENGTH_SHORT).show();
				break;

			default:
				break;
			}
		}
    	
    };
}


利用这个功能也可以实现滑块的效果，只不过xml布局变一下而已，看下图：


  • 大小: 12.6 KB
  • 大小: 21.2 KB
分享到：
| TabSwitcher自定义控件(不带滑动效果)
评论
13 楼 yjdzh 2011-12-22  
android2.0 好像报错
12 楼 gundumw100 2011-09-19  
安轩之 写道
非常好啊。我想请教一下。有个滑动效果的SlidingDrawer，怎么定位到一个按钮上去？谢谢。非常急，请帮忙。qq 375290562

老兄，我怎么知道，你查查APi，看看SlidingDrawer有哪些方法，基本上就知道怎么用了。
11 楼 安轩之 2011-09-19  
非常好啊。我想请教一下。有个滑动效果的SlidingDrawer，怎么定位到一个按钮上去？谢谢。非常急，请帮忙。qq 375290562
10 楼 ynb1687 2011-08-05  
9 楼 ynb1687 2011-08-05  
8 楼 yautah 2011-08-04  
貌似在 2.1-update1下面有bug,文字和遮罩层显示不出来？
7 楼 yangjiantong 2011-08-04  
gundumw100 写道
yangjiantong 写道
不错，不过好像没有拖动效果，本来效果应该是按住那个蓝色图片后可以随意拖动的！

原来还要拖动啊，我不知道，我也是看了一个家伙说优亿的tab怎么怎么好之类的，所以就根据想象的实现了一下，要拖动的话等我有时间再写一个，现在我2头忙，没空，哈哈。

好的，顶你啊！
6 楼 gundumw100 2011-08-04  
jm417113220 写道
能加QQ不？ 我截图你看 这上面不能上传图片了  

50342016
5 楼 gundumw100 2011-08-04  
yangjiantong 写道
不错，不过好像没有拖动效果，本来效果应该是按住那个蓝色图片后可以随意拖动的！

原来还要拖动啊，我不知道，我也是看了一个家伙说优亿的tab怎么怎么好之类的，所以就根据想象的实现了一下，要拖动的话等我有时间再写一个，现在我2头忙，没空，哈哈。
4 楼 jm417113220 2011-08-04  
能加QQ不？ 我截图你看 这上面不能上传图片了  
3 楼 yangjiantong 2011-08-04  
不错，不过好像没有拖动效果，本来效果应该是按住那个蓝色图片后可以随意拖动的！
2 楼 gundumw100 2011-08-04  
竖着的屏幕的时候
jm417113220 写道
大哥 你那方法还有点问题哦 就是竖着的屏幕的时候 上面的按钮变形了 

竖着的屏幕的时候？什么意思，讲清楚点，我才能改。
1 楼 jm417113220 2011-08-04  
大哥 你那方法还有点问题哦 就是竖着的屏幕的时候 上面的按钮变形了 
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

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

    《TabSwitcher自定义控件：打造不带滑动效果的UI组件》 在Android应用开发中，界面设计和用户体验是至关重要的因素。一个优秀的应用不仅需要功能强大，还需要有一个直观且美观的用户界面。TabSwitcher控件是实现多...

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

    本文将深入探讨"TabSwitcher"这一自定义控件，它具备拖动和滑动效果，为用户提供了更流畅、直观的操作体验。通过分析"TabSwitcher"的实现，我们可以学习到如何在Android中创建动态且交互性强的UI组件。 ...

    TabSwitcher-crx插件

    TabSwitcher尝试通过让您##如何使用来解决此问题。安装后，按`CTRL + SHIFT + K'或`CMD + SHIFT + K'以显示选项卡切换器。您可以按Enter或使用鼠标键导航到选项卡。您可以在任何标签上按分号（即“;”键）关闭该标签...

    tabswitcher-crx插件

    语言:English tl;博士还记得textmate的命令t？ Chrome是相同的。 警告：必须在Chrome的扩展中手动设置快捷方式...... tl;博士还记得textmate的命令t？ Chrome是相同的。 警告：必须在Chrome的扩展设置中手动设置快捷...

    Radio Button

    在更复杂的场景中，可以通过`setCompoundDrawablesWithIntrinsicBounds()`方法来设置RadioButton的四周绘制元素，例如，将数字替换为图片，或者自定义一个带有选中状态的Drawable并将其设置为RadioButton的`...

    sitepoint-tabswitcher

    （带有NPM） 安装 git clone 此存储库 切换到新目录 npm install bower install 运行/开发 ember server 访问您的应用程序，为 。 代码生成器 利用许多生成器生成代码，尝试使用ember help generate更多详细信息 ...

    Android定制RadioButton样式三种实现方法

    在Android开发中，自定义UI元素是提升应用用户体验的重要手段之一。RadioButton作为常用的控件，其默认样式可能无法满足所有设计需求。本文将详细介绍三种方法来定制RadioButton的样式，包括使用XML文件、在Java代码...

    AndroidTabSwither:一个简单好用的Android Tab实现

    `AndroidTabSwither`是一个专为Android平台设计的简单易用的Tab实现库，它允许开发者创建带有可绘制元素和文本元素的选项卡。这个库提供了一种灵活的方式，开发者可以根据自己的需求选择只显示图形或文本，或者两者...

    Android系统浏览器源码+UML分析图

    本资源提供了Android系统浏览器的源码以及对应的UML（Unified Modeling Language）分析图，这对于理解浏览器的工作原理、优化性能、自定义功能或开发自己的浏览器应用都有着极大的帮助。 一、Android系统浏览器源码...

    Tab Switcher-crx插件

    语言:English 快速过滤和切换窗口和选项卡 使用选项卡切换器，您可以仅使用键盘快速切换到其他打开的选项卡，包括按部分名称或URL匹配过滤选项卡。...隐私政策请在http://flowapps.co/tabswitcher/privacypoli

    标签切换器「Tab Switcher」-crx插件

    快速控制，过滤和切换标签 ...请在https://github.com/kallepersson/tabswitcher中查看源代码。如何更改键盘快捷键以显示Tab切换器？ –很简单，您可以在扩展设置页面底部更改键盘快捷键！ 支持语言:English

    提前制表符：Web浏览器扩展，可帮助您按标题和URL快速查找打开的制表符

    在实际使用中，用户可能需要安装并启用这个扩展，然后在浏览器的某个指定位置（如地址栏旁或自定义快捷键）启动搜索功能。对于经常需要处理大量标签页的用户，例如研究人员、内容创作者或是多任务处理者来说，"提前...

Magicbox
Global site tag (gtag.js) - Google Analytics