这篇文章主要是自己研究如何对底部菜单进行布局,并简单的实现点击不同"按钮"实现图片切换和背景切换的功能,最后通过PopupWindows实现弹出菜单,点击不同按钮能实现不同方法,相当于美图秀秀编辑图片的功能吧!它并没有涉及到Fragment碎片切换页面的功能,因为页面始终显示被处理的图片.这是我初学Android的一篇基础性文章和在线思想笔记,网上有很多更优秀的demo,不过也希望对大家有用~
首先介绍两种方法实现底部菜单点击不同图标显示选中状态的效果.
一. 底部菜单 第一种方法
它显示的效果如下图所示,其中底部菜单布局采用多个LinearLayout进行,点击不同"按钮"可以改变其背景图片.
首先介绍它的activity_main.xml布局：
1.它采用3个RelativeLayout相对布局进行,分别对应标题路径、中间显示图片和底部的菜单栏;
2.底部菜单栏由5个LinearLayout水平布局组成,每一个LinearLayout都由ImageView和TextView组成.
代码如下：
1. <RelativeLayout xmlns:android="http:///apk/res/android"
2. xmlns:tools="http:///tools"
3. android:id="@+id/container"
4. android:layout_width="match_parent"
5. android:layout_height="match_parent"
6. tools:context="com.example.touchimagetest.MainActivity"
7. tools:ignore="MergeRootFrame" >
8. <!-- 顶部路径 -->
9. <RelativeLayout
10. android:id="@+id/MyLayout_top"
11. android:orientation="horizontal"
12. android:layout_width="fill_parent"
13. android:layout_height="40dp"
14. android:layout_alignParentTop="true"
15. android:gravity="center">
16. <TextView
17. android:id="@+id/textView1"
18. android:layout_width="wrap_content"
19. android:layout_height="wrap_content"
20. android:textSize="15sp"
21. android:text="显示图片操作" />
22. </RelativeLayout>
23. <!-- 底部按钮 -->
24. <RelativeLayout
25. android:id="@+id/MyLayout_bottom"
26. android:orientation="horizontal"
27. android:layout_width="fill_parent"
28. android:layout_height="50dp"
29. android:layout_alignParentBottom="true"
30. android:background="@drawable/image_toolbar_bg"
31. android:gravity="center">
32. <LinearLayout
33. android:layout_width="match_parent"
34. android:layout_height="match_parent"
35. android:orientation="horizontal"
36. android:layout_alignParentBottom="true" >
37.
38. <LinearLayout
39. android:id="@+id/layout_watch"
40. android:layout_width="wrap_content"
41. android:layout_height="wrap_content"
42. android:layout_weight="1"
43. android:gravity="center"
44. android:orientation="vertical" >
45. <ImageView
46. android:id="@+id/image_watch"
47. android:layout_width="wrap_content"
48. android:layout_height="wrap_content"
49. android:padding="3dp"
50. android:src="@drawable/tab_watch_btn" />
51. <TextView
52. android:id="@+id/textview_watch"
53. android:layout_width="wrap_content"
54. android:layout_height="wrap_content"
55. android:text="查看"
56. android:textColor="#ffffff"
57. android:textSize="10sp" />
58. </LinearLayout>
59.
60. <LinearLayout
61. android:id="@+id/layout_increase"
62. android:layout_width="wrap_content"
63. android:layout_height="wrap_content"
64. android:layout_weight="1"
65. android:gravity="center"
66. android:orientation="vertical" >
67. <ImageView
68. android:id="@+id/image_increase"
69. android:layout_width="wrap_content"
70. android:layout_height="wrap_content"
71. android:padding="3dp"
72. android:src="@drawable/tab_increase_btn" />
73. <TextView
74. android:id="@+id/textview_increase"
75. android:layout_width="wrap_content"
76. android:layout_height="wrap_content"
77. android:text="增强"
78. android:textColor="#ffffff"
79. android:textSize="10sp" />
80. </LinearLayout>
81.
82. <LinearLayout
83. android:id="@+id/layout_effect"
84. android:layout_width="wrap_content"
85. android:layout_height="wrap_content"
86. android:layout_weight="1"
87. android:gravity="center"
88. android:orientation="vertical" >
89. <ImageView
90. android:id="@+id/image_effect"
91. android:layout_width="wrap_content"
92. android:layout_height="wrap_content"
93. android:padding="3dp"
94. android:src="@drawable/tab_effect_btn" />
95. <TextView
96. android:id="@+id/textview_effect"
97. android:layout_width="wrap_content"
98. android:layout_height="wrap_content"
99. android:text="特效"
100. android:textColor="#ffffff"
101. android:textSize="10sp" />
102. </LinearLayout>
103.
104. <LinearLayout
105. android:id="@+id/layout_frame"
106. android:layout_width="wrap_content"
107. android:layout_height="wrap_content"
108. android:layout_weight="1"
109. android:gravity="center"
110. android:orientation="vertical" >
111. <ImageView
112. android:id="@+id/image_frame"
113. android:layout_width="wrap_content"
114. android:layout_height="wrap_content"
115. android:padding="3dp"
116. android:src="@drawable/tab_frame_btn" />
117. <TextView
118. android:id="@+id/textview_frame"
119. android:layout_width="wrap_content"
120. android:layout_height="wrap_content"
121. android:text="相框"
122. android:textColor="#ffffff"
123. android:textSize="10sp" />
124. </LinearLayout>
125.
126. <LinearLayout
127. android:id="@+id/layout_person"
128. android:layout_width="wrap_content"
129. android:layout_height="wrap_content"
130. android:layout_weight="1"
131. android:gravity="center"
132. android:orientation="vertical" >
133. <ImageView
134. android:id="@+id/image_person"
135. android:layout_width="wrap_content"
136. android:layout_height="wrap_content"
137. android:padding="3dp"
138. android:src="@drawable/tab_person_btn" />
139. <TextView
140. android:id="@+id/textview_person"
141. android:layout_width="wrap_content"
142. android:layout_height="wrap_content"
143. android:text="美白"
144. android:textColor="#ffffff"
145. android:textSize="10sp" />
146. </LinearLayout>
147.
148. </LinearLayout>
149. </RelativeLayout>
150. <!-- 显示图片 -->
151. <RelativeLayout
152. android:id="@+id/Content_Layout"
153. android:orientation="horizontal"
154. android:layout_width="fill_parent"
155. android:layout_height="fill_parent"
156. android:layout_above="@id/MyLayout_bottom"
157. android:layout_below="@id/MyLayout_top"
158. android:background="#EFDFDF"
159. android:gravity="center">
160. <ImageView
161. android:id="@+id/imageView1"
162. android:layout_width="fill_parent"
163. android:layout_height="fill_parent"
164. android:layout_gravity="center_horizontal"
165. android:scaleType="matrix" />
166. </RelativeLayout>
167. </RelativeLayout>此时你需要注意的是为每个LinearLayout中ImageView指定src时并不是原图片,而是drawable中的xml文件,如<ImageView android:id="@+id/image_watch".. />.
同时每个drawable中的xml文件对应每个相应的按钮,上图中effect(效果)、increase(增强)、frame(相框)、watch(查看)、person(美白).其中每个格式基本如下,如tab_watch_btn.xml：
1. <?xml version="1.0" encoding="utf-8"?>
2. <selector xmlns:android="http:///apk/res/android" >
3. <item android:drawable="@drawable/image_icon_watch_sel" android:state_selected="true"/>
4. <item android:drawable="@drawable/image_icon_watch_sel" android:state_pressed="true"/>
5. <item android:drawable="@drawable/image_icon_watch_nor"/>
6. </selector>
其中state_selected表示"选中"状态,state_pressed表示"点击"效果,而最后的<item android:drawable="@drawable/image_icon_watch_nor"/> 表示默认情况显示图片,原图片如下：
同时设置选中状态"按钮"的背景加黑效果,在drawable中添加selector_tab_background.xml文件:
1. <?xml version="1.0" encoding="utf-8"?>
2. <selector xmlns:android="http:///apk/res/android" >
3. <item android:drawable="@drawable/image_home_layout_bg" android:state_pressed="true"/>
4. <item android:drawable="@drawable/image_home_layout_bg" android:state_selected="true"/>
5. </selector>然后在MainActivity.java中添加自定义变量,主要是LinearLayout(点击它响应事件)和ImageView(切换图标).
1. //自定义变量
2. private LinearLayout layoutWatch; //查看图片
3. private LinearLayout layoutIncrease; //增强图片
4. private LinearLayout layoutEffect; //图片特效
5. private LinearLayout layoutFrame; //图片边框
6. private LinearLayout layoutPerson; //图片美白
7.
8. private
9. private
10. private
11. private
12. private然后添加代码如下,该种方法需要在点击按钮中设置其他LinearLayout图标状态为未选择状态,否则会出现点击按钮的效果(即:点击就切换图标一次,我们需要的是点击就状态长显).
1. //创建活动
2. @Override
3. protected void
4. super.onCreate(savedInstanceState);
5. setContentView(R.layout.activity_main);
6. //布局
7. layoutWatch = (LinearLayout) findViewById(.layout_watch);
8. layoutIncrease = (LinearLayout) findViewById(.layout_increase);
9. layoutEffect = (LinearLayout) findViewById(.layout_effect);
10. layoutFrame = (LinearLayout) findViewById(.layout_frame);
11. layoutPerson = (LinearLayout) findViewById(.layout_person);
12. //图标
13. imageWatch = (ImageView) findViewById(.image_watch);
14. imageIncrease = (ImageView) findViewById(.image_increase);
15. imageEffect = (ImageView) findViewById(.image_effect);
16. imageFrame = (ImageView) findViewById(.image_frame);
17. imagePerson = (ImageView) findViewById(.image_person);
18. //初始化布局
19. initView();
20.
21. //按钮一 监听事件 查看图片
22. new
23. @Override
24. public void
25. //设置背景图片加深
26. this, "点击按钮1", Toast.LENGTH_SHORT).show();
27. layoutWatch.setBackgroundResource(R.drawable.selector_tab_background);
28. //设置图标选中情况
29. true);
30. false);
31. false);
32. false);
33. false);
34. }
35. });
36. //按钮二 监听事件增强图片
37. layoutIncrease = (LinearLayout) findViewById(.layout_increase);
38. new
39. @Override
40. public void
41. layoutIncrease.setBackgroundResource(R.drawable.selector_tab_background);
42. //设置图标选中情况
43. false);
44. true);
45. false);
46. false);
47. false);
48. }
49. });
50. //按钮三 监听事件图片特效
51. layoutEffect = (LinearLayout) findViewById(.layout_effect);
52. new
53. @Override
54. public void
55. //设置背景图片
56. layoutEffect.setBackgroundResource(R.drawable.selector_tab_background);
57. //设置图标选中情况
58. false);
59. false);
60. true);
61. false);
62. false);
63. }
64. });
65. //按钮四 监听事件图片相框
66. layoutFrame = (LinearLayout) findViewById(.layout_frame);
67. new
68. @Override
69. public void
70. //设置背景图片
71. layoutFrame.setBackgroundResource(R.drawable.selector_tab_background);
72. //设置图标选中情况
73. false);
74. false);
75. false);
76. true);
77. false);
78.
79. }
80. });
81. //按钮五 监听事件图片美白
82. layoutPerson = (LinearLayout) findViewById(.layout_person);
83. new
84. @Override
85. public void
86. //设置背景图片
87. layoutPerson.setBackgroundResource(R.drawable.selector_tab_background);
88. //设置图标选中情况
89. false);
90. false);
91. false);
92. false);
93. true);
94.
95. }
96. });
97. }
98.
99. //初始化布局
100. private void
101. {
102. imageWatch.setImageResource(R.drawable.tab_watch_btn);
103. imageIncrease.setImageResource(R.drawable.tab_increase_btn);
104. imageEffect.setImageResource(R.drawable.tab_effect_btn);
105. imageFrame.setImageResource(R.drawable.tab_frame_btn);
106. imagePerson.setImageResource(R.drawable.tab_person_btn);
107. }
二. 底部菜单 第二种方法
其中activity_main.xml中布局与第一个相同,不同的是在xml中就指定drawable-hdpi中原图片名,因为它不在调用drawable如tab_watch_btn.xml文件,而使用代码直接操作.其中5个LinearLayout一个如下所示：
1. <LinearLayout
2. "@+id/layout_watch"
3. "wrap_content"
4. "wrap_content"
5. "1"
6. "center"
7. "vertical"
8. <ImageView
9. "@+id/image_watch"
10. "wrap_content"
11. "wrap_content"
12. "3dp"
13. "@drawable/image_icon_watch_nor"
14. <TextView
15. "@+id/textview_watch"
16. "wrap_content"
17. "wrap_content"
18. "查看"
19. "#ffffff"
20. "10sp"
21. </LinearLayout>此时它的文件夹结构如下图,drawble没有设置背景加深和加载图标的xml文件：
同时5个LinearLayout(查看、增强、特效、相框、美白)设置触屏响应事件：
1. layoutWatch.setOnTouchListener(new
2. @Override
3. public boolean
4. if(event.getAction() == MotionEvent.ACTION_DOWN) {
5. //按下背景图片
6. layoutWatch.setBackgroundResource(R.drawable.image_home_layout_bg);
7. layoutIncrease.setBackgroundResource(R.drawable.image_home_layout_no);
8. layoutEffect.setBackgroundResource(R.drawable.image_home_layout_no);
9. layoutFrame.setBackgroundResource(R.drawable.image_home_layout_no);
10. layoutPerson.setBackgroundResource(R.drawable.image_home_layout_no);
11. //设置按钮图片
12. imageWatch.setImageDrawable(getResources().getDrawable(R.drawable.image_icon_watch_sel));
13. imageIncrease.setImageDrawable(getResources().getDrawable(R.drawable.image_icon_increase_nor));
14. imageEffect.setImageDrawable(getResources().getDrawable(R.drawable.image_icon_effect_nor));
15. imageFrame.setImageDrawable(getResources().getDrawable(R.drawable.image_icon_frame_nor));
16. imagePerson.setImageDrawable(getResources().getDrawable(R.drawable.image_icon_person_nor));
17. }
18. return false;
19. }
20. });需要注意的是网上下面这段代码仅实现点击一下图片变换的效果,而如果想要实现长显需要如我上面的所示.还见到一个使用Radio实现该效果,当点击一次时判断是否选中并显示相应图片.而使用FragmentTabHost实现同样效果,我不知其原理~
1. bottomReturnBtn.setOnTouchListener(new
2. //这段代码仅仅实现点击一次改变图标功能
3. public boolean
4. Button upStepBtn = (Button) v;
5. if(event.getAction() == MotionEvent.ACTION_DOWN){
6. upStepBtn.setBackgroundResource(R.drawable.bottom_sub_order_btn);
7. else if(event.getAction() == MotionEvent.ACTION_UP){
8. upStepBtn.setBackgroundResource(R.drawable.bottom_return_check);
9. finish();
10. }
11. return false;
12. }
13. });
三. PopupWindow实现弹出菜单
然后讲解如何通过PopupWindow实现下面的功能.效果如下图所示
首先,为PopupWindow设置动画效果,在res文件夹下添加文件夹anim,然后添加anim_entry.xml文件：
1. <?xml version="1.0" encoding="utf-8"?>
2. <set xmlns:android="http:///apk/res/android">
3. <translate
4. android:fromXDelta="0"
5. android:toXDelta="0"
6. android:fromYDelta="120"
7. android:toYDelta="0"
8. android:duration="500" />
9. </set>它是出现效果：从菜单栏底部向上弹出,同时添加anim_exit.xml:
1. <?xml version="1.0" encoding="UTF-8"?>
2. <set xmlns:android="http:///apk/res/android" >
3. <!-- 透明度消失 -->
4. <alpha
5. android:fromAlpha="1.0"
6. android:toAlpha="0.0"
7. android:duration="200" />
8. </set>最后在res/values文件夹styles.xml中添加动画效果,通过调用name="AnimationPreview"可以实现动画：
1. <!-- 定义popupwindows动画效果 -->
2. <style name="AnimationPreview">
3. <item name="android:windowEnterAnimation">@anim/anim_entry</item>
4. <item name="android:windowExitAnimation">@anim/anim_exit</item>
5. </style>然后你需要自定义弹出PopupWindow的布局xml文件,如popup_effect.xml：
1. <?xml version="1.0" encoding="utf-8"?>
2. <RelativeLayout xmlns:android="http:///apk/res/android"
3. android:layout_width="wrap_content"
4. android:layout_height="wrap_content" >
5.
6. <LinearLayout
7. android:layout_width="fill_parent"
8. android:layout_height="wrap_content"
9. android:layout_alignParentBottom="true"
10. android:background="@drawable/image_button_bg_left"
11. android:orientation="vertical" >
12. <LinearLayout
13. android:layout_width="wrap_content"
14. android:layout_height="wrap_content"
15. android:layout_gravity="center_horizontal"
16. android:layout_marginTop="5dp"
17. android:orientation="horizontal" >
18.
19. <LinearLayout
20. android:id="@+id/layout_effect_hj"
21. android:layout_width="wrap_content"
22. android:layout_height="wrap_content"
23. android:layout_margin="2dp"
24. android:layout_weight="1"
25. android:orientation="vertical" >
26. <ImageView
27. android:layout_width="wrap_content"
28. android:layout_height="wrap_content"
29. android:layout_gravity="center_horizontal"
30. android:layout_marginTop="1.0dip"
31. android:src="@drawable/image_effect_hj" />
32. <TextView
33. android:layout_width="wrap_content"
34. android:layout_height="wrap_content"
35. android:layout_gravity="center_horizontal"
36. android:layout_marginTop="1.0dip"
37. android:shadowColor="#ff000000"
38. android:shadowDx="1.0"
39. android:shadowDy="1.0"
40. android:shadowRadius="1.0"
41. android:text="怀旧"
42. android:textColor="#ffffffff"
43. android:textSize="13.0dip" />
44. </LinearLayout>
45.
46. <LinearLayout
47. android:id="@+id/layout_effect_fd"
48. android:layout_width="wrap_content"
49. android:layout_height="wrap_content"
50. android:layout_margin="2dp"
51. android:layout_weight="1"
52. android:orientation="vertical" >
53. <ImageView
54. android:layout_width="wrap_content"
55. android:layout_height="wrap_content"
56. android:layout_gravity="center_horizontal"
57. android:layout_marginTop="1.0dip"
58. android:src="@drawable/image_effect_fd" />
59. <TextView
60. android:layout_width="wrap_content"
61. android:layout_height="wrap_content"
62. android:layout_gravity="center_horizontal"
63. android:layout_marginTop="1.0dip"
64. android:shadowColor="#ff000000"
65. android:shadowDx="1.0"
66. android:shadowDy="1.0"
67. android:shadowRadius="1.0"
68. android:text="浮雕"
69. android:textColor="#ffffffff"
70. android:textSize="13.0dip" />
71. </LinearLayout>
72.
73. <LinearLayout
74. android:id="@+id/layout_effect_gz"
75. android:layout_width="wrap_content"
76. android:layout_height="wrap_content"
77. android:layout_margin="2dp"
78. android:layout_weight="1"
79. android:orientation="vertical" >
80. <ImageView
81. android:layout_width="wrap_content"
82. android:layout_height="wrap_content"
83. android:layout_gravity="center_horizontal"
84. android:layout_marginTop="1.0dip"
85. android:src="@drawable/image_effect_gz" />
86. <TextView
87. android:layout_width="wrap_content"
88. android:layout_height="wrap_content"
89. android:layout_gravity="center_horizontal"
90. android:layout_marginTop="1.0dip"
91. android:shadowColor="#ff000000"
92. android:shadowDx="1.0"
93. android:shadowDy="1.0"
94. android:shadowRadius="1.0"
95. android:text="光照"
96. android:textColor="#ffffffff"
97. android:textSize="13.0dip" />
98. </LinearLayout>
99.
100. <LinearLayout
101. android:id="@+id/layout_effect_sm"
102. android:layout_width="wrap_content"
103. android:layout_height="wrap_content"
104. android:layout_margin="2dp"
105. android:layout_weight="1"
106. android:orientation="vertical" >
107. <ImageView
108. android:layout_width="wrap_content"
109. android:layout_height="wrap_content"
110. android:layout_gravity="center_horizontal"
111. android:layout_marginTop="1.0dip"
112. android:src="@drawable/image_effect_sm" />
113. <TextView
114. android:layout_width="wrap_content"
115. android:layout_height="wrap_content"
116. android:layout_gravity="center_horizontal"
117. android:layout_marginTop="1.0dip"
118. android:shadowColor="#ff000000"
119. android:shadowDx="1.0"
120. android:shadowDy="1.0"
121. android:shadowRadius="1.0"
122. android:text="素描"
123. android:textColor="#ffffffff"
124. android:textSize="13.0dip" />
125. </LinearLayout>
126.
127. <LinearLayout
128. android:id="@+id/layout_effect"
129. android:layout_width="wrap_content"
130. android:layout_height="wrap_content"
131. android:layout_margin="2dp"
132. android:layout_weight="1"
133. android:orientation="vertical" >
134. <ImageView
135. android:layout_width="wrap_content"
136. android:layout_height="wrap_content"
137. android:layout_gravity="center_horizontal"
138. android:layout_marginTop="1.0dip"
139. android:src="@drawable/image_effect" />
140. <TextView
141. android:layout_width="wrap_content"
142. android:layout_height="wrap_content"
143. android:layout_gravity="center_horizontal"
144. android:layout_marginTop="1.0dip"
145. android:shadowColor="#ff000000"
146. android:shadowDx="1.0"
147. android:shadowDy="1.0"
148. android:shadowRadius="1.0"
149. android:text="锐化"
150. android:textColor="#ffffffff"
151. android:textSize="13.0dip" />
152. </LinearLayout>
153.
154. </LinearLayout>
155. </LinearLayout>
156. </RelativeLayout>它的在Xml中Graphical Layout显示效果如下图所示：
添加5个自定义变量：
1. //弹出按钮
2. private
3. private
4. private
5. private
6. private然后当点击"相框"布局LinearLayout时,添加代码如下(其他类似)：
1. //按钮四 监听事件图片相框
2. layoutFrame.setOnClickListener( new
3. @Override
4. public void
5. //载入PopupWindow
6. if (popupWindow4 != null&&popupWindow4.isShowing()) {
7. popupWindow4.dismiss();
8. return;
9. else
10. 4); //number=4
11. int[] location = new int[2];
12. v.getLocationOnScreen(location);
13. this, ""+location[0], Toast.LENGTH_SHORT).show();
14. 0], location[1]-popupWindow4.getHeight());
15. }
16. }
17. });其中initmPopupWindowView(int number)为自定义函数,参数对应的是点击LinearLayout的序号,点击"按钮"4即传入数字4：
1. public void initmPopupWindowView(int
2. null;
3. // 获取自定义布局文件
4. if(number==1) { //查看
5. null, false);
6. // 创建PopupWindow实例 (250,180)分别是宽度和高度
7. new PopupWindow(customView, 250, 280);
8. // 设置动画效果 [R.style.AnimationFade 是自己事先定义好的]
9. popupWindow1.setAnimationStyle(R.style.AnimationPreview);
10. // 自定义view添加触摸事件
11. new
12. @Override
13. public boolean
14. if (popupWindow1 != null
15. popupWindow1.dismiss();
16. null;
17. }
18. return false;
19. }
20. });
21. }
22. if(number==2) { //增强
23. null, false);
24. new PopupWindow(customView, 450, 150);
25. // 使其聚集 要想监听菜单里控件的事件就必须要调用此方法
26. true);
27. // 设置允许在外点击消失
28. true);
29. popupWindow2.setAnimationStyle(R.style.AnimationPreview);
30. // 自定义view添加触摸事件
31. new
32. @Override
33. public boolean
34. if (popupWindow2 != null
35. popupWindow2.dismiss();
36. null;
37. }
38. return false;
39. }
40. });
41. }
42. if(number==3) { //效果
43. null, false);
44. new PopupWindow(customView, 450, 150);
45. // 使其聚集 要想监听菜单里控件的事件就必须要调用此方法
46. true);
47. // 设置允许在外点击消失
48. true);
49. popupWindow3.setAnimationStyle(R.style.AnimationPreview);
50. // 自定义view添加触摸事件
51. new
52. @Override
53. public boolean
54. if (popupWindow3 != null
55. popupWindow3.dismiss();
56. null;
57. }
58. return false;
59. }
60. });
61. }
62. if(number==4) {
63. null, false);
64. new PopupWindow(customView, 450, 150);
65. // 使其聚集 要想监听菜单里控件的事件就必须要调用此方法
66. true);
67. popupWindow4.setAnimationStyle(R.style.AnimationPreview);
68. // 自定义view添加触摸事件
69. new
70. @Override
71. public boolean
72. if (popupWindow4 != null
73. popupWindow4.dismiss();
74. null;
75. }
76. return false;
77. }
78. });
79. }
80. if(number==5) {
81. null, false);
82. new PopupWindow(customView, 450, 150);
83. // 使其聚集 要想监听菜单里控件的事件就必须要调用此方法
84. true);
85. popupWindow5.setAnimationStyle(R.style.AnimationPreview);
86. // 自定义view添加触摸事件
87. new
88. @Override
89. public boolean
90. if (popupWindow5 != null
91. popupWindow5.dismiss();
92. null;
93. }
94. return false;
95. }
96. });
97. //end if
98. }
四. PopupWindow实现点击效果
做到这里,你就能实现点击底部菜单实现弹出PopupWindows效果,但显然是不足的.怎样通过点击弹出PopupWindow中的按钮实现做不同的事情呢?下面讲解,你只需要添加下面的代码即可实现"特效"效果.
代码如下,你可以自定义函数实现不同效果功能(结合前面几篇文章,我的美图秀秀基本完成)：
1. if(number==3) { //效果
2. null, false);
3. new PopupWindow(customView, 450, 150);
4. // 使其聚集 要想监听菜单里控件的事件就必须要调用此方法
5. true);
6. // 设置允许在外点击消失
7. true);
8. popupWindow3.setAnimationStyle(R.style.AnimationPreview);
9. // 自定义view添加触摸事件
10. new
11. @Override
12. public boolean
13. if (popupWindow3 != null
14. popupWindow3.dismiss();
15. null;
16. }
17. return false;
18. }
19. });
20. //判断点击子菜单不同按钮实现不同功能
21. LinearLayout layoutEffect1 = (LinearLayout) customView.findViewById(.layout_effect_hj);
22. new
23. @Override
24. public void
25. this, "效果-怀旧", Toast.LENGTH_SHORT).show();
26. }
27. });
28. LinearLayout layoutEffect2 = (LinearLayout) customView.findViewById(.layout_effect_fd);
29. new
30. @Override
31. public void
32. this, "效果-浮雕", Toast.LENGTH_SHORT).show();
33. }
34. });
35. LinearLayout layoutEffect3 = (LinearLayout) customView.findViewById(.layout_effect_gz);
36. new
37. @Override
38. public void
39. this, "效果-光照", Toast.LENGTH_SHORT).show();
40. }
41. });
42. LinearLayout layoutEffect4 = (LinearLayout) customView.findViewById(.layout_effect_sm);
43. new
44. @Override
45. public void
46. this, "效果-素描", Toast.LENGTH_SHORT).show();
47. //打开图片
48. OpenImage();
49. }
50. });
51. LinearLayout layoutEffect5 = (LinearLayout) customView.findViewById(.layout_effect);
52. new
53. @Override
54. public void
55. this, "效果-锐化", Toast.LENGTH_SHORT).show();
56. }
57. });
58. }
五. 总结
本文章主要讲述如何加载菜单栏在底部,同时讲述PopupWindows弹出事件,其实更好的布局方法是通过适配器,但是我才学Android,很多东西还不懂.所以它只是一篇初级文章,但完全能实现需要功能.
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
