Android如何自定义升级对话框示例详解

前言

本文主要给大家介绍了关于Android自定义升级对话框的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。

实现的效果如下所示

其实这也只是一个DialogFragment 而已,重点只是在于界面的设计

想要使用做出这样一个DialogFragment ,需要自定义一个View,然后将该View传入到该Dialog中

先定义布局,一个TextView用于标题,一个TextView用于升级内容阐述,一个ImageView,一个确认升级的按钮

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical">

 <TextView
 android:id="@+id/tv_title"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_marginTop="20dp"
 android:gravity="center"
 android:textColor="#0474dc"
 android:textSize="22sp"
 android:textStyle="bold" />

 <TextView
 android:id="@+id/tv_description"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_marginTop="15dp"
 android:gravity="center"
 android:textColor="#0474dc"
 android:textSize="18sp" />

 <ImageView
 android:layout_width="70dp"
 android:layout_height="70dp"
 android:layout_gravity="center"
 android:layout_marginBottom="20dp"
 android:layout_marginTop="20dp"
 android:src="@drawable/upgrade" />

 <Button
 android:id="@+id/btn_upgrade"
 style="@style/blueButtonStyle"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_marginBottom="20dp"
 android:layout_marginEnd="20dp"
 android:layout_marginStart="20dp"
 android:gravity="center"
 android:text="立即更新" />

</LinearLayout>

当中,按钮需要用到自定义Style

 <!--用于按钮的蓝色背景风格-->
 <style name="blueButtonStyle" parent="Widget.AppCompat.Button.Borderless">
 <item name="android:background">@drawable/button_blue_background</item>
 <item name="android:textAppearance">@style/blueButtonTextStyle</item>
 </style>
 <!--用于蓝色风格按钮的文本风格-->
 <style name="blueButtonTextStyle">
 <item name="android:textColor">@android:color/white</item>
 <item name="android:textSize">17sp</item>
 </style>

建立 DialogFragment 的子类

/**
 * 作者: 叶应是叶
 * 时间: 2017/3/23 12:36
 * 描述:
 */
public class VersionDialogFragment extends DialogFragment {

 private static final String TITLE = "title";

 private static final String DESCRIPTION = "description";

 private View.OnClickListener positiveCallback;

 private String title;

 private String description;

 public static VersionDialogFragment getInstance(String title, String description) {
  Bundle bundle = new Bundle();
  bundle.putString(TITLE, title);
  bundle.putString(DESCRIPTION, description);
  VersionDialogFragment versionDialogFragment = new VersionDialogFragment();
  versionDialogFragment.setArguments(bundle);
  return versionDialogFragment;
 }

 @Override
 public void onCreate(@Nullable Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  Bundle bundle = getArguments();
  title = bundle.getString(TITLE);
  description = bundle.getString(DESCRIPTION);
 }

 public void show(FragmentManager fragmentManager, View.OnClickListener positiveCallback) {
  this.positiveCallback = positiveCallback;
  show(fragmentManager, "VersionDialogFragment");
 }

 @NonNull
 @Override
 public Dialog onCreateDialog(Bundle savedInstanceState) {
  AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
  LayoutInflater inflater = getActivity().getLayoutInflater();
  final View view = inflater.inflate(R.layout.version_dialog, null);
  TextView tv_title = (TextView) view.findViewById(R.id.tv_title);
  TextView tv_description = (TextView) view.findViewById(R.id.tv_description);
  Button btn_upgrade = (Button) view.findViewById(R.id.btn_upgrade);
  tv_title.setText(title);
  tv_description.setText(description);
  btn_upgrade.setOnClickListener(positiveCallback);
  builder.setView(view);
  return builder.create();
 }

}

然后再到 MainActivity 中调用Dialog

