现在的位置: 首页 > 综合 > 正文

转android的UI设计九

2014年09月05日 ⁄ 综合 ⁄ 共 25265字 ⁄ 字号 小 中 大 ⁄ 评论关闭

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



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

一、实现效果图

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



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





二、项目结构图




三、详细的编码实现


3.1 主界面的实现

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


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

[html] view
plaincopy

  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
plaincopy

  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
plaincopy

  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
plaincopy

  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"  
  12.         android:background="@drawable/title_bar"  
  13.         android:gravity="center_vertical" >  
  14.   
  15.         <TextView  
  16.             android:layout_width="wrap_content"  
  17.             android:layout_height="wrap_content"  
  18.             android:layout_centerInParent="true"  
  19.             android:text="微信"  
  20.             android:textColor="#ffffff"  
  21.             android:textSize="20sp" />  
  22.   
  23.         <ImageButton  
  24.             android:id="@+id/title_btn"  
  25.             android:layout_width="67dp"  
  26.             android:layout_height="wrap_content"  
  27.             android:layout_alignParentRight="true"  
  28.             android:layout_centerVertical="true"  
  29.             android:layout_marginRight="5dp"  
  30.             android:background="@drawable/title_button"  
  31.             android:onClick="btnmainright"  
  32.             android:src="@drawable/title_btn_function" />  
  33.     </RelativeLayout>  
  34.   
  35. </LinearLayout>  

2、弹窗的布局页面，这里定义了一个ListView，title_popup.xml：

[html] view
plaincopy

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="wrap_content"  
  4.     android:layout_height="wrap_content"  
  5.     android:background="@drawable/title_function_bg"  
  6.     android:orientation="vertical" >  
  7.   
  8.     <ListView  
  9.         android:id="@+id/title_list"  
  10.         android:layout_width="120dp"  
  11.         android:layout_height="fill_parent"  
  12.         android:cacheColorHint="#00000000"  
  13.         android:divider="@drawable/mm_title_functionframe_line"  
  14.         android:listSelector="@drawable/title_list_selector"  
  15.         android:padding="3dp"  
  16.         android:scrollingCache="false" />  
  17.   
  18. </LinearLayout>  

3、定义一个列表选项中的自定义按钮，title_list_selector.xml：

[html] view
plaincopy

  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/mm_title_functionframe_pressed" android:state_focused="true"></item>  
  5.     <item android:drawable="@drawable/mm_title_functionframe_pressed" android:state_pressed="true"/>  
  6.     <item android:drawable="@drawable/mm_title_functionframe_pressed" android:state_selected="true"></item>  
  7.     <item android:drawable="@android:color/transparent"></item>  
  8.   
  9. </selector>  

4、最后再定义一个弹窗按钮的自定义按钮，title_button.xml：

[html] view
plaincopy

  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/mm_title_btn_focused" android:state_focused="true"/>  
  5.     <item android:drawable="@drawable/mm_title_btn_pressed" android:state_pressed="true"/>  
  6.     <item android:drawable="@drawable/mm_title_btn_pressed" android:state_selected="true"/>  
  7.     <item android:drawable="@drawable/mm_title_btn_normal"/>  
  8.   
  9. </selector>  

5、下面是Java代码部分，首先定义一个常量类，Util.java：

[java] view
plaincopy

  1. package com.yangyu.mytitlebar01;  
  2.   
  3. import android.content.Context;  
  4.   
  5. /** 
  6.  * @author yangyu 
  7.  *  功能描述：常量工具类 
  8.  */  
  9. public class Util {  
  10.     /** 
  11.      * 得到设备屏幕的宽度 
  12.      */  
  13.     public static int getScreenWidth(Context context) {  
  14.         return context.getResources().getDisplayMetrics().widthPixels;  
  15.     }  
  16.   
  17.     /** 
  18.      * 得到设备屏幕的高度 
  19.      */  
  20.     public static int getScreenHeight(Context context) {  
  21.         return context.getResources().getDisplayMetrics().heightPixels;  
  22.     }  
  23.   
  24.     /** 
  25.      * 得到设备的密度 
  26.      */  
  27.     public static float getScreenDensity(Context context) {  
  28.         return context.getResources().getDisplayMetrics().density;  
  29.     }  
  30.   
  31.     /** 
  32.      * 把密度转换为像素 
  33.      */  
  34.     public static int dip2px(Context context, float px) {  
  35.         final float scale = getScreenDensity(context);  
  36.         return (int) (px * scale + 0.5);  
  37.     }  
  38. }  

