Android Fragment实现button间的切换

原文地址：http://blog.csdn.net/a123demi/article/details/32693037

Fragment要点

Fragment是activity的界面中的一部分或一种行为。

你能够把多个Fragment们组合到一个activity中来创建一个多面界面而且你能够在多个activity中重用一个Fragment。你能够把Fragment觉得模块化的一段activity。它具有自己的生命周期，接收它自己的事件。并能够在activity执行时被加入或删除。

Fragment不能独立存在，它必须嵌入到activity中，并且Fragment的生命周期直接受所在的activity的影响。比如：当activity暂停时，它拥有的全部的Fragment们都暂停了，当activity销毁时，它拥有的全部Fragment们都被销毁。

然而，当activity运行时（在onResume()之后。onPause()之前），你能够单独地操作每一个Fragment，比方加入或删除或替代(add(),remove(),replace())它们。当你在运行上述针对Fragment的事务时。你能够将事务加入到一个棧中。这个栈被activity管理，栈中的每一条都是一个Fragment的一次事务。

有了这个栈，就能够反向运行Fragment的事务，这样就能够在Fragment级支持“返回”键（向后导航）。

而本文简介主要通过点击不同button实现切换相应的fragment的效果。类似用Tab的切换：

主要代码例如以下：

1.project源码显示：

2.编译后效果图

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvYTEyM2RlbWk=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" style="border:none; max-width:100%">

3.切换button布局：activity_bottom_bts.xml切换的button显示在底部

[html] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;"><?

   xmlversionxmlversion="1.0" encoding="utf-8"?>

2. <LinearLayoutxmlns:androidLinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:orientation="horizontal">
6. <Button
7. android:id="@+id/movie_btn"
8. android:layout_width="wrap_content"
9. android:layout_height="wrap_content"
10. android:layout_weight="1"
11. android:gravity="center"
12. android:text="@string/movie"/>
13. <Button
14. android:id="@+id/tv_btn"
15. android:layout_width="wrap_content"
16. android:layout_height="wrap_content"
17. android:layout_weight="1"
18. android:gravity="center"
19. android:text="@string/tv"/>
20. <Button
21. android:id="@+id/anime_btn"
22. android:layout_width="wrap_content"
23. android:layout_height="wrap_content"
24. android:layout_weight="1"
25. android:gravity="center"
26. android:text="@string/anime"/>
27. <Button
28. android:id="@+id/variety_btn"
29. android:layout_width="wrap_content"
30. android:layout_height="wrap_content"
31. android:layout_weight="1"
32. android:gravity="center"
33. android:text="@string/variety" />
34. </LinearLayout></span></span>

4.主界面activity_main.xml

[html] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;"><RelativeLayoutxmlns:androidRelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:paddingBottom="@dimen/activity_vertical_margin"
6. android:paddingLeft="@dimen/activity_horizontal_margin"
7. android:paddingRight="@dimen/activity_horizontal_margin"
8. android:paddingTop="@dimen/activity_vertical_margin"
9. tools:context="com.example.switchfragmentdemo.MainActivity$PlaceholderFragment">
10. <LinearLayout
11. android:id="@+id/button_view_include"
12. android:layout_width="fill_parent"
13. android:layout_height="wrap_content"
14. android:layout_alignParentBottom="true"
15. >
16. <includelayoutincludelayout="@layout/activity_bottom_btns" />
17. </LinearLayout>
18. <FrameLayout
19. android:id="@+id/fragment_content"
20. android:layout_width="match_parent"
21. android:layout_height="fill_parent"
22. android:layout_alignParentTop="true"
23. android:layout_marginBottom="50dp"
24. android:layout_below="@id/button_view_include"
25. >
26. </FrameLayout>
27. </RelativeLayout></span></span>

5.strings.xml

[html] view
plain copy

print

" style="color:rgb(85,85,85); text-decoration:none; border:none; padding:0px; margin:0px 10px 0px 0px; font-size:9px; background-color:inherit">?

1. <span style="font-family:SimSun;"><span style="font-size:18px;"><?xmlversionxmlversion="1.0" encoding="utf-8"?>
2. <resources>
3. <stringnamestringname="app_name">SwitchFragmentDemo</string>
4. <stringnamestringname="hello_world">Hello world!</string>
5. <stringnamestringname="action_settings">Settings</string>
6. <string name="movie">电影</string>
7. <string name="tv">电视剧</string>
8. <string name="anime">动漫</string>
9. <string name="variety">综艺</string>
10. <stringnamestringname="movie_view">这是一个电影界面</string>
11. <string name="tv_view">这是一个电视剧界面</string>
12. <stringnamestringname="anime_view">这是一个动漫界面</string>
13. <stringnamestringname="variety_view">这是一个综艺界面</string>
14. </resources></span></span>

