ViewPager+Fragment实现侧滑导航栏

1

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

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

package com.example.administrator.android006;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentActivity;

import android.support.v4.app.FragmentPagerAdapter;

import android.support.v4.view.ViewPager;

import android.support.v7.app.AppCompatActivity;

import android.view.View;

import android.widget.ImageButton;

import android.widget.ImageView;

import android.widget.LinearLayout;

import com.example.administrator.android006.Fragment.fragment1;

import com.example.administrator.android006.Fragment.fragment2;

import com.example.administrator.android006.Fragment.fragment3;

import com.example.administrator.android006.Fragment.fragment4;

import java.util.ArrayList;

import java.util.List;

public class MainActivity extends FragmentActivity implements View.OnClickListener {

    //顶部4个按钮

    private LinearLayout main_home_layout,main_msg_layout,main_pal_layout,main_me_layout;

    private ViewPager main_mViewPager;

    //ViewPager的适配器

    private FragmentPagerAdapter mAdapter;

    //4个Fragment碎片的集合

    private List<Fragment> mFragments = new ArrayList<>();

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        //初始化，加载碎片

        initView();

        initAdapter();

    }

    public void initAdapter(){

        mAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {

            @Override

            public Fragment getItem(int position) {

                return mFragments.get(position);

            }

            @Override

            public int getCount() {

                return mFragments.size();

            }

        };

        main_mViewPager.setAdapter(mAdapter);

        main_mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override

            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override

            public void onPageSelected(int position) {

                //重置ImageView的颜色

                resetImg();

                //设置选中时的图片

                switch (position) {

                    case 0:

                        ((ImageView) main_home_layout.findViewById(R.id.main_home_img))

                                .setImageResource(R.drawable.home_black);

                        break;

                    case 1:

                        ((ImageView) main_msg_layout.findViewById(R.id.main_msg_img))

                                .setImageResource(R.drawable.msg_black);

                        break;

                    case 2:

                        ((ImageView) main_pal_layout.findViewById(R.id.main_pal_img))

                                .setImageResource(R.drawable.pal_black);

                        break;

                    case 3:

                        ((ImageView) main_me_layout.findViewById(R.id.main_me_img))

                                .setImageResource(R.drawable.me_black);

                        break;

                }

            }

            @Override

            public void onPageScrollStateChanged(int state) {

            }

        });

    }

    //重置ImageView的图片

    protected void resetImg(){

        ((ImageView) main_home_layout.findViewById(R.id.main_home_img))

                .setImageResource(R.drawable.home_gray);

        ((ImageView) main_msg_layout.findViewById(R.id.main_msg_img))

                .setImageResource(R.drawable.msg_gray);

        ((ImageView) main_pal_layout.findViewById(R.id.main_pal_img))

                .setImageResource(R.drawable.pal_gray);

        ((ImageView) main_me_layout.findViewById(R.id.main_me_img))

                .setImageResource(R.drawable.me_gray);

    }

    public void initView(){

        main_home_layout = findViewById(R.id.main_home_layout);

        main_msg_layout = findViewById(R.id.main_msg_layout);

        main_pal_layout = findViewById(R.id.main_pal_layout);

        main_me_layout = findViewById(R.id.main_me_layout);

        main_mViewPager = findViewById(R.id.main_mViewPager);

        fragment1 vp_fr1 = new fragment1();

        fragment2 vp_fr2 = new fragment2();

        fragment3 vp_fr3 = new fragment3();

        fragment4 vp_fr4 = new fragment4();

        mFragments.add(vp_fr1);

        mFragments.add(vp_fr2);

        mFragments.add(vp_fr3);

        mFragments.add(vp_fr4);

        main_home_layout.setOnClickListener(this);

        main_msg_layout.setOnClickListener(this);

        main_pal_layout.setOnClickListener(this);

        main_me_layout.setOnClickListener(this);

    }

    @Override

    public void onClick(View view) {

        switch (view.getId()) {

            //点击首页时,设置ViewPager的下标为0

            case R.id.main_home_layout:

                main_mViewPager.setCurrentItem(0);

                break;

            //点击消息时,设置ViewPager的下标为1

            case R.id.main_msg_layout:

                main_mViewPager.setCurrentItem(1);

                break;

            //点击好友时,设置ViewPager的下标为2

            case R.id.main_pal_layout:

                main_mViewPager.setCurrentItem(2);

                break;

            //点击我时,设置ViewPager的下标为3

            case R.id.main_me_layout:

                main_mViewPager.setCurrentItem(3);

                break;

        }

    }

}

1

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

98

99

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

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

    android:orientation="vertical" android:layout_width="match_parent"

    android:layout_height="match_parent">

    <LinearLayout

        android:layout_width="match_parent"

        android:layout_height="50dp"

        android:orientation="horizontal"

        >

        <LinearLayout

            android:id="@+id/main_home_layout"

            android:layout_width="0dp"

            android:layout_height="match_parent"

            android:layout_weight="1"

            android:orientation="vertical"

            android:gravity="center"

            >

            <ImageView

                android:id="@+id/main_home_img"

                android:layout_width="30dp"

                android:layout_height="30dp"

                android:src="@drawable/home_black"

                android:scaleType="fitXY"

                />

            <TextView

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="首页"

                />

        </LinearLayout>

        <LinearLayout

            android:id="@+id/main_msg_layout"

            android:layout_width="0dp"

            android:layout_height="match_parent"

            android:layout_weight="1"

            android:orientation="vertical"

            android:gravity="center"

            >

            <ImageView

                android:id="@+id/main_msg_img"

                android:layout_width="30dp"

                android:layout_height="30dp"

                android:src="@drawable/msg_gray"

                />

            <TextView

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="消息"

                />

        </LinearLayout>

        <LinearLayout

            android:id="@+id/main_pal_layout"

            android:layout_width="0dp"

            android:layout_height="match_parent"

            android:layout_weight="1"

            android:orientation="vertical"

            android:gravity="center"

            >

            <ImageView

                android:id="@+id/main_pal_img"

                android:layout_width="30dp"

                android:layout_height="30dp"

                android:src="@drawable/pal_gray"

                />

            <TextView

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="好友"

                />

        </LinearLayout>

        <LinearLayout

            android:id="@+id/main_me_layout"

            android:layout_width="0dp"

            android:layout_height="match_parent"

            android:layout_weight="1"

            android:orientation="vertical"

            android:gravity="center"

            >

            <ImageView

                android:id="@+id/main_me_img"

                android:layout_width="30dp"

                android:layout_height="30dp"

                android:src="@drawable/me_gray"

                />

            <TextView

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="我"

                />

        </LinearLayout>

    </LinearLayout>

    <android.support.v4.view.ViewPager

        android:id="@+id/main_mViewPager"

        android:layout_width="match_parent"

        android:layout_height="match_parent">

    </android.support.v4.view.ViewPager>

</LinearLayout>

1

2

3

4

5

6

7

public class fragment1 extends Fragment {

    @Nullable

    @Override

    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

        return inflater.inflate(R.layout.fragment1,container,false);

    }

}

1

2

3

4

5

6

7

8

9

10

11

12

13

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

<android.support.constraint.ConstraintLayout

    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"

    android:layout_height="match_parent">

    <TextView

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:gravity="center"

        android:text="我是Fragment1"

        />

</android.support.constraint.ConstraintLayout>