public void showDialog(View view) {
  final VersionDialogFragment dialogFragment = VersionDialogFragment.getInstance("2.0.1新版本发布啦", "更多功能等你体验");
  dialogFragment.show(getSupportFragmentManager(), new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    Toast.makeText(MainActivity.this, "进行更新操作吧", Toast.LENGTH_SHORT).show();
    dialogFragment.dismiss();
   }
  });
 }

此时界面是这样的

可以看到 Dialog 中有较大的空白区,显得有点虚浮

这里可以选择在 VersionDialogFragment 的 onStart() 方法中指定 Dialog 所占屏幕宽度的比例

 @Override
 public void onStart() {
  super.onStart();
  Dialog dialog = getDialog();
  if (dialog != null) {
   DisplayMetrics dm = new DisplayMetrics();
   getActivity().getWindowManager().getDefaultDisplay().getMetrics(dm);
   if (dialog.getWindow() != null) {
    dialog.getWindow().setLayout((int) (dm.widthPixels * 0.7), ViewGroup.LayoutParams.WRAP_CONTENT);
   }
  }
 }

这里设置占据屏幕宽度的百分之七十

效果图如下所示

此时 Dialog 的四个角还都是直的,这里再来将之修改为圆角

在drawable文件夹下新建一个root.xml文件,作为Dialog使用到的布局的根Layout的背景

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="rectangle">
 <corners android:radius="20dp" />
 <solid android:color="#ffffff" />
</shape>
 @Override
 public void onStart() {
  super.onStart();
  Dialog dialog = getDialog();
  if (dialog != null) {
   DisplayMetrics dm = new DisplayMetrics();
   getActivity().getWindowManager().getDefaultDisplay().getMetrics(dm);
   if (dialog.getWindow() != null) {
    dialog.getWindow().setLayout((int) (dm.widthPixels * 0.8), ViewGroup.LayoutParams.WRAP_CONTENT);
   }
  }
 }

然后再修改onStart()方法,为Dialog的Window设置透明背景色

 @Override
 public void onStart() {
  super.onStart();
  Dialog dialog = getDialog();
  if (dialog != null) {
   DisplayMetrics dm = new DisplayMetrics();
   getActivity().getWindowManager().getDefaultDisplay().getMetrics(dm);
   if (dialog.getWindow() != null) {
    dialog.getWindow().setLayout((int) (dm.widthPixels * 0.7), ViewGroup.LayoutParams.WRAP_CONTENT);
    dialog.getWindow().setBackgroundDrawableResource(android.R.color.transparent);
   }
  }
 }

这样,总的效果就都完成了

这里提供示例代码下载:Android 自定义升级对话框

总结

以上就是这篇文章的全部内容了,希望本文的内容对各位Android开发者们的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对我们的支持。

(0)

