今天利用画图实现了一个android自定义的actionbar,在加上系统的viewpager+fragment实现的可以滑动切换的效果。代码如下:
首先编写三个fragment的代码,FragmentOne.java的代码如下:
public class FragmentOne extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { return inflater.inflate(R.layout.one,container,false); } }
接下来是自定义的MyTabView.java
import java.util.List; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.text.TextPaint; import android.util.AttributeSet; import android.util.DisplayMetrics; import android.util.Log; import android.view.MotionEvent; import android.view.View; import android.view.WindowManager; public class MyTabView extends View { private List<String>list;//用于存放tab上的文字 private float textWidth;//文字的宽度 private Paint paint; private int tabBackColor = Color.parseColor("#ff76786b");//tab项的背景色 private int textColor = Color.parseColor("#ffef6881"); //字体的颜色 private int vertalLineColor = Color.parseColor("#ffffff"); //竖智分割线的颜色 private int horizinalLineColor = Color.parseColor("#86ff35");//滑动下划线的颜色 private float pressX; private float pressY; private float height;//该控件的高度 private float width;//高控件的宽度 private float tabLength;//单个tab的宽度 private float horizinalLineX = 0.0f;//用于控制水平下划线的位置 private boolean isMoving = false; // float tabHeight = 0.0f; private int index = 0;//当前被选中的项 public MyTabView(Context context, AttributeSet attrs) { super(context, attrs); //获得屏幕的宽度 WindowManager windowManager = (WindowManager) context.getSystemService(context.WINDOW_SERVICE); DisplayMetrics outMetrics = new DisplayMetrics(); windowManager.getDefaultDisplay().getMetrics(outMetrics); // tabHeight = outMetrics.heightPixels / 10; paint = new Paint(); } /** * 根据文本和字体大小获得文本的宽度 * @param text * @param textSize * @return */ public float getTextWidth(String text,float textSize) { TextPaint textPaint = new TextPaint(); textPaint.setTextSize(textSize); return textPaint.measureText(text); } @Override protected void onDraw(Canvas canvas) { // TODO Auto-generated method stub super.onDraw(canvas); width = getWidth();//获得控件的宽度 height = getHeight();//获得控件的高度 tabLength = width/list.size();//动态分割宽度 /** * 绘出当前的tab和文字以及下划线 */ for (int i = 0; i < list.size(); i++) { paint.setColor(tabBackColor); textWidth = getTextWidth(list.get(i),18.f); //绘制单个tab canvas.drawRect(i*tabLength,0,(i+1)*tabLength,height, paint); /** * 绘制竖直分割线 */ if (i >= 1 && i < list.size()) { paint.setColor(vertalLineColor); paint.setStrokeWidth(2); canvas.drawLine(i*tabLength,2.0f,i*tabLength,tabLength-3.0f,paint); } //绘制tab文本 paint.setColor(textColor); canvas.drawText(list.get(i),i*tabLength+(tabLength-getPaddingLeft()-getPaddingRight()-textWidth)/2,height/2, paint); //绘制tab地步水平滑动条 paint.setColor(horizinalLineColor); paint.setStrokeWidth(15); canvas.drawLine(horizinalLineX,height,horizinalLineX+tabLength,height, paint); } } @Override public boolean onTouchEvent(MotionEvent event) { // TODO Auto-generated method stub int action = event.getAction(); switch (action) { case MotionEvent.ACTION_DOWN: if (!isMoving) {//如果不是滑动的情况 pressX = event.getX(); pressY = event.getY(); index = checkLegal(pressX,pressY); // horizinalLineX = index * tabLength; MainActivity.pager.setCurrentItem(index); invalidate(); } break; case MotionEvent.ACTION_MOVE: isMoving = true; pressX = event.getX(); pressY = event.getY(); horizinalLineX = pressX - tabLength; if (horizinalLineX <= 0) { horizinalLineX = 0; } if (horizinalLineX + tabLength >= width) { horizinalLineX = width - tabLength; } invalidate();//重画 break; case MotionEvent.ACTION_UP: isMoving = false; pressX = event.getX(); index = (int) ( pressX / tabLength); Log.d("test","当前项"+index); if (horizinalLineX > index * tabLength + tabLength/2) {//是否已经滑动超过一半 horizinalLineX = tabLength * (index+1); }else{ horizinalLineX = tabLength * index; } MainActivity.pager.setCurrentItem(index); invalidate(); break; default: break; } return true; } /** * 用于结合viewpager滑动绘制 * @param pos */ public void onPagerDraw(int pos) { horizinalLineX = tabLength * pos; invalidate(); } public int checkLegal(float x,float y) { int index = (int)x / (int)tabLength; return index; } public List<String> getList() { return list; } public void setList(List<String> list) { this.list = list; } public int getIndex() { return index; } public void setIndex(int index) { this.index = index; } }MainActivity.java如下:
import java.util.ArrayList; import java.util.List; import android.os.Bundle; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentActivity; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter; import android.support.v4.view.ViewPager; import android.support.v4.view.ViewPager.OnPageChangeListener; import android.util.Log; import android.view.View; import android.view.ViewGroup; public class MainActivity extends FragmentActivity implements OnPageChangeListener{ List<Fragment>listfrFragments ; static int fragmentIndex = 0; static ViewPager pager = null; MyTabView myTabView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); myTabView = (MyTabView) findViewById(R.id.tabid); List<String>list = new ArrayList<String>(); list.add("title"); list.add("content"); list.add("friends"); myTabView.setList(list); listfrFragments = new ArrayList<Fragment>(); listfrFragments.add(new FragmentOne()); listfrFragments.add(new FragmentTwo()); listfrFragments.add(new FragmentThree()); pager = (ViewPager) findViewById(R.id.viewpagerid); FragmentManager manager = getSupportFragmentManager(); pager.setAdapter(new FramentApter(manager)); pager.setOnPageChangeListener(this); } class FramentApter extends FragmentPagerAdapter { public FramentApter(FragmentManager fm) { super(fm); } @Override public int getCount() { return listfrFragments.size(); } @Override public Fragment getItem(int arg0) { return listfrFragments.get(arg0); } @Override public void destroyItem(ViewGroup container, int position, Object object) { super.destroyItem(container, position, object); } @Override public Object instantiateItem(ViewGroup container, int position) { return super.instantiateItem(container, position); } } @Override public void onPageScrollStateChanged(int position) { // System.out.println(position); // Log.d("test",position+"---onPageScrollStateChanged"); } @Override public void onPageScrolled(int position, float arg1, int arg2) { // Log.d("test","比例"+arg1); // Log.d("test",arg2+""); } @Override public void onPageSelected(int position) { myTabView.onPagerDraw(position);//当viewpager选择新的选项时候重新绘制自定义tab的水平条 } }activity_main.xml如下:
<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=".MainActivity" > <com.example.androidselftab.MyTabView android:id="@+id/tabid" android:layout_width="match_parent" android:layout_height="40dp" /> <android.support.v4.view.ViewPager android:id="@+id/viewpagerid" android:layout_width="wrap_content" android:layout_height="wrap_content" > </android.support.v4.view.ViewPager> </LinearLayout>