ViewPager的运用给一些android项目的UI增添一些色彩,我今天就把结合ViewPager和RadioGroup,并且集成LinearLayout写的一个项目中运用到的类似控件的例子分享出来。
首先我们要将这个控件开发出来,并且能够在其他地方运用,代码如下:
package com.gutao.form; import com.gutao.activity.R; import java.util.ArrayList; import java.util.List; import android.content.Context; import android.graphics.Color; import android.os.Parcelable; import android.support.v4.view.PagerAdapter; import android.support.v4.view.PagerTabStrip; import android.support.v4.view.ViewPager; import android.util.AttributeSet; import android.view.Gravity; import android.view.View; import android.view.ViewGroup; import android.widget.CompoundButton; import android.widget.LinearLayout; import android.widget.RadioButton; import android.widget.RadioGroup; import android.widget.TextView; public class TabView extends LinearLayout { private RadioGroup tabGroup; private ViewPager mViewPager; private MyAdapter adapter; private int currentItem; private PagerTabStrip pagerTabStrip; private List<RadioButton> mTabs = new ArrayList<RadioButton>(); private List<View> mListViews = new ArrayList<View>(); public TabView(Context context, AttributeSet attrs) { super(context, attrs); init(); } public TabView(Context context) { super(context); init(); } private void init() { this.setOrientation(LinearLayout.VERTICAL); tabGroup = new RadioGroup(this.getContext()); tabGroup.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT,0)); tabGroup.setPadding(5, 0, 5, 0); tabGroup.setGravity(Gravity.CENTER_HORIZONTAL); tabGroup.setOrientation(LinearLayout.HORIZONTAL); tabGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() { public void onCheckedChanged(RadioGroup group, int checkedId) { RadioButton tab = (RadioButton) group.findViewById(checkedId); int tag = (Integer) tab.getTag(); mViewPager.setCurrentItem(tag); } }); this.addView(tabGroup); mViewPager = new ViewPager(this.getContext()); mViewPager.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT,1)); adapter = new MyAdapter(); mViewPager.setAdapter(adapter); mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { public void onPageSelected(int arg0) { if(!mTabs.get(arg0).isChecked()) { mTabs.get(arg0).setChecked(true); } currentItem = arg0; } public void onPageScrolled(int arg0, float arg1, int arg2) { // TODO Auto-generated method stub } public void onPageScrollStateChanged(int arg0) { // TODO Auto-generated method stub } }); this.addView(mViewPager); } public void addTabs(String title, View view) { RadioButton tabButton = getTabButton(title); tabButton.setTag(mTabs.size()); tabGroup.addView(tabButton); mTabs.add(tabButton); tabButton.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { if(isChecked) { buttonView.setTextColor(Color.parseColor("#ffffff")); buttonView.setBackgroundResource(R.drawable.layer_button); buttonView.setPadding(10,10,10,10); } else { buttonView.setTextColor(Color.parseColor("#666666")); buttonView.setBackgroundResource(R.drawable.tab_button); buttonView.setPadding(10,10,10,10); } } }); mListViews.add(view); } public void setCurrentItem(int item) { this.currentItem = item; mViewPager.setCurrentItem(currentItem); if(!mTabs.get(currentItem).isChecked()) { mTabs.get(item).setChecked(true); } } private RadioButton getTabButton(String title) { RadioButton tab = new RadioButton(this.getContext()); tab.setText(title); tab.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT,0)); tab.setMinimumWidth(100); tab.setGravity(Gravity.CENTER); tab.setButtonDrawable(getResources().getDrawable(android.R.color.transparent)); tab.setBackgroundResource(R.drawable.tab_button); tab.setPadding(10,10,10,10); tab.setTextColor(Color.parseColor("#666666")); tab.setTextSize(20); return tab; } class MyAdapter extends PagerAdapter{ @Override public void destroyItem(View container, int position, Object object) { ((ViewGroup) container).removeView(mListViews.get(position)); } @Override public int getCount() { return mListViews.size(); } @Override public boolean isViewFromObject(View arg0, Object arg1) { return arg0 == (arg1); } @Override public Object instantiateItem(View container, int position) { ((ViewGroup) container).addView(mListViews.get(position),0); return mListViews.get(position); } } public int getCurrentItem() { return currentItem; } }
下面就是acitivity中来运用,首先来看布局文件:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:background="#e6e6e6"> <com.gutao.form.TabView android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/tab" android:layout_weight="1"> </com.gutao.form.TabView> </LinearLayout>
再来看activity:public class MainActivity extends Activity { TabView tabViewPager; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); tabViewPager = (TabView) findViewById(R.id.tab); LinearLayout layout = new LinearLayout(this); layout.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)); layout.setOrientation(LinearLayout.VERTICAL); ImageView image1 = new ImageView(this); image1.setImageResource(R.drawable.fj3); image1.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT)); image1.setAdjustViewBounds(true); layout.addView(image1); LinearLayout layout1 = new LinearLayout(this); layout1.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)); layout1.setOrientation(LinearLayout.VERTICAL); ImageView image2 = new ImageView(this); image2.setAdjustViewBounds(true); image2.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT)); image2.setImageResource(R.drawable.fj1); layout1.addView(image2); LinearLayout layout2 = new LinearLayout(this); layout2.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)); layout2.setOrientation(LinearLayout.VERTICAL); ImageView image3 = new ImageView(this); image3.setAdjustViewBounds(true); image3.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT)); image3.setImageResource(R.drawable.fj3); layout2.addView(image3); if(tabViewPager != null && layout != null && layout1 != null && layout2 != null) { tabViewPager.addTabs("栏 目1", layout); tabViewPager.addTabs("栏 目2", layout1); tabViewPager.addTabs("栏 目3", layout2); } tabViewPager.setCurrentItem(0); } }
其中添加进去的layout、layout1、layout2只要是view就可以。这样就可以实现在一个activity里面显示多个view页面,而且你可以点击RadioButton,也可以进行滑动的选择你想要到的页面。