可滑动的顶部导航页ViewPager和Fragment的使用

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

<?xml
version="1.0" encoding="utf-8"?>

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <LinearLayout  

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:orientation="horizontal"> 

        <TextView  

            android:id="@+id/tv_guid1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_weight="1.0"

            android:gravity="center"

            android:text="特性1"

            android:textSize="18sp"/> 

        <TextView   

            android:id="@+id/tv_guid2"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_weight="1.0"

            android:gravity="center"

            android:text="特性2"

            android:textSize="18sp"/>   

        <TextView   

            android:id="@+id/tv_guid3"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_weight="1.0"

            android:gravity="center"

            android:text="特性3
"

            android:textSize="18sp"/>   

        <TextView   

            android:id="@+id/tv_guid4"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_weight="1.0"

            android:gravity="center"

            android:text="特性4"

            android:textSize="18sp"/> 

    </LinearLayout> 

    <TextView  

        android:id="@+id/cursor"

        android:layout_width="80dp"

        android:layout_height="5dp"

        android:background="#990033"

        /> 

    <android.support.v4.view.ViewPager 

        android:id="@+id/viewpager"

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

        android:flipInterval="30"

        android:persistentDrawingCache="animation"/>

</LinearLayout>

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

public class MainActivity extends FragmentActivity{

     private ViewPager
mPager; 

        private ArrayList<Fragment>
fragmentList; 

        private TextView
barText; 

        private TextView
view1, view2, view3, view4; 

        private int currIndex;//当前页卡编号

        protected void onCreate(Bundle
savedInstanceState) { 

            super.onCreate(savedInstanceState); 

            setContentView(R.layout.main); 

            InitTextView(); 

            InitTextBar(); 

            InitViewPager(); 

        } 

         //
初始化标签名

        public void InitTextView(){ 

            view1
= (TextView)findViewById(R.id.tv_guid1); 

            view2
= (TextView)findViewById(R.id.tv_guid2); 

            view3
= (TextView)findViewById(R.id.tv_guid3); 

            view4
= (TextView)findViewById(R.id.tv_guid4); 

            view1.setOnClickListener(new txListener(0)); 

            view2.setOnClickListener(new txListener(1)); 

            view3.setOnClickListener(new txListener(2)); 

            view4.setOnClickListener(new txListener(3)); 

        } 

        public class txListener implements View.OnClickListener{ 

            private int index=0; 

            public txListener(int i)
{ 

                index
=i; 

            } 

            @Override

            public void onClick(View
v) { 

                mPager.setCurrentItem(index); 

            } 

        } 

        //
初始化标签卡的位移像素

        public void InitTextBar(){ 

            barText
= (TextView) super.findViewById(R.id.cursor);

            Display
display = getWindow().getWindowManager().getDefaultDisplay();

                      //
得到屏幕的宽度

            DisplayMetrics
metrics = new DisplayMetrics();

            display.getMetrics(metrics);

                      //
1/3得到屏幕

            int  tabLineLength
= metrics.widthPixels / 4;

             LayoutParams
lp = (LayoutParams) barText.getLayoutParams();

             lp.width
= tabLineLength;

             barText.setLayoutParams(lp);

        } 

         //
初始化ViewPager

        public void InitViewPager(){ 

            mPager
= (ViewPager)findViewById(R.id.viewpager); 

            fragmentList
= new ArrayList<Fragment>(); 

            Fragment
btFragment= new ButtonFragment(); 

            Fragment
secondFragment = TestFragment.newInstance("this
is second fragment"); 

            Fragment
thirdFragment = TestFragment.newInstance("this
is third fragment"); 

            Fragment
fourthFragment = TestFragment.newInstance("this
is fourth fragment"); 

            fragmentList.add(btFragment); 

            fragmentList.add(secondFragment); 

            fragmentList.add(thirdFragment); 

            fragmentList.add(fourthFragment); 

              //给ViewPager设置适配器 

            mPager.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager(),
fragmentList)); 

            mPager.setCurrentItem(0);//设置当前显示标签页为第一页

            mPager.setOnPageChangeListener(new MyOnPageChangeListener());//页面变化时的监听器

        } 

        public class MyOnPageChangeListener implements OnPageChangeListener{ 

            public void onPageScrolled(int arg0, float arg1, int arg2)
{ 

                  //取得该控件的实例

                LinearLayout.LayoutParams
ll = (android.widget.LinearLayout.LayoutParams) barText

                        .getLayoutParams();

                if(currIndex
== arg0){

                     ll.leftMargin
= (int)
(currIndex * barText.getWidth() + arg1

                             *
barText.getWidth());

                }else if(currIndex
> arg0){

                     ll.leftMargin
= (int)
(currIndex * barText.getWidth() - (1 -
arg1)* barText.getWidth());

                }

                barText.setLayoutParams(ll);

            } 

            public void onPageScrollStateChanged(int arg0)
{ 

            } 

            public void onPageSelected(int arg0)
{ 

                currIndex
= arg0;  

                int i
= currIndex + 1; 

                Toast.makeText(MainActivity.this, "您选择了第"+i+"个页卡",
Toast.LENGTH_SHORT).show(); 

            } 

        } 

}

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

public class MyFragmentPagerAdapter extends FragmentPagerAdapter
{

    ArrayList<Fragment>
list;

    public MyFragmentPagerAdapter(FragmentManager
fm, ArrayList<Fragment> list) {

        super(fm);

        this.list
= list;

    }

    public int getCount()
{

        return list.size();

    }

    public Fragment
getItem(int arg0)
{

        return list.get(arg0);

    }

}

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

public class ButtonFragment extends Fragment
{

    Button
myButton;

    public View
onCreateView(LayoutInflater inflater, ViewGroup container,

            Bundle
savedInstanceState) {

        View
rootView = inflater.inflate(R.layout.guide_1, container, false);//
关联布局文件

        myButton
= (Button) rootView.findViewById(R.id.mybutton);//
根据rootView找到button

        myButton.setOnClickListener(new View.OnClickListener()
{

            public void onClick(View
v) {

                Toast.makeText(ButtonFragment.this.getActivity(),

                        "button
is click!",
Toast.LENGTH_SHORT).show();

            }

        });

        return rootView;

    }

}