首页 > 系统 > Android > 正文

Android实现微信右侧顶部下拉对话框

2019-10-21 21:32:09
字体:
来源:转载
供稿:网友

我们使用微信都知道,其右侧顶部有一个下拉对话框,我们可以执行添加好友,扫一扫等功能,今天我们就来模仿实现一下这个功能(实现的方式有很多种,我今天只说一种借助透明主题Activity的方式实现;如果有兴趣还可以移步至仿淘宝底部导航栏);本篇的实现的效果如下:

Android,微信,下拉,对话框

下面就来说一说实现的思路重要

第一步:创建弹出对话框布局

<?xml version="1.0" encoding="UTF-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" >  <RelativeLayout  android:layout_width="fill_parent"  android:layout_height="fill_parent"  android:layout_marginTop="45dp"  android:layout_marginRight="20dp">   <LinearLayout   android:id="@+id/id_pop_dialog_layout"   android:layout_width="@dimen/pop_list_width"   android:layout_height="wrap_content"   android:layout_alignParentRight="true"   android:layout_alignParentTop="true"   android:background="@drawable/pop_item_normal"   android:orientation="vertical" >    <LinearLayout    android:id="@+id/upload_record_layout"    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:layout_marginLeft="5dp"    android:layout_marginRight="5dp"    android:layout_marginTop="5dp"    android:background="@drawable/pop_list_selector" >     <ImageView     android:id="@+id/id_imageView1"     android:layout_width="@dimen/pop_dialog_icon_size"     android:layout_height="@dimen/pop_dialog_icon_size"     android:layout_gravity="center_vertical"     android:layout_marginLeft="8dp"     android:src="@drawable/upload_icon_record" />     <TextView     android:layout_width="@dimen/pop_list_width"     android:layout_height="wrap_content"     android:padding="8dp"     android:text="@string/uploadRecord"      android:layout_gravity="center_vertical"     android:textColor="#fff"     android:textSize="16sp" />   </LinearLayout>    <ImageView    android:id="@+id/id_imageView5"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:src="@drawable/pop_line" />    <LinearLayout    android:id="@+id/register_record_layout"    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:layout_marginLeft="5dp"    android:layout_marginRight="5dp"    android:background="@drawable/pop_list_selector" >     <ImageView     android:id="@+id/id_imageView2"     android:layout_width="@dimen/pop_dialog_icon_size"     android:layout_height="@dimen/pop_dialog_icon_size"     android:layout_gravity="center_vertical"     android:layout_marginLeft="8dp"     android:src="@drawable/register_icon_record" />     <TextView     android:layout_width="@dimen/pop_list_width"     android:layout_height="wrap_content"     android:padding="8dp"     android:text="@string/registerRecord"      android:layout_gravity="center_vertical"     android:textColor="#fff"     android:textSize="16sp" />   </LinearLayout>    <ImageView    android:id="@+id/id_imageView7"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:src="@drawable/pop_line" />    <LinearLayout    android:id="@+id/new_massage_layout"    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:layout_marginLeft="5dp"    android:layout_marginRight="5dp"    android:background="@drawable/pop_list_selector" >     <ImageView     android:id="@+id/id_imageView3"     android:layout_width="@dimen/pop_dialog_icon_size"     android:layout_height="@dimen/pop_dialog_icon_size"     android:layout_gravity="center_vertical"     android:layout_marginLeft="8dp"     android:src="@drawable/message_icon_tip" />     <TextView     android:id="@+id/new_message"     android:layout_width="@dimen/pop_list_width"     android:layout_height="wrap_content"     android:padding="8dp"     android:text="@string/defaultMessage"     android:layout_gravity="center_vertical"     android:textColor="#fff"     android:textSize="16sp" />   </LinearLayout>    <ImageView    android:id="@+id/id_imageView6"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:src="@drawable/pop_line" />   </LinearLayout> </RelativeLayout> </RelativeLayout>

第二步:创建一个用于显示该对话框布局Activity

package com.hfut.popdialogtest; import android.app.Activity;import android.os.Bundle;import android.view.MotionEvent;import android.view.View;import android.view.View.OnClickListener;import android.view.Window;import android.widget.LinearLayout; /** * @author why * @date 2018-10-3 */public class MyDialogActivity extends Activity implements OnClickListener{  private LinearLayout uploadRecord; private LinearLayout registerRecord; private LinearLayout newMessage;  @Override protected void onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  requestWindowFeature(Window.FEATURE_NO_TITLE);  setContentView(R.layout.pop_dialog);   if(getActionBar()!=null){   getActionBar().hide();  }  CommonTools.setNavbarVisibility(this);  initView(); }   private void initView(){  uploadRecord = findViewById(R.id.upload_record_layout);  registerRecord = findViewById(R.id.register_record_layout);  newMessage = findViewById(R.id.new_massage_layout);   uploadRecord.setOnClickListener(this);  registerRecord.setOnClickListener(this);  newMessage.setOnClickListener(this); }  @Override public boolean onTouchEvent(MotionEvent event){  finish();  return true; }  @Override public void onClick(View v) {  switch (v.getId()){   case R.id.upload_record_layout:   SharedData.resultID=1;   break;   case R.id.register_record_layout:   SharedData.resultID=2;   break;   case R.id.new_massage_layout:   SharedData.resultID=3;   break;   default:   SharedData.resultID=0;   break;  }  this.finish(); }}

