分别使用PopupWindow和Activity两种不同的方式来实现仿微信顶部标题栏弹窗的这样一个效果。
一、实现效果图
这里为了演示方便，我将两种方法放在一个应用程序中演示，这个是主界面
虽然两种实现的方式不一样，但是最终的效果图都是差不多的
二、项目结构图
三、详细的编码实现
3.1 主界面的实现
为了演示方便，我这里把两种实现方式分成两个Activity界面放在了主Activity界面中。
1、主布局资源文件，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
23
24
25
26
|
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<Button
android:id="@+id/main_btn01"
android:layout_width="fill_parent"
android:layout_height="44dp"
android:layout_above="@+id/main_btn02"
android:layout_margin="5dp"
android:background="@drawable/main_btn"
android:text="第一种实现方式（PopupWindow实现）"
android:textSize="16dp"
/>
<Button
android:id="@+id/main_btn02"
android:layout_width="fill_parent"
android:layout_height="44dp"
android:layout_centerVertical="true"
android:layout_margin="5dp"
android:background="@drawable/main_btn"
android:text="第二种实现方式（Activity实现）"
android:textSize="16dp"
/>
</RelativeLayout>
|
2、定义一个自定义按钮的资源文件，main_btn.xml：
|
1
2
3
4
5
6
7
|
<?xml
version="1.0"
encoding="utf-8"?>
<item
android:drawable="@drawable/btn_back_pre"
android:state_pressed="true"/>
<item
android:drawable="@drawable/btn_back_nor"/>
</selector>
|
3、主Activity程序入口类，MainActivity.java：
|
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
|
package
com.yangyu.mytitlebar01;
import
android.app.Activity;
import
android.content.Intent;
import
android.os.Bundle;
import
android.view.View;
import
android.view.View.OnClickListener;
import
android.widget.Button;
/**
*
@author yangyu
*
功能描述：主Activity类，程序的入口类
*/
public
class
MainActivity extends
Activity implements
OnClickListener {
//定义按钮
private
Button mainBtn01,mainBtn02;
@Override
protected
void
onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
/**
*
初始化组件
*/
private
void
initView(){
//得到按钮并设置监听事件
mainBtn01
= (Button)findViewById(R.id.main_btn01);
mainBtn02
= (Button)findViewById(R.id.main_btn02);
mainBtn01.setOnClickListener(this);
mainBtn02.setOnClickListener(this);
}
@Override
public
void
onClick(View v) {
switch
(v.getId()) {
case
R.id.main_btn01:
startActivity(new
Intent(MainActivity.this,CustomTitleActivity01.class));
break;
case
R.id.main_btn02:
startActivity(new
Intent(MainActivity.this,CustomTitleActivity02.class));
break;
default:
break;
}
}
}
|
3.2 第一种实现方式（PopupWindow）
第一种实现方式主要是通过点击按钮来弹出一个PopupWindow菜单来实现的，步骤如下：
1、标题栏的布局资源文件，这个资源文件在第二种实现方式中也会使用到，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
23
24
25
26
27
28
29
30
31
32
33
34
35
|
<?xml
version="1.0"
encoding="utf-8"?>
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fcfcfc"
android:orientation="vertical"
>
<RelativeLayout
android:id="@+id/title"
android:layout_width="fill_parent"
android:layout_height="45dp"
android:background="@drawable/title_bar"
android:gravity="center_vertical"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="微信"
android:textColor="#ffffff"
android:textSize="20sp"
/>
<ImageButton
android:id="@+id/title_btn"
android:layout_width="67dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:background="@drawable/title_button"
android:onClick="btnmainright"
android:src="@drawable/title_btn_function"
/>
</RelativeLayout>
</LinearLayout>
|
2、弹窗的布局页面，这里定义了一个ListView，title_popup.xml：