最近项目中需要在界面的底部弹出一个向上弹出的菜单界面,并且带渐变的透明背景,跟大家分享一下!
运行效果图:
点击 分享 弹出 底部菜单
菜单界面 share_popup_menu.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/transparent_bg" > <LinearLayout android:id="@+id/ll_popup" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:background="@color/popup_bg" android:orientation="vertical" > <RelativeLayout android:id="@+id/rl_weixin" android:layout_width="fill_parent" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:layout_height="@dimen/detail_menu_item_height" android:layout_gravity="center_horizontal" android:layout_marginTop="@dimen/detail_menu_margin_top_up" android:background="@color/light_black" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:src="@drawable/icon_wechat" android:layout_toLeftOf="@+id/tv_weixin" android:contentDescription="@string/app_name"/> <TextView android:id="@+id/tv_weixin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_marginLeft="15dp" android:text="@string/share_to_weixin" android:textColor="@color/white" /> </RelativeLayout> <RelativeLayout android:id="@+id/rl_weibo" android:layout_width="fill_parent" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:layout_height="@dimen/detail_menu_item_height" android:layout_gravity="center_horizontal" android:layout_marginTop="@dimen/detail_menu_margin_top_up" android:background="@color/light_black" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:src="@drawable/icon_weibo" android:layout_toLeftOf="@+id/tv_weibo" android:contentDescription="@string/app_name"/> <TextView android:id="@+id/tv_weibo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_marginLeft="15dp" android:text="@string/share_to_weibo" android:textColor="@color/white" /> </RelativeLayout> <RelativeLayout android:id="@+id/rl_duanxin" android:layout_width="fill_parent" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:layout_height="@dimen/detail_menu_item_height" android:layout_gravity="center_horizontal" android:layout_marginTop="@dimen/detail_menu_margin_top_up" android:background="@color/light_black" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:src="@drawable/icon_message" android:layout_toLeftOf="@+id/tv_duanxin" android:contentDescription="@string/app_name"/> <TextView android:id="@+id/tv_duanxin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_marginLeft="15dp" android:text="@string/share_to_duanxin" android:textColor="@color/white" /> </RelativeLayout> <Button android:id="@+id/bt_cancle" android:layout_width="fill_parent" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:layout_height="@dimen/detail_menu_item_height" android:layout_gravity="center" android:layout_marginBottom="@dimen/detail_menu_margin_top" android:layout_marginTop="@dimen/detail_menu_margin_top" android:background="@color/dark_white" android:text="@string/cancel" android:textColor="@color/white" /> </LinearLayout> </RelativeLayout>
主界面MainActivity.java
package com.example.popupdemo; import android.app.Activity; import android.graphics.drawable.BitmapDrawable; import android.os.Bundle; import android.view.Gravity; import android.view.View; import android.view.View.OnClickListener; import android.view.ViewGroup.LayoutParams; import android.view.animation.AnimationUtils; import android.widget.Button; import android.widget.LinearLayout; import android.widget.PopupWindow; import android.widget.RelativeLayout; public class MainActivity extends Activity implements OnClickListener { private PopupWindow mpopupWindow; private Button bt_share; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); findView(); } private void findView() { bt_share = (Button) findViewById(R.id.bt_share); bt_share.setOnClickListener(this); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.bt_share: showPopMenu(); break; case R.id.rl_weixin: mpopupWindow.dismiss(); break; case R.id.rl_weibo: mpopupWindow.dismiss(); break; case R.id.rl_duanxin: mpopupWindow.dismiss(); break; case R.id.bt_cancle: mpopupWindow.dismiss(); break; default: break; } } private void showPopMenu() { View view = View.inflate(getApplicationContext(), R.layout.share_popup_menu, null); RelativeLayout rl_weixin = (RelativeLayout) view.findViewById(R.id.rl_weixin); RelativeLayout rl_weibo = (RelativeLayout) view.findViewById(R.id.rl_weibo); RelativeLayout rl_duanxin = (RelativeLayout) view.findViewById(R.id.rl_duanxin); Button bt_cancle = (Button) view.findViewById(R.id.bt_cancle); rl_weixin.setOnClickListener(this); rl_weibo.setOnClickListener(this); rl_duanxin.setOnClickListener(this); bt_cancle.setOnClickListener(this); view.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { mpopupWindow.dismiss(); } }); view.startAnimation(AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fade_in)); LinearLayout ll_popup = (LinearLayout) view.findViewById(R.id.ll_popup); ll_popup.startAnimation(AnimationUtils.loadAnimation(getApplicationContext(), R.anim.push_bottom_in)); if(mpopupWindow==null){ mpopupWindow = new PopupWindow(this); mpopupWindow.setWidth(LayoutParams.MATCH_PARENT); mpopupWindow.setHeight(LayoutParams.MATCH_PARENT); mpopupWindow.setBackgroundDrawable(new BitmapDrawable()); mpopupWindow.setFocusable(true); mpopupWindow.setOutsideTouchable(true); } mpopupWindow.setContentView(view); mpopupWindow.showAtLocation(bt_share, Gravity.BOTTOM, 0, 0); mpopupWindow.update(); } }
渐变动画
<?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.android.com/apk/res/android" android:duration="400" android:fromAlpha="0.0" android:toAlpha="1.0" />
位移动画
<?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="400" android:fromYDelta="100%" android:interpolator="@android:anim/decelerate_interpolator" android:toYDelta="0" />
代码大家自己下载下来慢慢看吧
工程下载地址:http://download.csdn.net/detail/fx_sky/6006143