6、再定义一个实体对象类，ActionItem这个类主要是用来绘制列表选项中的标题和图标,ActionItem.java：

[java] view
plaincopy

  1. package com.yangyu.mytitlebar01;  
  2.   
  3. import android.content.Context;  
  4. import android.graphics.drawable.Drawable;  
  5.   
  6. /** 
  7.  * @author yangyu 
  8.  *  功能描述：弹窗内部子类项（绘制标题和图标） 
  9.  */  
  10. public class ActionItem {  
  11.     //定义图片对象  
  12.     public Drawable mDrawable;  
  13.     //定义文本对象  
  14.     public CharSequence mTitle;  
  15.       
  16.     public ActionItem(Drawable drawable, CharSequence title){  
  17.         this.mDrawable = drawable;  
  18.         this.mTitle = title;  
  19.     }  
  20.       
  21.     public ActionItem(Context context, int titleId, int drawableId){  
  22.         this.mTitle = context.getResources().getText(titleId);  
  23.         this.mDrawable = context.getResources().getDrawable(drawableId);  
  24.     }  
  25.       
  26.     public ActionItem(Context context, CharSequence title, int drawableId) {  
  27.         this.mTitle = title;  
  28.         this.mDrawable = context.getResources().getDrawable(drawableId);  
  29.     }  
  30. }  

7、再定义一个TitlePopup标题栏弹窗类，该类继承自PopupWindow，TitlePopup.java：

