之前看了很多了Viewpage, 我主要是想做一个在底部TAB滑动的效果不过之前 因为不知道怎么 点击和滑动到某一个TAB 就变色,一直没写出一个Demo,现在算是写出来了,也算对Viewpage有个交代了吧
对于Viewpage的使用 你必须在布局中使用一个Viewpage
<android.support.v4.view.ViewPager
android:id="@+id/iask_main_view_pager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1" >
</android.support.v4.view.ViewPager>
然后在activity中开始使用
1.定义一个viewpage
private ViewPager pager;
2.准备好适配器
IAskFragmentAdapter fragmentAdapter = new IAskFragmentAdapter(getSupportFragmentManager());
3.然后设置点击事件 和滑动事件
先看布局吧
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/iask_manager_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical"
>
<android.support.v4.view.ViewPager
android:id="@+id/iask_main_view_pager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1" >
</android.support.v4.view.ViewPager>
<LinearLayout
android:id="@+id/iask_bottom_layout"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:background="@android:color/black"
android:visibility="visible"
android:layout_marginBottom="0dp"
>
<TextView
android:id="@+id/iask_ask_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我要问"
android:clickable="true"
android:focusable="true"
android:textSize="18sp"
android:gravity="center"
android:layout_gravity="center"
android:layout_weight="1"
android:background="@drawable/iask_bottom_tab_ask_pressed"
android:textColor="#9a9a9a"
/>
<TextView
android:id="@+id/iask_answer_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我要答"
android:layout_gravity="center"
android:gravity="center"
android:textSize="18sp"
android:clickable="true"
android:focusable="true"
android:layout_weight="1"
android:background="@drawable/iask_bottom_tab_answer_bg"
android:textColor="#9a9a9a"
/>
<TextView
android:id="@+id/iask_person_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/iask_bottom_tab_person_bg"
android:text="会员中心"
android:clickable="true"
android:focusable="true"
android:layout_gravity="center"
android:gravity="center"
android:layout_weight="1"
android:textSize="18sp"
android:textColor="#9a9a9a"
/>
</LinearLayout>
</LinearLayout>
布局也很简单 也就是三个tab页 加一个viewpage
然后就是业务逻辑
package com.example.viewpagedemo;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;
import com.example.viewpagedemo.adapter.IAskFragmentAdapter;
public class MainActivity extends FragmentActivity implements OnClickListener {
//定义一个viewpage
private ViewPager pager;
//定义第一个tab1
private TextView iask_ask_text;
//定义第二个tab1
private TextView iask_answer_text;
//定义第三个tab1
private TextView iask_person_text;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initViews();
//准备适配器,滑动三个fragment,所以需要将getSupportFragment放入得到Fragment
IAskFragmentAdapter fragmentAdapter = new IAskFragmentAdapter(getSupportFragmentManager());
pager.setAdapter(fragmentAdapter);
pager.setOnPageChangeListener(changeListener);
}
private void initViews() {
pager=(ViewPager) findViewById(R.id.iask_main_view_pager);
iask_answer_text=(TextView) findViewById(R.id.iask_answer_text);
iask_ask_text = (TextView) findViewById(R.id.iask_ask_text);
iask_person_text = (TextView) findViewById(R.id.iask_person_text);
iask_ask_text.setOnClickListener(this);
iask_answer_text.setOnClickListener(this);
iask_person_text.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.iask_ask_text:
pager.setCurrentItem(0);
//其他按钮回复到为普通状态,自己为按下状态
setIAskSelectedState();
break;
case R.id.iask_answer_text:
pager.setCurrentItem(1);
setIAskAnswerSelectedState();
break;
case R.id.iask_person_text:
pager.setCurrentItem(2);
setIAskPersonSelectedState();
break;
default:
break;
}
}
protected void setIAskPersonSelectedState() {
iask_person_text.setBackgroundResource(R.drawable.iask_bottom_tab_ask_pressed);
iask_answer_text.setBackgroundResource(R.drawable.iask_bottom_tab_answer_bg);
iask_ask_text.setBackgroundResource(R.drawable.iask_bottom_tab_answer_bg);
}
private void setIAskAnswerSelectedState() {
iask_answer_text.setBackgroundResource(R.drawable.iask_bottom_tab_ask_pressed);
iask_ask_text.setBackgroundResource(R.drawable.iask_bottom_tab_answer_bg);
iask_person_text.setBackgroundResource(R.drawable.iask_bottom_tab_answer_bg);
}
private void setIAskSelectedState() {
iask_ask_text.setBackgroundResource(R.drawable.iask_bottom_tab_ask_pressed);
iask_answer_text.setBackgroundResource(R.drawable.iask_bottom_tab_answer_bg);
iask_person_text.setBackgroundResource(R.drawable.iask_bottom_tab_answer_bg);
}
private OnPageChangeListener changeListener = new OnPageChangeListener() {
@Override
public void onPageSelected(int position) {
switch (position) {
case 0:
setIAskSelectedState();
break;
case 1:
setIAskAnswerSelectedState();
break;
case 2:
setIAskPersonSelectedState();
break;
default:
break;
}
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
};
}
其实主要的就是 点击切换状态 滑动切换状态 其实以前不知道怎么互动切换状态的 其实viewpage里面有个方法 OnPageChangeListener的onPageSelected方法 切换也就是换了背景而已
其实最主要的adapter 因为使用的是Fragment所以我们要将getSupportFragmentMannager放入
package com.example.viewpagedemo.adapter;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.view.ViewGroup;
import com.example.viewpagedemo.Fragment.IAskAnswerFragment;
import com.example.viewpagedemo.Fragment.IAskFragment;
import com.example.viewpagedemo.Fragment.IAskPersonFragment;
public class IAskFragmentAdapter extends FragmentPagerAdapter {
public IAskFragmentAdapter(FragmentManager fm) {
super(fm);
}
/**
* 向外返回当前要显示的fragment
*/
@Override
public Fragment getItem(int position) {
Fragment f = null;
if (position == 0) {
f = new IAskFragment();
} else if (position == 1) {
f = new IAskAnswerFragment();
} else if (position == 2) {
f = new IAskPersonFragment();
}
return f;
}
/**
* 返回一共多少个数量
*/
@Override
public int getCount() {
return 3;
}
@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);
}
}