【Android UI设计与开发】第14期 顶部标题栏（五）两种方式实现仿微信标题栏弹窗效果

分享一下我老师大神的人工智能教程。零基础！通俗易懂！风趣幽默！还带黄段子！希望你也加入到我们人工智能的队伍中来！https://blog.csdn.net/jiangjunshow

               

转载请注明出处：http://blog.csdn.net/yangyu20121224/article/details/9093821        

      博主在这篇文章中将会继续围绕顶部标题栏专题来进行实例讲解，今天要讲解的主题是分别使用PopupWindow和Activity两种不同的方式来实现仿微信顶部标题栏弹窗的这样一个效果。

一、实现效果图

这里为了演示方便，我将两种方法放在一个应用程序中演示，这个是主界面

虽然两种实现的方式不一样，但是最终的效果图都是差不多的

二、项目结构图

三、详细的编码实现

3.1 主界面的实现

为了演示方便，我这里把两种实现方式分成两个Activity界面放在了主Activity界面中。

1、主布局资源文件，activity_main.xml：

[html]  view plain copy

1. <RelativeLayout xmlns: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.   
6.     <Button  
7.         android:id="@+id/main_btn01"  
8.         android:layout_width="fill_parent"  
9.         android:layout_height="44dp"  
10.         android:layout_above="@+id/main_btn02"  
11.         android:layout_margin="5dp"  
12.         android:background="@drawable/main_btn"  
13.         android:text="第一种实现方式（PopupWindow实现）"  
14.         android:textSize="16dp" />  
15.   
16.     <Button  
17.         android:id="@+id/main_btn02"  
18.         android:layout_width="fill_parent"  
19.         android:layout_height="44dp"  
20.         android:layout_centerVertical="true"  
21.         android:layout_margin="5dp"  
22.         android:background="@drawable/main_btn"  
23.         android:text="第二种实现方式（Activity实现）"  
24.         android:textSize="16dp" />  
25.   
26. </RelativeLayout>  

2、定义一个自定义按钮的资源文件，main_btn.xml：

[html]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <selector xmlns:android="http://schemas.android.com/apk/res/android">  
3.   
4.     <item android:drawable="@drawable/btn_back_pre" android:state_pressed="true"/>  
5.     <item android:drawable="@drawable/btn_back_nor"/>  
6.   
7. </selector>  

3、主Activity程序入口类，MainActivity.java：

[java]  view plain copy

1. package com.yangyu.mytitlebar01;  
2.   
3. import android.app.Activity;  
4. import android.content.Intent;  
5. import android.os.Bundle;  
6. import android.view.View;  
7. import android.view.View.OnClickListener;  
8. import android.widget.Button;  
9.   
10. /** 
11.  * @author yangyu 
12.  *  功能描述：主Activity类，程序的入口类 
13.  */  
14. public class MainActivity extends Activity implements OnClickListener {  
15.     //定义按钮  
16.     private Button mainBtn01,mainBtn02;  
17.       
18.     @Override  
19.     protected void onCreate(Bundle savedInstanceState) {  
20.         super.onCreate(savedInstanceState);  
21.         setContentView(R.layout.activity_main);  
22.                           
23.         initView();       
24.     }  
25.   
26.     /** 
27.      * 初始化组件 
28.      */  
29.     private void initView(){  
30.         //得到按钮并设置监听事件  
31.         mainBtn01 = (Button)findViewById(R.id.main_btn01);  
32.         mainBtn02 = (Button)findViewById(R.id.main_btn02);        
33.           
34.         mainBtn01.setOnClickListener(this);  
35.         mainBtn02.setOnClickListener(this);  
36.     }     
37.           
38.     @Override  
39.     public void onClick(View v) {  
40.         switch (v.getId()) {  
41.         case R.id.main_btn01:  
42.             startActivity(new Intent(MainActivity.this,CustomTitleActivity01.class));  
43.             break;  
44.         case R.id.main_btn02:  
45.             startActivity(new Intent(MainActivity.this,CustomTitleActivity02.class));  
46.             break;                
47.         default:  
48.             break;  
49.         }         
50.     }  
51.       
52. }  

3.2 第一种实现方式（PopupWindow）

第一种实现方式主要是通过点击按钮来弹出一个PopupWindow菜单来实现的，步骤如下：

1、标题栏的布局资源文件，这个资源文件在第二种实现方式中也会使用到，activity_main.xml：

[html]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="fill_parent"  
4.     android:layout_height="fill_parent"  
5.     android:background="#fcfcfc"  
6.     android:orientation="vertical" >  
7.   
8.     <RelativeLayout  
9.         android:id="@+id/title"  
10.         android:layout_width="fill_parent"  
11.         android:layout_height="45dp"