6.主界面实现代码：MainActivity.java

[java] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;">packagecom.example.myandroidswitchbtndemo;
2. importjava.util.ArrayList;
3. importjava.util.List;
4. importandroid.annotation.SuppressLint;
5. importandroid.app.Activity;
6. importandroid.app.FragmentManager;
7. importandroid.app.FragmentTransaction;
8. importandroid.graphics.Color;
9. importandroid.os.Bundle;
10. importandroid.view.Menu;
11. importandroid.view.MenuItem;
12. importandroid.view.View;
13. importandroid.view.View.OnClickListener;
14. importandroid.widget.Button;
15. @SuppressLint("NewApi")
16. public classMainActivity extends Activity implements OnClickListener {
17. private Button movieBtn, tvBtn,animeBtn, varietyBtn;
18. private List<Button> btnList = newArrayList<Button>();
19. private FragmentManager fm;
20. private FragmentTransaction ft;
21. @Override
22. protected void onCreate(BundlesavedInstanceState) {
23. super.onCreate(savedInstanceState);
24. setContentView(R.layout.activity_main);
25. findById();
26. // 進入系統默認為movie
27. fm = getFragmentManager();
28. ft = fm.beginTransaction();
29. setBackgroundColorById(R.id.movie_btn);
30. ft.replace(R.id.fragment_content,new MovieFragment());
31. ft.commit();
32. }
33. private void findById() {
34. movieBtn = (Button)this.findViewById(R.id.movie_btn);
35. tvBtn = (Button)this.findViewById(R.id.tv_btn);
36. animeBtn = (Button) this.findViewById(R.id.anime_btn);
37. varietyBtn = (Button)this.findViewById(R.id.variety_btn);
38. movieBtn.setOnClickListener(this);
39. tvBtn.setOnClickListener(this);
40. animeBtn.setOnClickListener(this);
41. varietyBtn.setOnClickListener(this);
42. btnList.add(movieBtn);
43. btnList.add(tvBtn);
44. btnList.add(animeBtn);
45. btnList.add(varietyBtn);
46. }
47. private void setBackgroundColorById(intbtnId) {
48. for (Button btn : btnList) {
49. if (btn.getId() == btnId){
50. btn.setBackgroundColor(Color.GREEN);
51. }else {
52. btn.setBackgroundColor(Color.BLUE);
53. }
54. }
55. }
56. @Override
57. public boolean onCreateOptionsMenu(Menumenu) {
58. // Inflate the menu; this addsitems to the action bar if it is present.
59. getMenuInflater().inflate(R.menu.main,menu);
60. return true;
61. }
62. @Override
63. public booleanonOptionsItemSelected(MenuItem item) {
64. // Handle action bar item clickshere. The action bar will
65. // automatically handle clicks onthe Home/Up button, so long
66. // as you specify a parentactivity in AndroidManifest.xml.
67. int id = item.getItemId();
68. if (id == R.id.action_settings) {
69. return true;
70. }
71. returnsuper.onOptionsItemSelected(item);
72. }
73. @Override
74. public void onClick(View v) {
75. // TODO Auto-generated methodstub
76. fm = getFragmentManager();
77. ft = fm.beginTransaction();
78. switch (v.getId()) {
79. case R.id.movie_btn:
80. setBackgroundColorById(R.id.movie_btn);
81. ft.replace(R.id.fragment_content,new MovieFragment());
82. break;
83. case R.id.tv_btn:
84. setBackgroundColorById(R.id.tv_btn);
85. ft.replace(R.id.fragment_content,new TVFragment());
86. break;
87. case R.id.anime_btn:
88. setBackgroundColorById(R.id.anime_btn);
89. ft.replace(R.id.fragment_content,new AnimeFragment());
90. break;
91. case R.id.variety_btn:
92. setBackgroundColorById(R.id.variety_btn);
93. ft.replace(R.id.fragment_content,new VarietyFragment());
94. break;
95. default:
96. break;
97. }
98. // 不要忘记提交
99. ft.commit();
100. }
101. }</span></span>

