tabpageindacator与fragment的应用

我们手机上常会看见各种各样的导航，列入今日头条上面的，还有uc浏览器上面的新闻类别等，下面就跟大家分享一下关于指示器的应用

首先在工程中导入一个library工程，然后与自己新建的项目进行关联，右击—-properties—Android—-add

在导入的过程中可能出现错误，由于v4包冲突，我们需要将两个包里的v4一致

package com.bawei.practice;import com.viewpagerindicator.TabPageIndicator;import android.support.v4.app.FragmentActivity;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.support.v7.app.ActionBarActivity;import android.app.Activity;import android.os.Bundle;import android.view.Menu;import android.view.MenuItem;public class MainActivity extends FragmentActivity {    TabPageIndicator tIndicator;    ViewPager viewPager;    String titlename[]={"资讯","热点","博客","推荐"};    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        //初始化控件        tIndicator=(TabPageIndicator) findViewById(R.id.tabindicator);        viewPager=(ViewPager) findViewById(R.id.viewpager);        indicator();    } private void indicator() {        viewPager.setAdapter(new Mypageadapter(getSupportFragmentManager(),titlename));        tIndicator.setViewPager(viewPager);        tIndicator.setOnPageChangeListener(new OnPageChangeListener() {            @Override            public void onPageSelected(int arg0) {                // TODO Auto-generated method stub            }            @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            }        });    }}

上面是主activity里面的代码

package com.bawei.practice;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;public class Mypageadapter extends FragmentPagerAdapter {    String title[]={"news_list","blog_list","news_list","blog_list"};    FragmentManager fm;    String[] titlename;    public Mypageadapter(FragmentManager fm,String[] titlename) {        super(fm);        // TODO Auto-generated constructor stub        this.fm=fm;        this.titlename=titlename;    }    @Override    public Fragment getItem(int arg0) {        F1 f1=new F1();        Bundle bundle=new Bundle();        bundle.putString("name", title[arg0]);        f1.setArguments(bundle);        return f1;    }    @Override    public int getCount() {        // TODO Auto-generated method stub        return titlename.length;    }    @Override    public CharSequence getPageTitle(int position) {        return titlename[position];    }}

package com.bawei.practice;import java.text.SimpleDateFormat;import java.util.ArrayList;import java.util.Date;import com.bawei.bean.News;import android.content.Context;import android.support.v4.app.FragmentActivity;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.TextView;public class Mylistadapter extends BaseAdapter{    Context context;    ArrayList<News> list;    public Mylistadapter(Context context, ArrayList<News> list) {        // TODO Auto-generated constructor stub        this.context=context;        this.list=list;    }    @Override    public int getCount() {        // TODO Auto-generated method stub        return list.size();    }    @Override    public Object getItem(int position) {        // TODO Auto-generated method stub        return null;    }    @Override    public long getItemId(int position) {        // TODO Auto-generated method stub        return 0;    }    @Override    public View getView(int position, View convertView, ViewGroup parent) {        View view=View.inflate(context, R.layout.list_item, null);        TextView tvtitle=(TextView) view.findViewById(R.id.tv_title);        TextView tvbody=(TextView) view.findViewById(R.id.tv_body);        TextView tvtime=(TextView) view.findViewById(R.id.tv_time);        News news = list.get(position);        tvtitle.setText(news.title);        tvbody.setText(news.body);        SimpleDateFormat sDateFormat=new SimpleDateFormat("yy-MM-dd-hh-mm-ss");        String format = sDateFormat.format(new Date(System.currentTimeMillis()));        tvtime.setText(format);        return view;    }}注意在到代码的过程中 还要对上面的导航设置style主要有两个图片  两个selector还要复制里面的style   更改清单文件中的themeselector_tabtext.xml

tab_indicator.xml

还有values目录下的style添加下面的这些代码

<style name="StyledIndicators" parent="@android:style/Theme.Light">    <item name="vpiTabPageIndicatorStyle">@style/CustomTabPageIndicator</item></style>    <style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">    <item name="android:background">@drawable/tab_indicator</item>    <item name="android:textAppearance">@style/CustomTabPageIndicator.Text</item>    <item name="android:textSize">14sp</item>    <item name="android:dividerPadding">8dp</item>    <item name="android:showDividers">middle</item>    <item name="android:paddingLeft">10dp</item>    <item name="android:paddingRight">10dp</item>    <item name="android:fadingEdge">horizontal</item>    <item name="android:fadingEdgeLength">8dp</item></style><style name="CustomTabPageIndicator.Text" parent="android:TextAppearance.Medium">    <item name="android:typeface">monospace</item>    <item name="android:textColor">@drawable/selector_tabtext</item></style>

“`

清单文件中的 application下的theme改为 @style/StyledIndicators