第三步:创建一个主界面
MainActivity.java代码:

package com.hfut.popdialogtest; import android.content.Intent;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.widget.TextView; /** * @author why * @date 2018-10-3 9:35:35 */public class MainActivity extends AppCompatActivity {  TextView resultShow;  @Override protected void onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentView(R.layout.activity_main);  resultShow = findViewById(R.id.show_choosen_result);   if(getActionBar()!=null){   getActionBar().hide();  }  CommonTools.setNavbarVisibility(this); }   @Override protected void onResume() {  switch (SharedData.resultID) {   case 0:    resultShow.setText("默认显示");    break;   case 1:    resultShow.setText(getResources().getString(R.string.uploadRecord));    break;   case 2:    resultShow.setText(getResources().getString(R.string.registerRecord));    break;   case 3:    resultShow.setText(getResources().getString(R.string.defaultMessage));    break;   default:    resultShow.setText("默认显示");    break;   }  super.onResume(); }  public void openPopDialog(View view) {  Intent intent = new Intent(this, PopDialogActivity.class);  startActivity(intent); }}

activity_main.xml代码:

<?xml version="1.0" encoding="utf-8"?><android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.hfut.popdialogtest.MainActivity">  <ImageView  android:onClick="openPopDialog"  android:id="@+id/pop_dialog_icon"  app:layout_constraintRight_toRightOf="parent"  android:layout_marginRight="10dp"  app:layout_constraintTop_toTopOf="parent"  android:layout_marginTop="5dp"  android:background="@drawable/message_tip"  android:layout_width="50dp"  android:layout_height="50dp" />  <TextView  android:gravity="center"  android:textColor="@color/colorAccent"  android:textSize="30sp"  android:id="@+id/show_choosen_result"  app:layout_constraintTop_toBottomOf="@id/pop_dialog_icon"  android:layout_marginTop="50dp"  android:layout_width="match_parent"  android:layout_height="match_parent" /> </android.support.constraint.ConstraintLayout>

第四步:设置对话框Activity主题为透明主题
AndroidManifest.xml文件代码:

<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.hfut.popdialogtest">  <application  android:allowBackup="true"  android:icon="@mipmap/ic_launcher"  android:label="@string/app_name"  android:roundIcon="@mipmap/ic_launcher_round"  android:supportsRtl="true"  android:theme="@style/AppTheme">  <activity android:name=".MainActivity">   <intent-filter>    <action android:name="android.intent.action.MAIN" />     <category android:name="android.intent.category.LAUNCHER" />   </intent-filter>  </activity>  <activity android:name=".MyDialogActivity" android:theme="@android:style/Theme.Translucent" /> </application> </manifest>

第五步:其他辅助代码
CommonTools.java代码:

package com.hfut.popdialogtest; import android.app.Activity;import android.view.View; /** * author:why * created on: 2018/9/11 13:34 * description: */public class CommonTools {  /**  * to controll the visibility of the Activity's navigator bar  * @param activity  */ public static void setNavbarVisibility(Activity activity) {  View decorView = activity.getWindow().getDecorView();  decorView.setSystemUiVisibility(    View.SYSTEM_UI_FLAG_LAYOUT_STABLE      | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION      | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN      | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION      | View.SYSTEM_UI_FLAG_FULLSCREEN      | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY); } }

Values目录下的dimens.xml代码:

<?xml version="1.0" encoding="utf-8"?><resources> <dimen name="pop_list_width">160dp</dimen> <dimen name="pop_dialog_icon_size">60dp</dimen> <dimen name="pop_dialog_icon_tip_size">40dp</dimen></resources>

Values目录下的strings.xml代码:

<resources> <string name="app_name">仿微信右侧顶部下拉弹出测试</string>  <string name="uploadRecord">上传记录</string> <string name="registerRecord">注册记录</string> <string name="defaultMessage">消息提示</string> </resources>

其他资源文件就不添加了。我们总结一下其实就是这样的步骤:

  • 点击主Activity的弹窗对话框图标,打开一个新的透明的Acitivity
  • 在新的Activity中做完逻辑处理把结果存放在主Activity可访问的数据域,然后finish自己
  • 主Activity再次可交互,并在onResume中实现对处理结果分析和处理,比如修改主Activity UI; 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持VEVB武林网。


注:相关教程知识阅读请移步到Android开发频道。
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表