下面是安卓開發仿微信界面的代碼。
分為3步，
第一步是界面的編寫;
第二步是導航界面;
第三步是右上角菜單欄。
開始第一步前先預覽一下效果。
第一步，界面。
界面的思路是利用ViewPager+Fragment實現，所以activity_main.xml中添加一個ViewPager。頂部和底部include的頂部欄和底部欄后面再說。
MainActivity的界面activity_main.xml:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<?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"> <include layout="@layout/layout_main_top" /> <android.support.v4.view.ViewPager android:id="@+id/vp_mainvp" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1"> </android.support.v4.view.ViewPager> <TextView android:layout_width="match_parent" android:layout_height="0.5dp" android:background="#737373" /> <TextView android:layout_width="match_parent" android:layout_height="0.7dp" android:background="#101010" /> <include layout="@layout/layout_main_bottom" /></LinearLayout> |
當然，要用到ViewPager+Fragment就要建立Fragment，如圖我建了三個Fragment，這個可以根據需要自己創建。
這三個Fragment很類似，這里寫出一個，其他以此類推。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
package activity;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import com.chase.cn.money_of_my.R;/** * Created by Chase on 2017/2/6. */public class Fragment_tab01 extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View tab01 = inflater.inflate(R.layout.fragment_tab01_home,container,false); return tab01; }} |
此Fragment對應的xml文件：
|
1
2
3
4
5
6
7
|
<?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> |
現在回到MainActivity中：
|
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
|
package activity;import ...public class MainActivity extends FragmentActivity { private ViewPager mViewPager; private MyFragmentPagerAdapter mAdapter; private List<Fragment> fragmentList; //保存界面的view @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); StatusBarUtil.setWindowStatusBarColor(this, R.color.colorTitleGray); initViews(); initDatas(); } /** * 數據初始化 */ private void initDatas() { //fragment數據源 fragmentList = new ArrayList<Fragment>(); fragmentList.add(new Fragment_tab01()); fragmentList.add(new Fragment_tab02()); fragmentList.add(new Fragment_tab03()); mAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList); mViewPager.setAdapter(mAdapter); } /** * 初始化控件 */ private void initViews() { mViewPager = (ViewPager) findViewById(R.id.vp_mainvp); }} |
需要編寫一個ViewPager的Adapter：
|
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
|
package utils;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;import java.util.List;/** * Created by Chase on 2017/2/6. */public class MyFragmentPagerAdapter extends FragmentPagerAdapter { private List<Fragment> fragList; private List<String> tabList; public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> fragList) { super(fm); this.fragList = fragList; } @Override public CharSequence getPageTitle(int position) { return tabList.get(position); } @Override public Fragment getItem(int position) { return fragList.get(position); } @Override public int getCount() { return fragList.size(); }} |
現在三個Fragment已經添加到了MainActivity中，滑動ViewPager切換Fragment，同時底部的導航欄也會切換，在為ViewPager添加監聽以前，先說說底部導航欄。
第二步，底部導航。
這個的切換其實就是切換準備好的png圖片和改變文字的顏色。
下面是剛才導入的底部導航欄xml文件：
|
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
|
<?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="52dp" android:orientation="horizontal"> <LinearLayout android:alpha="30" android:id="@+id/ll_taball" android:layout_width="match_parent" android:layout_height="52dp" android:background="#656d78" android:orientation="horizontal"> <FrameLayout android:id="@+id/fl_page_home" android:layout_width="wrap_content" android:layout_height="57dp" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <Button android:id="@+id/bt_page_home" android:layout_width="35dp" android:layout_height="35dp" android:layout_gravity="center_horizontal" android:background="@drawable/home_pressed" android:clickable="false" /> <TextView android:id="@+id/tv_page_home" android:textColor="#ffd100" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="32dp" android:text="首頁" /> </FrameLayout> <FrameLayout android:id="@+id/fl_page_budget" android:layout_width="wrap_content" android:layout_height="57dp" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <Button android:id="@+id/bt_page_budget" android:layout_width="35dp" android:layout_height="35dp" android:layout_gravity="center_horizontal" android:background="@drawable/budget" android:clickable="false" /> <TextView android:textColor="#383838" android:id="@+id/tv_page_budget" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="32dp" android:text="記賬" /> </FrameLayout> <FrameLayout android:id="@+id/fl_page_more" android:layout_width="wrap_content" android:layout_height="57dp" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <Button android:id="@+id/bt_page_more" android:layout_width="35dp" android:layout_height="35dp" android:layout_gravity="center_horizontal" android:background="@drawable/more" android:clickable="false" /> <TextView android:id="@+id/tv_page_more" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="32dp" android:text="更多" /> </FrameLayout> </LinearLayout></LinearLayout> |
繼續回到對應的MainActivity：并加入了按兩次回退鍵退出程序。
|
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
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
|
package activity;import ...public class MainActivity extends FragmentActivity implements View.OnClickListener { private ViewPager mViewPager; private MyFragmentPagerAdapter mAdapter; private List<Fragment> fragmentList; //保存界面的view private FrameLayout fl_page_home, fl_page_budget, fl_page_more; private LinearLayout ll_taball; private Button bt_page_home, bt_page_budget, bt_page_more; private TextView tv_page_home; private TextView tv_page_budget; private TextView tv_page_more; private TextView tv_top_title; //onkeydown_ private static boolean isQuit = false; private Timer timer = new Timer(); //onResult的碼 private static final int addActivityRequestCodeOfPage2 = 0,addActivityRequestCodeOfPage1=1; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); StatusBarUtil.setWindowStatusBarColor(this, R.color.colorTitleGray); initViews(); setViewPagerEvent(); initEvents(); initDatas(); } @Override protected void onRestart() { super.onRestart(); } /** * viewPager切換頁面的事件 */ private void setViewPagerEvent() { //設置viewpager的page監聽換bottom按鈕顏色 mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageSelected(int position) { int currentItem = mViewPager.getCurrentItem(); switch (currentItem) { case 0: resetImgAndTextColorAndButton(); bt_page_home.setBackgroundResource(R.drawable.home_pressed); tv_page_home.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("首頁"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_main_top_menu); break; case 1: resetImgAndTextColorAndButton(); bt_page_budget.setBackgroundResource(R.drawable.budget_pressed); tv_page_budget.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("記錄"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_add_button); break; case 2: resetImgAndTextColorAndButton(); bt_page_more.setBackgroundResource(R.drawable.more_pressed); tv_page_more.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("更多"); bt_add.setVisibility(View.INVISIBLE); break; default: break; } } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageScrollStateChanged(int state) { } }); } /** * 數據初始化 */ private void initDatas() { //fragment數據源 fragmentList = new ArrayList<Fragment>(); fragmentList.add(new Fragment_tab01()); fragmentList.add(new Fragment_tab02()); fragmentList.add(new Fragment_tab03()); mAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList); mViewPager.setAdapter(mAdapter); } /** * 初始化事件 */ private void initEvents() { fl_page_home.setOnClickListener(this); fl_page_budget.setOnClickListener(this); fl_page_more.setOnClickListener(this); bt_add.setOnClickListener(this); } /** * 初始化控件 */ private void initViews() { mViewPager = (ViewPager) findViewById(R.id.vp_mainvp); //底部的布局 fl_page_home = (FrameLayout) findViewById(R.id.fl_page_home); fl_page_budget = (FrameLayout) findViewById(R.id.fl_page_budget); fl_page_more = (FrameLayout) findViewById(R.id.fl_page_more); //底部的按鈕 bt_page_home = (Button) findViewById(R.id.bt_page_home); bt_page_budget = (Button) findViewById(R.id.bt_page_budget); bt_page_more = (Button) findViewById(R.id.bt_page_more); //按鈕對應文字的顏色 tv_page_home = (TextView) findViewById(R.id.tv_page_home); tv_page_budget = (TextView) findViewById(R.id.tv_page_budget); tv_page_more = (TextView) findViewById(R.id.tv_page_more); //頂部狀態欄文字 tv_top_title = (TextView) findViewById(R.id.tv_top_title); ll_taball = (LinearLayout) findViewById(R.id.ll_taball); //記一筆按鈕 bt_add = (Button) findViewById(R.id.bt_add); bt_add.setVisibility(View.VISIBLE); } /** * 點擊下面的布局按鈕事件 * * @param v */ @Override public void onClick(View v) { resetImgAndTextColorAndButton(); switch (v.getId()) { /** * 底部導航欄按鈕 */ case R.id.fl_page_home: mViewPager.setCurrentItem(0);//如果首頁 切換首頁 bt_page_home.setBackgroundResource(R.drawable.home_pressed);//并將按鈕顏色點亮 tv_page_home.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("首頁"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_main_top_menu); break; case R.id.fl_page_budget: mViewPager.setCurrentItem(1); bt_page_budget.setBackgroundResource(R.drawable.budget_pressed); tv_page_budget.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("記錄"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_add_button); break; case R.id.fl_page_more: mViewPager.setCurrentItem(2); bt_page_more.setBackgroundResource(R.drawable.more_pressed); tv_page_more.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("更多"); bt_add.setVisibility(View.INVISIBLE); break; default: break; } } /** * 設置所有圖片暗色和文字 */ private void resetImgAndTextColorAndButton() { bt_page_home.setBackgroundResource(R.drawable.home); bt_page_budget.setBackgroundResource(R.drawable.budget); bt_page_more.setBackgroundResource(R.drawable.more); tv_page_home.setTextColor(Color.rgb(56, 56, 56)); tv_page_budget.setTextColor(Color.rgb(56, 56, 56)); tv_page_more.setTextColor(Color.rgb(56, 56, 56)); } /** * 回退按鈕兩次退出 */ @Override public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK) { if (isQuit == false) { isQuit = true; ToastUtil.showToast(getApplicationContext(), "請按兩次回退鍵退出", 3000); TimerTask task = null; task = new TimerTask() { @Override public void run() { isQuit = false; } }; timer.schedule(task, 2000); } else { finish(); System.exit(0); } } return true; }@Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == addActivityRequestCodeOfPage2) { mViewPager.setCurrentItem(1); bt_page_budget.setBackgroundResource(R.drawable.budget_pressed); tv_page_budget.setTextColor(Color.rgb(255, 209, 0)); }else if (requestCode==addActivityRequestCodeOfPage1){ bt_page_home.setBackgroundResource(R.drawable.home_pressed); tv_page_home.setTextColor(Color.rgb(255, 209, 0)); } }} |
最后加入的onActivityResult是對應如下情況，如果在某個Fragment中對應進去了其他的Activity時，返回以后導航欄是沒有之前的顯示的，所以如下就要返回原來的顯示。
|
1
2
3
4
5
6
7
8
9
10
11
12
|
@Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == addActivityRequestCodeOfPage2) { mViewPager.setCurrentItem(1); bt_page_budget.setBackgroundResource(R.drawable.budget_pressed); tv_page_budget.setTextColor(Color.rgb(255, 209, 0)); }else if (requestCode==addActivityRequestCodeOfPage1){ bt_page_home.setBackgroundResource(R.drawable.home_pressed); tv_page_home.setTextColor(Color.rgb(255, 209, 0)); } } |
第三步，頂部右上角菜單。
之前導入頂部欄的xml文件：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="43dp" android:background="@color/colorTitleGray"> <TextView android:id="@+id/tv_top_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_gravity="center" android:text="首頁" android:textColor="@color/ccd1d9white" android:textSize="20sp" /> <Button android:layout_marginRight="8dp" android:layout_width="28dp" android:layout_height="28dp" android:background="@drawable/selector_main_top_menu" android:layout_centerVertical="true" android:layout_alignParentEnd="true" android:id="@+id/bt_add" /></RelativeLayout> |
對應菜單我們使用PopupWindow 。
|
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
|
package views;import .../** * Created by Chase on 2017/2/23. */public class TopPopWindow extends PopupWindow { private View mView; private LinearLayout ll_popmenu_record,ll_popmenu_book,ll_popmenu_search; public TopPopWindow(Activity paramActivity, View.OnClickListener paramOnClickListener, int paramInt1, int paramInt2){ mView = LayoutInflater.from(paramActivity).inflate(R.layout.popwindow_topright, null); ll_popmenu_record = (LinearLayout) mView.findViewById(R.id.ll_popmenu_record); ll_popmenu_book = (LinearLayout) mView.findViewById(R.id.ll_popmenu_book); ll_popmenu_search = (LinearLayout) mView.findViewById(R.id.ll_popmenu_search); if (paramOnClickListener != null){ //設置點擊監聽 ll_popmenu_record.setOnClickListener(paramOnClickListener); ll_popmenu_book.setOnClickListener(paramOnClickListener); ll_popmenu_search.setOnClickListener(paramOnClickListener); setContentView(mView); //設置寬度 setWidth(paramInt1); //設置高度 setHeight(paramInt2); //設置顯示隱藏動畫 setAnimationStyle(R.style.AnimTools); //設置背景透明 setBackgroundDrawable(new ColorDrawable(0)); } } } |
編寫PopupWindow 的xml:
|
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
|
<?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:layout_marginRight="5dp" android:layout_marginTop="20dp" android:background="@drawable/popmenu" android:orientation="vertical"> <LinearLayout android:id="@+id/ll_popmenu_record" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="8dp" android:paddingLeft="10dp" android:gravity="center_vertical" android:orientation="horizontal"> <ImageView android:layout_width="25dp" android:layout_height="25dp" android:src="@mipmap/add" /> <TextView android:textColor="#aab2bd" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:gravity="center_vertical" android:text="記一筆" android:textSize="20sp" /> </LinearLayout> <TextView android:layout_width="match_parent" android:layout_height="0.7dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="#aab2bd" /> <LinearLayout android:id="@+id/ll_popmenu_book" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:layout_marginTop="8dp" android:gravity="center_vertical" android:orientation="horizontal" android:layout_marginBottom="8dp"> <ImageView android:layout_width="25dp" android:layout_height="25dp" android:src="@mipmap/book" /> <TextView android:textColor="#aab2bd" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:gravity="center_vertical" android:text="賬本切換" android:textSize="20sp" /> </LinearLayout> <TextView android:layout_width="match_parent" android:layout_height="0.7dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="#aab2bd" /> <LinearLayout android:id="@+id/ll_popmenu_search" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:layout_marginTop="8dp" android:gravity="center_vertical" android:orientation="horizontal"> <ImageView android:layout_width="25dp" android:layout_height="25dp" android:src="@mipmap/search" /> <TextView android:textColor="#aab2bd" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:gravity="center_vertical" android:text="搜索賬本" android:textSize="20sp" /> </LinearLayout></LinearLayout> |
回到MainActivity：
|
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
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
|
package activity;import android.content.Intent;import android.graphics.Color;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.support.v4.view.ViewPager;import android.view.KeyEvent;import android.view.View;import android.widget.Button;import android.widget.FrameLayout;import android.widget.LinearLayout;import android.widget.TextView;import com.chase.cn.money_of_my.R;import java.util.ArrayList;import java.util.List;import java.util.Timer;import java.util.TimerTask;import utils.MyFragmentPagerAdapter;import utils.StatusBarUtil;import utils.ToastUtil;import views.TopPopWindow;public class MainActivity extends FragmentActivity implements View.OnClickListener { private ViewPager mViewPager; private MyFragmentPagerAdapter mAdapter; private List<Fragment> fragmentList; //保存界面的view private FrameLayout fl_page_home, fl_page_budget, fl_page_more; private LinearLayout ll_taball; private Button bt_page_home, bt_page_budget, bt_page_more; private Button bt_add; private TextView tv_page_home; private TextView tv_page_budget; private TextView tv_page_more; private TextView tv_top_title; //onkeydown_ private static boolean isQuit = false; private Timer timer = new Timer(); //onResult的碼 private static final int addActivityRequestCodeOfPage2 = 0,addActivityRequestCodeOfPage1=1; private TopPopWindow topPopWindow; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); StatusBarUtil.setWindowStatusBarColor(this, R.color.colorTitleGray); initViews(); setViewPagerEvent(); initEvents(); initDatas(); } @Override protected void onRestart() { super.onRestart(); } /** * viewPager切換頁面的事件 */ private void setViewPagerEvent() { //設置viewpager的page監聽換bottom按鈕顏色 mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageSelected(int position) { int currentItem = mViewPager.getCurrentItem(); switch (currentItem) { case 0: resetImgAndTextColorAndButton(); bt_page_home.setBackgroundResource(R.drawable.home_pressed); tv_page_home.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("首頁"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_main_top_menu); break; case 1: resetImgAndTextColorAndButton(); bt_page_budget.setBackgroundResource(R.drawable.budget_pressed); tv_page_budget.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("記錄"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_add_button); break; case 2: resetImgAndTextColorAndButton(); bt_page_more.setBackgroundResource(R.drawable.more_pressed); tv_page_more.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("更多"); bt_add.setVisibility(View.INVISIBLE); break; default: break; } } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageScrollStateChanged(int state) { } }); } /** * 數據初始化 */ private void initDatas() { //fragment數據源 fragmentList = new ArrayList<Fragment>(); fragmentList.add(new Fragment_tab01()); fragmentList.add(new Fragment_tab02()); fragmentList.add(new Fragment_tab03()); mAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList); mViewPager.setAdapter(mAdapter); } /** * 初始化事件 */ private void initEvents() { fl_page_home.setOnClickListener(this); fl_page_budget.setOnClickListener(this); fl_page_more.setOnClickListener(this); bt_add.setOnClickListener(this); } /** * 初始化控件 */ private void initViews() { mViewPager = (ViewPager) findViewById(R.id.vp_mainvp); //底部的布局 fl_page_home = (FrameLayout) findViewById(R.id.fl_page_home); fl_page_budget = (FrameLayout) findViewById(R.id.fl_page_budget); fl_page_more = (FrameLayout) findViewById(R.id.fl_page_more); //底部的按鈕 bt_page_home = (Button) findViewById(R.id.bt_page_home); bt_page_budget = (Button) findViewById(R.id.bt_page_budget); bt_page_more = (Button) findViewById(R.id.bt_page_more); //按鈕對應文字的顏色 tv_page_home = (TextView) findViewById(R.id.tv_page_home); tv_page_budget = (TextView) findViewById(R.id.tv_page_budget); tv_page_more = (TextView) findViewById(R.id.tv_page_more); //頂部狀態欄文字 tv_top_title = (TextView) findViewById(R.id.tv_top_title); ll_taball = (LinearLayout) findViewById(R.id.ll_taball); //記一筆按鈕 bt_add = (Button) findViewById(R.id.bt_add); bt_add.setVisibility(View.VISIBLE); } /** * 點擊下面的布局按鈕事件 * * @param v */ @Override public void onClick(View v) { resetImgAndTextColorAndButton(); switch (v.getId()) { /** * 底部導航欄按鈕 */ case R.id.fl_page_home: mViewPager.setCurrentItem(0);//如果首頁 切換首頁 bt_page_home.setBackgroundResource(R.drawable.home_pressed);//并將按鈕顏色點亮 tv_page_home.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("首頁"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_main_top_menu); break; case R.id.fl_page_budget: mViewPager.setCurrentItem(1); bt_page_budget.setBackgroundResource(R.drawable.budget_pressed); tv_page_budget.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("記錄"); bt_add.setVisibility(View.VISIBLE); bt_add.setBackgroundResource(R.drawable.selector_add_button); break; case R.id.fl_page_more: mViewPager.setCurrentItem(2); bt_page_more.setBackgroundResource(R.drawable.more_pressed); tv_page_more.setTextColor(Color.rgb(255, 209, 0)); tv_top_title.setText("更多"); bt_add.setVisibility(View.INVISIBLE); break; /** * 記一筆按鈕 */ case R.id.bt_add: if (mViewPager.getCurrentItem() == 1) { Intent intent_add_activity = new Intent(getApplicationContext(), AddRecorderActivity.class); startActivityForResult(intent_add_activity, addActivityRequestCodeOfPage2); } else { bt_page_home.setBackgroundResource(R.drawable.home_pressed);//并將按鈕顏色點亮 tv_page_home.setTextColor(Color.rgb(255, 209, 0)); showTopRightPopMenu(); } break; /** * popwindow引入的方法的onclick的listener引入到this * popwindow的點擊事件 */ case R.id.ll_popmenu_record: Intent intent_add_activity = new Intent(getApplicationContext(), AddRecorderActivity.class); startActivityForResult(intent_add_activity,addActivityRequestCodeOfPage1); topPopWindow.dismiss(); break; case R.id.ll_popmenu_book: ToastUtil.showSucceccToast(getApplicationContext(), "success12", 3000); break; case R.id.ll_popmenu_search: ToastUtil.showSucceccToast(getApplicationContext(), "success13", 3000); break; default: break; } } /** * 顯示右上角popup菜單 */ private void showTopRightPopMenu() { if (topPopWindow == null) { //(activity,onclicklistener,width,height) topPopWindow = new TopPopWindow(MainActivity.this, this, 360, 290); //監聽窗口的焦點事件，點擊窗口外面則取消顯示 topPopWindow.getContentView().setOnFocusChangeListener(new View.OnFocusChangeListener() { @Override public void onFocusChange(View v, boolean hasFocus) { if (!hasFocus) { topPopWindow.dismiss(); } } }); } //設置默認獲取焦點 topPopWindow.setFocusable(true); //以某個控件的x和y的偏移量位置開始顯示窗口 topPopWindow.showAsDropDown(bt_add, 0, 0); //如果窗口存在，則更新 topPopWindow.update(); } /** * 設置所有圖片暗色和文字 */ private void resetImgAndTextColorAndButton() { bt_page_home.setBackgroundResource(R.drawable.home); bt_page_budget.setBackgroundResource(R.drawable.budget); bt_page_more.setBackgroundResource(R.drawable.more); tv_page_home.setTextColor(Color.rgb(56, 56, 56)); tv_page_budget.setTextColor(Color.rgb(56, 56, 56)); tv_page_more.setTextColor(Color.rgb(56, 56, 56)); } /** * 回退按鈕兩次退出 */ @Override public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK) { if (isQuit == false) { isQuit = true; ToastUtil.showToast(getApplicationContext(), "請按兩次回退鍵退出", 3000); TimerTask task = null; task = new TimerTask() { @Override public void run() { isQuit = false; } }; timer.schedule(task, 2000); } else { finish(); System.exit(0); } } return true; } @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == addActivityRequestCodeOfPage2) { mViewPager.setCurrentItem(1); bt_page_budget.setBackgroundResource(R.drawable.budget_pressed); tv_page_budget.setTextColor(Color.rgb(255, 209, 0)); }else if (requestCode==addActivityRequestCodeOfPage1){ bt_page_home.setBackgroundResource(R.drawable.home_pressed); tv_page_home.setTextColor(Color.rgb(255, 209, 0)); } }} |
右上角的按鈕還添加了功能，在不同的Fragment中，它的功能不同。
以上就算安卓模仿微信界面的步驟了。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持服務器之家。
原文鏈接：https://blog.csdn.net/Chase_Java/article/details/62890251