相关推荐

  • Android自定义对话框Dialog

    本文简单介绍自定义对话框Dialog的使用,代码和结构都非常简单,目的是能够快速使用自定义对话框,在本文中不具体讲解对话框的高级使用. 实现步骤 首先需要自己在我们的.xml文件中自己构建布局 布局文件做好之后,我们可以在style文件下自己定义布局的样式 前两步都做好之后,我开始在写java文件 具体实现过程 1.   xml文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns

  • Android自定义等待对话框

    最近,看了好多的APP的等待对话框,发现自己的太lower,于是就研究了一番,最后经过苦心努力,实现一个. 自定义一个LoadingIndicatorView(extends View )类 编写values/attrs.xml,在其中编写styleable和item等标签元素 在布局文件中LoadingIndicatorView使用自定义的属性(注意namespace) 在LoadingIndicatorView的构造方法中通过TypedArray获取 描述就提供这些,一下是代码的展示,非常的

  • Android自定义控件实现万能的对话框

    自定义控件有段时间没更新了,今天给大家带来一个新的对话框样式,本着用更少的代码实现更丰富的功能. 由于对话框对用户的操作有影响,所以目前app上的对话框用的已经比较少了,但还是有一些比较重要的信息提示需要使用对话框的样式,例如版本更新,账户异地登陆等. 下面来看自定义对话框的样式: 图1:自定义提示对话框 图2:自定义警告对话框 图3:默认提示对话框 图4:默认警告对话框 这里面带来了两种对话框的样式,也是比较常见的.以上所有的背景颜色,文字颜色,以及按钮的点击效果都是可以自定义的. 下面分别看

  • Android中自定义对话框(Dialog)的实例代码

    1.修改系统默认的Dialog样式(风格.主题) 2.自定义Dialog布局文件 3.可以自己封装一个类,继承自Dialog或者直接使用Dialog类来实现,为了方便以后重复使用,建议自己封装一个Dialog类 第一步: 我们知道Android定义个控件或View的样式都是通过定义其style来实现的,查看Android框架中的主题文件,在源码中的路径:/frameworks/base/core/res/res/values/themes.xml,我们可以看到,Android为Dialog定义了

  • Android实现自定义圆角对话框Dialog的示例代码

    前言: 项目中多处用到对话框,用系统对话框太难看,就自己写一个自定义对话框. 对话框包括:1.圆角 2.app图标 , 提示文本,关闭对话框的"确定"按钮 难点:1.对话框边框圆角显示 2.考虑到提示文本字数不确定,在不影响美观的情况下,需要在一行内显示提示的文字信息 3.设置对话框的宽和高 技术储备: 1.安卓开发_使用AlertDialog实现对话框    知道AlertDialog有setView(view) ,Dialog 有ContentView(view) 方法. 2.An

  • Android对话框自定义标题 对话框标题美化操作

    Android自带的对话框标题不好看,如果我们需要给弹出的对话框设置一个自己定义的标题,可以使用AlertDialog.Builder的setCustomTitle()方法. 定义一个对话框标题的title.xml文件: <?xml version="1.0" encoding="UTF-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android

  • Android中制作自定义dialog对话框的实例分享

    自定义dialog基础版 很多时候,我们在使用android sdk提供的alerdialog的时候,会因为你的系统的不同而产生不同的效果,就好比如你刷的是MIUI的系统,弹出框都会在顶部显示!这里简单的介绍自定义弹出框的应用. 首先创建布局文件dialog: 代码: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.and

  • Android如何自定义升级对话框示例详解

    前言 本文主要给大家介绍了关于Android自定义升级对话框的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 实现的效果如下所示 其实这也只是一个DialogFragment 而已,重点只是在于界面的设计 想要使用做出这样一个DialogFragment ,需要自定义一个View,然后将该View传入到该Dialog中 先定义布局,一个TextView用于标题,一个TextView用于升级内容阐述,一个ImageView,一个确认升级的按钮 <?xml version

  • Android性能优化大图治理示例详解

    目录 引言 1 自定义大图View 1.1 准备工作 1.2 图片宽高适配 1.3 BitmapRegionDecoder 2 大图View的手势事件处理 2.1 GestureDetector 2.2 双击放大效果处理 2.3 手指放大效果处理 引言 在实际的Android项目开发中,图片是必不可少的元素,几乎所有的界面都是由图片构成的:像列表页.查看大图页等,都是需要展示图片,而且这两者是有共同点的,列表展示的Item数量多,如果全部加载进来势必会造成OOM,因此列表页通常采用分页加载,加上

  • uniapp自定义相机实现示例详解

    目录 自定义相机 起因 利用livePusher实现 使用 效果图 拓展 实现多种自定义相机 水印相机 身份证相机 人像相机 自定义相机 起因 由于最近用uniapp调用原生相机容易出现闪退问题,找了很多教程又是压缩图片又是优化代码,我表示并没有太大作用!! 于是开启了我的解决之路 利用livePusher实现 实现自定义相机 拓展性挺强的,可以实现自定义水印.身份证拍摄.人像拍摄等 这里我简单实现一个相机功能主要用于解决闪退 Tip:这里需要创建nvue文件哦~ 创建camera.nvue <

  • Vue.js3.2的vnode部分优化升级使用示例详解

    目录 背景 什么是 vnode 普通元素 vnode 组件 vnode vnode 的优势 如何创建 vnode 创建 vnode 过程的优化 总结 背景 上一篇文章,分析了 Vue.js 3.2 关于响应式部分的优化,此外,在这次优化升级中,还有一个运行时的优化: ~200% faster creation of plain element VNodes 即针对普通元素类型 vnode 的创建,提升了约 200% 的性能.这也是一个非常伟大的优化,是 Vue 的官方核心开发者 HcySunYa

  • Android TabLayout 自定义样式及使用详解

    目录 基本使用 XML静态设置TabItem 联动ViewPager2动态设置TabItem 1. Activity布局代码 2. 创建三个Fragment给ViewPager2设置 3. Fragment对应XML布局 4. 绑定起来 最终效果 根据数据源动态生成TabItem 1.Activity布局代码 2. Activity代码 最终效果 修改TabLayout背景颜色 修改indicator layer-list 制作圆形的indicator 制作圆角矩形indicator 修改边距

  • Android RecyclerChart其它图表绘制示例详解

    目录 正文 1. 心电图 2. 睡眠图 正文 之前章节介绍了RecyclerChart 中一些通用的图表的相关绘制逻辑,本章节介绍两种Special的Chart的绘制,一种是心电图,一种是睡眠图.首先我们来看下心电图EcgChart的绘制. 1. 心电图 EcgChart 跟LineChart形态上是相似的,但是EcgChart的点相对于LineChart密集的多,之前的LineChart相当于每个RecyclerView的Itemview 中的Model对应的value值,而心电图的ItemD

  • Android如何实现一个DocumentProvider示例详解

    目录 前言 步骤 首先在Manifest 中注册这个Provider 创建这个Provider 重写queryRoot 重写queryDocument 重写getChildDocument 前言 假如你做了一个云盘类的app,或者可以保存用户导入的配置.用户在未来肯定需要获取这些文件,一个办法是写一个Activity,向一个文件管理软件一样把他们列出来.但是这个有一个问题是用户必须进入app 才能访问. 现在有一个解决方案是实现一个DocumentProvider 步骤 DocumentProv

  • Django自定义用户认证示例详解

    前言 Django附带的认证对于大多数常见情况来说已经足够了,但是如何在 Django 中使用自定义的数据表进行用户认证,有一种较为笨蛋的办法就是自定义好数据表后,使用OnetoOne来跟 Django 的表进行关联,类似于这样: from django.contrib.auth.models import User class UserProfile(models.Model): """ 用户账号表 """ user = models.OneT

  • Android编程之SurfaceView学习示例详解

    本文实例讲述了Android编程之SurfaceView学习示例.分享给大家供大家参考,具体如下: SurfaceView是View的子类,使用的方式与任何View所派生的类都是完全相同的,可以像其他View那样应用动画,并把它们放到布局中. SurfaceView封装的Surface支持使用本章前面所描述的所有标准Canvas方法进行绘图,同时也支持完全的OpenGL ES库. 使用OpenGL,你可以再Surface上绘制任何支持的2D或者3D对象,与在2D画布上模拟相同的效果相比,这种方法

  • 微信小程序自定义模态对话框实例详解

    由于官方API提供的显示模态弹窗,只能简单地显示文字内容,不能对对话框内容进行自定义,欠缺灵活性,所以自己从模态弹窗的原理角度来实现了自定义的模态对话框. wx.showModal(OBJECT) 自定义 模态对话框 涉及文件 界面 wxml 样式 wxcss 事件及方法 js 效果图 界面代码 .wxml <button class="show-btn" bindtap="showDialogBtn">弹窗</button> <!--

随机推荐