Android-仿微信菜单

最新推荐文章于 2021-06-07 22:16:10 发布

原创最新推荐文章于 2021-06-07 22:16:10 发布 · 901 阅读

2 ·

CC 4.0 BY-SA版权

Android基础控件同时被 2 个专栏收录

51 篇文章

订阅专栏

Android基本控件

51 篇文章

订阅专栏

该博客介绍了如何在Android应用中仿照微信设计菜单，点击右上角图标后弹出包含多个选项的对话框。主要涉及XML布局文件的编辑，包括activity_main.xml中的Button用于触发菜单显示，以及activity_title.xml用于创建标题栏。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

目标效果：

点击右上角的图标，会出现一个弹出框，有菜单选项。

1.activity_main.xml放置一个Button，点击进入主页面。

activity_main.xml页面：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <Button
        android:id="@+id/main_btn02"
        android:layout_width="fill_parent"
        android:layout_height="44dp"
        android:layout_centerVertical="true"
        android:layout_margin="5dp"
        android:text="Activity实现"
        android:textSize="16dp" />

</RelativeLayout>

2.activity_title.xml页面设置主页面的标题栏。

activity_title.xml页面：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    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="#00ffffff"
            android:onClick="btnmainright"
            android:src="@drawable/title_btn_function" />
    </RelativeLayout>

</LinearLayout>

3.activity_dialog.xml页面作为弹出菜单的页面。

activity_dialog.xml页面：

<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginTop="50dp" >

        <LinearLayout
            android:id="@+id/main_dialog_layout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/title_function_bg"
            android:orientation="vertical" >

            <LinearLayout
                android:id="@+id/llayout01"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_marginTop="5dp">

                <ImageView
                    android:id="@+id/imageView1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="8dp"
                    android:src="@drawable/mm_title_btn_compose_normal" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="发起聊天"
                    android:textColor="#fff"
                    android:textSize="16sp" />
            </LinearLayout>

            <ImageView
                android:id="@+id/imageView5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/mm_title_functionframe_line" />

            <LinearLayout
                android:id="@+id/llayout02"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp">

                <ImageView
                    android:id="@+id/imageView2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="8dp"
                    android:src="@drawable/mm_title_btn_receiver_normal" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="听筒模式"
                    android:textColor="#fff"
                    android:textSize="16sp" />
            </LinearLayout>

            <ImageView
                android:id="@+id/imageView5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/mm_title_functionframe_line" />

          
        </LinearLayout>
    </RelativeLayout>

</RelativeLayout>

4.DialogActivity.java页面设置菜单对应的点击事件，本例子只是讲解显示，所以点击事件都没有编写。

DialogActivity.java页面：

package com.yangyu.mytitlebar01;


import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.LinearLayout;

/**
 * @author yangyu
 *	功能描述：弹出Activity界面
 */
public class DialogActivity extends Activity implements OnClickListener{
	private LinearLayout layout01,layout02,layout03,layout04;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_dialog);

		initView();
	}

	/**
	 * 初始化组件
	 */
	private void initView(){
		//得到布局组件对象并设置监听事件
		layout01 = (LinearLayout)findViewById(R.id.llayout01);
		layout02 = (LinearLayout)findViewById(R.id.llayout02);

		layout01.setOnClickListener(this);
		layout02.setOnClickListener(this);
	}
	
	@Override
	public boolean onTouchEvent(MotionEvent event){
		finish();
		return true;
	}
	
	@Override
	public void onClick(View v) {
		
	}
}

5.CustomTitleActivity.java页面编写标题栏对应的点击方法。

CustomTitleActivity.java页面：

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.ImageButton;

/**
 * @author yangyu
 *	功能描述：第二种实现方式,Activity实现方式
 */
public class CustomTitleActivity extends Activity {
	//定义标题栏上的按钮
	private ImageButton titleBtn;
		
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_title);
		
		initView();			
	}
	
	/**
	 * 初始化组件
	 */
	private void initView(){
		//实例化标题栏按钮并设置监听
		titleBtn = (ImageButton) findViewById(R.id.title_btn);
		titleBtn.setOnClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				startActivity(new Intent(CustomTitleActivity.this,DialogActivity.class));
			}
		});						
	}	
		
}

6.MainActivity.java页面定义Button点击跳转方法。

MainActivity.java页面：

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(){
		//得到按钮并设置监听事件
		mainBtn02 = (Button)findViewById(R.id.main_btn02);		
		
		mainBtn02.setOnClickListener(this);
	}	
		
	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.main_btn02:
			startActivity(new Intent(MainActivity.this,CustomTitleActivity.class));
			break;				
		default:
			break;
		}		
	}
	
}

7.弹出的dialog菜单页面其实是一个完整的activity页面，只不过背景只填充右上角部分，其余地方设置为透明，这就需要在AndroidManifest.xml页面配置。

AndroidManifest.xml页面：

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.yangyu.mytitlebar01"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="4"
        android:targetSdkVersion="14" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity android:name="CustomTitleActivity" >
        </activity>
        <activity
            android:name="DialogActivity"
            android:theme="@android:style/Theme.Translucent.NoTitleBar" >

            <!-- android:theme="@android:style/Theme.Translucent.NoTitleBar"设置透明 -->
        </activity>
        <activity android:name="MainActivity" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

8.运行就显示目标效果了，根据需求可加入点击动画。