7.电影界面：fragment_movie.xml和MovieFragment.java

[html] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;"><?xml version="1.0"encoding="utf-8"?>
2. <LinearLayoutxmlns:androidLinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:background="#FF00FF"
6. android:orientation="vertical" >
7. <TextView
8. android:id="@+id/movie_tv"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:text="@string/movie_view" />
12. </LinearLayout></span></span>

[java] view
plain copy

print

" style="color:rgb(85,85,85); text-decoration:none; border:none; padding:0px; margin:0px 10px 0px 0px; font-size:9px; background-color:inherit">?

1. <span style="font-family:SimSun;"><span style="font-size:18px;">packagecom.example.myandroidswitchbtndemo;
2. import android.app.Fragment;
3. importandroid.os.Bundle;
4. importandroid.view.LayoutInflater;
5. importandroid.view.View;
6. importandroid.view.ViewGroup;
7. public classMovieFragment extends Fragment {
8. <spanstyle="white-space:pre"> </span>@Override
9. public View onCreateView(LayoutInflater inflater, ViewGroup container,
10. Bundle savedInstanceState) {
11. return inflater.inflate(R.layout.fragment_movie, null);
12. }
13. }</span></span>

8.电视剧界面：fragment_tv.xml和TVFragment.java

[html] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;"><?xmlversionxmlversion="1.0" encoding="utf-8"?>
2. <LinearLayoutxmlns:androidLinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:background="#00FFFF"
6. android:orientation="vertical">
7. <TextView
8. android:id="@+id/tv_tv"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:text="@string/tv_view"
12. />
13. </LinearLayout></span></span>

[java] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;">packagecom.example.myandroidswitchbtndemo;
2. importandroid.os.Bundle;
3. importandroid.app.Fragment;
4. importandroid.view.LayoutInflater;
5. importandroid.view.View;
6. importandroid.view.ViewGroup;
7. public classTVFragment extends Fragment {
8. <spanstyle="white-space:pre"> </span>@Override
9. public View onCreateView(LayoutInflater inflater, ViewGroup container,
10. Bundle savedInstanceState) {
11. return inflater.inflate(R.layout.fragment_tv, null);
12. }
13. }</span></span>

9.动漫界面：fragment_anime和AnimeFragment.java

[html] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;"><?xmlversionxmlversion="1.0" encoding="utf-8"?

   >

2. <LinearLayoutxmlns:androidLinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:background="#00FF00"
6. android:orientation="vertical">
7. <TextView
8. android:id="@+id/anime_tv"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:text="@string/anime_view"
12. />
13. </LinearLayout></span></span>

[java] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;">packagecom.example.myandroidswitchbtndemo;
2. importandroid.os.Bundle;
3. importandroid.annotation.SuppressLint;
4. importandroid.app.Fragment;
5. importandroid.view.LayoutInflater;
6. importandroid.view.View;
7. importandroid.view.ViewGroup;
8. @SuppressLint("NewApi")
9. public classAnimeFragment extends Fragment {
10. <spanstyle="white-space:pre"> </span>@Override
11. public View onCreateView(LayoutInflater inflater, ViewGroup container,
12. Bundle savedInstanceState) {
13. return inflater.inflate(R.layout.fragment_anime, null);
14. }
15. }</span></span>

10.综艺界面：fragment_variety和VarietyFragment

[html] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;"><?xmlversionxmlversion="1.0" encoding="utf-8"?>
2. <LinearLayoutxmlns:androidLinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:background="#FFFF00"
6. android:orientation="vertical">
7. <TextView
8. android:id="@+id/variety_tv"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:text="@string/variety_view"/>
12. </LinearLayout></span></span>

[java] view
plain copy

print?

1. <span style="font-family:SimSun;"><span style="font-size:18px;">packagecom.example.myandroidswitchbtndemo;
2. importandroid.os.Bundle;
3. importandroid.app.Fragment;
4. importandroid.view.LayoutInflater;
5. importandroid.view.View;
6. importandroid.view.ViewGroup;
7. public classVarietyFragment extends Fragment {
8. <spanstyle="white-space:pre"> </span>@Override
9. public View onCreateView(LayoutInflater inflater, ViewGroup container,
10. Bundle savedInstanceState) {
11. return inflater.inflate(R.layout.fragment_variety, null);
12. }
13. }
14. </span></span>

上面为代码的详细实现。

源码下载地址：http://download.csdn.net/detail/a123demi/7524047