[java] view
plaincopy

  1. package com.yangyu.mytitlebar01;  
  2.   
  3. import java.util.ArrayList;  
  4.   
  5. import android.content.Context;  
  6. import android.graphics.Rect;  
  7. import android.graphics.drawable.BitmapDrawable;  
  8. import android.view.Gravity;  
  9. import android.view.LayoutInflater;  
  10. import android.view.View;  
  11. import android.view.ViewGroup;  
  12. import android.view.ViewGroup.LayoutParams;  
  13. import android.widget.AdapterView;  
  14. import android.widget.AdapterView.OnItemClickListener;  
  15. import android.widget.BaseAdapter;  
  16. import android.widget.ListView;  
  17. import android.widget.PopupWindow;  
  18. import android.widget.TextView;  
  19.   
  20. /** 
  21.  * @author yangyu 
  22.  *  功能描述：标题按钮上的弹窗（继承自PopupWindow） 
  23.  */  
  24. public class TitlePopup extends PopupWindow {  
  25.     private Context mContext;  
  26.   
  27.     //列表弹窗的间隔  
  28.     protected final int LIST_PADDING = 10;  
  29.       
  30.     //实例化一个矩形  
  31.     private Rect mRect = new Rect();  
  32.       
  33.     //坐标的位置（x、y）  
  34.     private final int[] mLocation = new int[2];  
  35.       
  36.     //屏幕的宽度和高度  
  37.     private int mScreenWidth,mScreenHeight;  
  38.   
  39.     //判断是否需要添加或更新列表子类项  
  40.     private boolean mIsDirty;  
  41.       
  42.     //位置不在中心  
  43.     private int popupGravity = Gravity.NO_GRAVITY;    
  44.       
  45.     //弹窗子类项选中时的监听  
  46.     private OnItemOnClickListener mItemOnClickListener;  
  47.       
  48.     //定义列表对象  
  49.     private ListView mListView;  
  50.       
  51.     //定义弹窗子类项列表  
  52.     private ArrayList<ActionItem> mActionItems = new ArrayList<ActionItem>();             
  53.       
  54.     public TitlePopup(Context context){  
  55.         //设置布局的参数  
  56.         this(context, LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);  
  57.     }  
  58.       
  59.     public TitlePopup(Context context, int width, int height){  
  60.         this.mContext = context;  
  61.           
  62.         //设置可以获得焦点  
  63.         setFocusable(true);  
  64.         //设置弹窗内可点击  
  65.         setTouchable(true);   
  66.         //设置弹窗外可点击  
  67.         setOutsideTouchable(true);  
  68.           
  69.         //获得屏幕的宽度和高度  
  70.         mScreenWidth = Util.getScreenWidth(mContext);  
  71.         mScreenHeight = Util.getScreenHeight(mContext);  
  72.           
  73.         //设置弹窗的宽度和高度  
  74.         setWidth(width);  
  75.         setHeight(height);  
  76.           
  77.         setBackgroundDrawable(new BitmapDrawable());  
  78.           
  79.         //设置弹窗的布局界面  
  80.         setContentView(LayoutInflater.from(mContext).inflate(R.layout.title_popup, null));  
  81.           
  82.         initUI();  
  83.     }  
  84.           
  85.     /** 
  86.      * 初始化弹窗列表 
  87.      */  
  88.     private void initUI(){  
  89.         mListView = (ListView) getContentView().findViewById(R.id.title_list);  
  90.           
  91.         mListView.setOnItemClickListener(new OnItemClickListener() {  
  92.             @Override  
  93.             public void onItemClick(AdapterView<?> arg0, View arg1, int index,long arg3) {  
  94.                 //点击子类项后，弹窗消失  
  95.                 dismiss();  
  96.                   
  97.                 if(mItemOnClickListener != null)  
  98.                     mItemOnClickListener.onItemClick(mActionItems.get(index), index);  
  99.             }  
  100.         });   
  101.     }  
  102.       
  103.     /** 
  104.      * 显示弹窗列表界面 
  105.      */  
  106.     public void show(View view){  
  107.         //获得点击屏幕的位置坐标  
  108.         view.getLocationOnScreen(mLocation);  
  109.           
  110.         //设置矩形的大小  
  111.         mRect.set(mLocation[0], mLocation[1], mLocation[0] + view.getWidth(),mLocation[1] + view.getHeight());  
  112.           
  113.         //判断是否需要添加或更新列表子类项  
  114.         if(mIsDirty){  
  115.             populateActions();  
  116.         }  
  117.           
  118.         //显示弹窗的位置  
  119.         showAtLocation(view, popupGravity, mScreenWidth - LIST_PADDING - (getWidth()/2), mRect.bottom);  
  120.     }  
  121.       
  122.     /** 
  123.      * 设置弹窗列表子项 
  124.      */  
  125.     private void populateActions(){  
  126.         mIsDirty = false;  
  127.           
  128.         //设置列表的适配器  
  129.         mListView.setAdapter(new BaseAdapter() {              
  130.             @Override  
  131.             public View getView(int position, View convertView, ViewGroup parent) {  
  132.                 TextView textView = null;  
  133.                   
  134.                 if(convertView == null){  
  135.                     textView = new TextView(mContext);  
  136.                     textView.setTextColor(mContext.getResources().getColor(android.R.color.white));  
  137.                     textView.setTextSize(14);  
  138.                     //设置文本居中  
  139.                     textView.setGravity(Gravity.CENTER);  
  140.                     //设置文本域的范围  
  141.                     textView.setPadding(0, 10, 0, 10);  
  142.                     //设置文本在一行内显示（不换行）  
  143.                     textView.setSingleLine(true);  
  144.                 }else{  
  145.                     textView = (TextView) convertView;  
  146.                 }  
  147.                   
  148.                 ActionItem item = mActionItems.get(position);  
  149.                   
  150.                 //设置文本文字  
  151.                 textView.setText(item.mTitle);  
  152.                 //设置文字与图标的间隔  
  153.                 textView.setCompoundDrawablePadding(10);  
  154.                 //设置在文字的左边放一个图标  
  155.                 textView.setCompoundDrawablesWithIntrinsicBounds(item.mDrawable, null , null, null);  
  156.                   
  157.                 return textView;  
  158.             }  
  159.               
  160.             @Override  
  161.             public long getItemId(int position) {  
  162.                 return position;  
  163.             }  
  164.               
  165.             @Override  
  166.             public Object getItem(int position) {  
  167.                 return mActionItems.get(position);  
  168.             }  
  169.               
  170.             @Override  
  171.             public int getCount() {  
  172.                 return mActionItems.size();  
  173.             }  
  174.         }) ;  
  175.     }  
  176.       
  177.     /** 
  178.      * 添加子类项 
  179.      */  
  180.     public void addAction(ActionItem action){  
  181.         if(action != null){  
  182.             mActionItems.add(action);  
  183.             mIsDirty = true;  
  184.         }  
  185.     }  
  186.       
  187.     /** 
  188.      * 清除子类项 
  189.      */  
  190.     public void cleanAction(){  
  191.         if(mActionItems.isEmpty()){  
  192.             mActionItems.clear();  
  193.             mIsDirty = true;  
  194.         }  
  195.     }  
  196.       
  197.     /** 
  198.      * 根据位置得到子类项 
  199.      */  
  200.     public ActionItem getAction(int position){  
  201.         if(position < 0 || position > mActionItems.size())  
  202.             return null;  
  203.         return mActionItems.get(position);  
  204.     }             
  205.       
  206.     /** 
  207.      * 设置监听事件 
  208.      */  
  209.     public void setItemOnClickListener(OnItemOnClickListener onItemOnClickListener){  
  210.         this.mItemOnClickListener = onItemOnClickListener;  
  211.     }  
  212.       
  213.     /** 
  214.      * @author yangyu 
  215.      *  功能描述：弹窗子类项按钮监听事件 
  216.      */  
  217.     public static interface OnItemOnClickListener{  
  218.         public void onItemClick(ActionItem item , int position);  
  219.     }  
  220. }  

8、最后再定义一个Activity界面类，CustomTitleActivity01.java：

[java] view
plaincopy

  1. package com.yangyu.mytitlebar01;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.view.View;  
  6. import android.view.View.OnClickListener;  
  7. import android.view.ViewGroup.LayoutParams;  
  8. import android.widget.ImageButton;  
  9.   
  10. /** 
  11.  * @author yangyu 
  12.  *  功能描述：第一种实现方式，PopupWindow实现方式 
  13.  */  
  14. public class CustomTitleActivity01 extends Activity {  
  15.     //定义标题栏上的按钮  
  16.     private ImageButton titleBtn;  
  17.       
  18.     //定义标题栏弹窗按钮  
  19.     private TitlePopup titlePopup;  
  20.   
  21.     @Override  
  22.     protected void onCreate(Bundle savedInstanceState) {  
  23.         super.onCreate(savedInstanceState);  
  24.         setContentView(R.layout.activity_title);  
  25.           
  26.         initView();  
  27.           
  28.         initData();  
  29.     }  
  30.       
  31.     /** 
  32.      * 初始化组件 
  33.      */  
  34.     private void initView(){  
  35.         //实例化标题栏按钮并设置监听  
  36.         titleBtn = (ImageButton) findViewById(R.id.title_btn);  
  37.         titleBtn.setOnClickListener(new OnClickListener() {  
  38.             @Override  
  39.             public void onClick(View v) {  
  40.                 titlePopup.show(v);  
  41.             }  
  42.         });  
  43.                   
  44.         //实例化标题栏弹窗  
  45.         titlePopup = new TitlePopup(this, LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);  
  46.     }  
  47.       
  48.     /** 
  49.      * 初始化数据 
  50.      */  
  51.     private void initData(){  
  52.         //给标题栏弹窗添加子类  
  53.         titlePopup.addAction(new ActionItem(this, "发起聊天", R.drawable.mm_title_btn_compose_normal));  
  54.         titlePopup.addAction(new ActionItem(this, "听筒模式", R.drawable.mm_title_btn_receiver_normal));  
  55.         titlePopup.addAction(new ActionItem(this, "登录网页", R.drawable.mm_title_btn_keyboard_normal));  
  56.         titlePopup.addAction(new ActionItem(this, "扫一扫",  R.drawable.mm_title_btn_qrcode_normal));  
  57.     }  
  58.       
  59. }  


3.2 第二种实现方式（Activity）


第二种实现方式主要是通过再定义一个Activity来调用实现的，要想实现一个Activity点击按钮实现另一个Activity的弹窗

效果，就要在AndroidManifest.xml清单文件中注册一个新的Activity，然后给它调用系统的样式来实现这种效果。

[html] view
plaincopy

  1. <activity  
  2.             android:name="DialogActivity"  
  3.             android:theme="@android:style/Theme.Translucent.NoTitleBar" >  
  4.         </activity>  


1、定义另一个Activity布局文件，activity_dialog.xml：

[html] view
plaincopy

  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent" >  
  5.   
  6.     <RelativeLayout  
  7.         android:layout_width="fill_parent"  
  8.         android:layout_height="fill_parent"  
  9.         android:layout_marginTop="50dp" >  
  10.   
  11.         <LinearLayout  
  12.             android:id="@+id/main_dialog_layout"  
  13.             android:layout_width="wrap_content"  
  14.             android:layout_height="wrap_content"  
  15.             android:layout_alignParentRight="true"  
  16.             android:layout_alignParentTop="true"  
  17.             android:background="@drawable/title_function_bg"  
  18.             android:orientation="vertical" >  
  19.   
  20.             <LinearLayout  
  21.                 android:id="@+id/llayout01"  
  22.                 android:layout_width="fill_parent"  
  23.                 android:layout_height="wrap_content"  
  24.                 android:layout_marginLeft="5dp"  
  25.                 android:layout_marginRight="5dp"  
  26.                 android:layout_marginTop="5dp"  
  27.                 android:background="@drawable/title_list_selector" >  
  28.   
  29.                 <ImageView  
  30.                     android:id="@+id/imageView1"  
  31.                     android:layout_width="wrap_content"  
  32.                     android:layout_height="wrap_content"  
  33.                     android:layout_gravity="center_vertical"  
  34.                     android:layout_marginLeft="8dp"  
  35.                     android:src="@drawable/mm_title_btn_compose_normal" />  
  36.   
  37.                 <TextView  
  38.                     android:layout_width="wrap_content"  
  39.                     android:layout_height="wrap_content"  
  40.                     android:padding="8dp"  
  41.                     android:text="发起聊天"  
  42.                     android:textColor="#fff"  
  43.                     android:textSize="16sp" />  
  44.             </LinearLayout>  
  45.   
  46.             <ImageView  
  47.                 android:id="@+id/imageView5"  
  48.                 android:layout_width="wrap_content"  
  49.                 android:layout_height="wrap_content"  
  50.                 android:src="@drawable/mm_title_functionframe_line" />  
  51.   
  52.             <LinearLayout  
  53.                 android:id="@+id/llayout02"  
  54.                 android:layout_width="fill_parent"  
  55.                 android:layout_height="wrap_content"  
  56.                 android:layout_marginLeft="5dp"  
  57.                 android:layout_marginRight="5dp"  
  58.                 android:background="@drawable/title_list_selector" >  
  59.   
  60.                 <ImageView  
  61.                     android:id="@+id/imageView2"  
  62.                     android:layout_width="wrap_content"  
  63.                     android:layout_height="wrap_content"  
  64.                     android:layout_gravity="center_vertical"  
  65.                     android:layout_marginLeft="8dp"  
  66.                     android:src="@drawable/mm_title_btn_receiver_normal" />  
  67.   
  68.                 <TextView  
  69.                     android:layout_width="wrap_content"  
  70.                     android:layout_height="wrap_content"  
  71.                     android:padding="8dp"  
  72.                     android:text="听筒模式"  
  73.                     android:textColor="#fff"  
  74.                     android:textSize="16sp" />  
  75.             </LinearLayout>  
  76.   
  77.             <ImageView  
  78.                 android:id="@+id/imageView5"  
  79.                 android:layout_width="wrap_content"  
  80.                 android:layout_height="wrap_content"  
  81.                 android:src="@drawable/mm_title_functionframe_line" />  
  82.   
  83.             <LinearLayout  
  84.                 android:id="@+id/llayout03"  
  85.                 android:layout_width="fill_parent"  
  86.                 android:layout_height="wrap_content"  
  87.                 android:layout_marginLeft="5dp"  
  88.                 android:layout_marginRight="5dp"  
  89.                 android:background="@drawable/title_list_selector" >  
  90.   
  91.                 <ImageView  
  92.                     android:id="@+id/imageView3"  
  93.                     android:layout_width="wrap_content"  
  94.                     android:layout_height="wrap_content"  
  95.                     android:layout_gravity="center_vertical"  
  96.                     android:layout_marginLeft="8dp"  
  97.                     android:src="@drawable/mm_title_btn_keyboard_normal" />  
  98.   
  99.                 <TextView  
  100.                     android:layout_width="wrap_content"  
  101.                     android:layout_height="wrap_content"  
  102.                     android:padding="8dp"  
  103.                     android:text="登录网页"  
  104.                     android:textColor="#fff"  
  105.                     android:textSize="16sp" />  
  106.             </LinearLayout>  
  107.   
  108.             <ImageView  
  109.                 android:id="@+id/imageView5"  
  110.                 android:layout_width="wrap_content"  
  111.                 android:layout_height="wrap_content"  
  112.                 android:src="@drawable/mm_title_functionframe_line" />  
  113.   
  114.             <LinearLayout  
  115.                 android:id="@+id/llayout04"  
  116.                 android:layout_width="fill_parent"  
  117.                 android:layout_height="wrap_content"  
  118.                 android:layout_marginBottom="3dp"  
  119.                 android:layout_marginLeft="5dp"  
  120.                 android:layout_marginRight="5dp"  
  121.                 android:background="@drawable/title_list_selector" >  
  122.   
  123.                 <ImageView  
  124.                     android:id="@+id/imageView4"  
  125.                     android:layout_width="wrap_content"  
  126.                     android:layout_height="wrap_content"  
  127.                     android:layout_gravity="center_vertical"  
  128.                     android:layout_marginLeft="8dp"  
  129.                     android:src="@drawable/mm_title_btn_qrcode_normal" />  
  130.   
  131.                 <TextView  
  132.                     android:layout_width="wrap_content"  
  133.                     android:layout_height="wrap_content"  
  134.                     android:padding="13dp"  
  135.                     android:text="扫一扫"  
  136.                     android:textColor="#fff"  
  137.                     android:textSize="16sp" />  
  138.             </LinearLayout>  
  139.         </LinearLayout>  
  140.     </RelativeLayout>  
  141.   
  142. </RelativeLayout>  

2、另一个Activity弹窗界面，DialogActivity.java：

[java] view
plaincopy

  1. package com.yangyu.mytitlebar01;  
  2.   
  3.   
  4. import android.app.Activity;  
  5. import android.os.Bundle;  
  6. import android.view.MotionEvent;  
  7. import android.view.View;  
  8. import android.view.View.OnClickListener;  
  9. import android.widget.LinearLayout;  
  10.   
  11. /** 
  12.  * @author yangyu 
  13.  *  功能描述：弹出Activity界面 
  14.  */  
  15. public class DialogActivity extends Activity implements OnClickListener{  
  16.     private LinearLayout layout01,layout02,layout03,layout04;  
  17.       
  18.     @Override  
  19.     protected void onCreate(Bundle savedInstanceState) {  
  20.         super.onCreate(savedInstanceState);  
  21.         setContentView(R.layout.activity_dialog);  
  22.   
  23.         initView();  
  24.     }  
  25.   
  26.     /** 
  27.      * 初始化组件 
  28.      */  
  29.     private void initView(){  
  30.         //得到布局组件对象并设置监听事件  
  31.         layout01 = (LinearLayout)findViewById(R.id.llayout01);  
  32.         layout02 = (LinearLayout)findViewById(R.id.llayout02);  
  33.         layout03 = (LinearLayout)findViewById(R.id.llayout03);  
  34.         layout04 = (LinearLayout)findViewById(R.id.llayout04);  
  35.   
  36.         layout01.setOnClickListener(this);  
  37.         layout02.setOnClickListener(this);  
  38.         layout03.setOnClickListener(this);  
  39.         layout04.setOnClickListener(this);  
  40.     }  
  41.       
  42.     @Override  
  43.     public boolean onTouchEvent(MotionEvent event){  
  44.         finish();  
  45.         return true;  
  46.     }  
  47.       
  48.     @Override  
  49.     public void onClick(View v) {  
  50.           
  51.     }  
  52. }  

3、最后是第二种方式的显示界面，CustomTitleActivity02.java：

[java] view
plaincopy

  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.ImageButton;  
  9.   
  10. /** 
  11.  * @author yangyu 
  12.  *  功能描述：第二种实现方式,Activity实现方式 
  13.  */  
  14. public class CustomTitleActivity02 extends Activity {  
  15.     //定义标题栏上的按钮  
  16.     private ImageButton titleBtn;  
  17.           
  18.     @Override  
  19.     protected void onCreate(Bundle savedInstanceState) {  
  20.         super.onCreate(savedInstanceState);  
  21.         setContentView(R.layout.activity_title);  
  22.           
  23.         initView();           
  24.     }  
  25.       
  26.     /** 
  27.      * 初始化组件 
  28.      */  
  29.     private void initView(){  
  30.         //实例化标题栏按钮并设置监听  
  31.         titleBtn = (ImageButton) findViewById(R.id.title_btn);  
  32.         titleBtn.setOnClickListener(new OnClickListener() {  
  33.             @Override  
  34.             public void onClick(View v) {  
  35.                 startActivity(new Intent(CustomTitleActivity02.this,DialogActivity.class));  
  36.             }  
  37.         });                       
  38.     }     
  39.           
  40. }  



             两种弹窗的实现方式基本上就讲完了，有什么问题可以跟博主留言。


源码下载地址

返回
【上篇】
【下篇】

作者:

抱歉!评论已关闭.

返回首页

Copyright © 2013-2018 学步园  保留所有权利.
软文销售 QQ客服：2265327166 点击这里给我发消息（其他合作也可洽谈）
必威体育
必威电竞