Tim

一枚野生程序员~

  • 主页
  • 分类
  • 标签
  • 归档
  • 关于
所有文章 工具

Tim

一枚野生程序员~

  • 主页
  • 分类
  • 标签
  • 归档
  • 关于

Android对话框

阅读数:次 2020-10-15
字数统计: 1.4k字   |   阅读时长≈ 6分

消息提示机制,常用于向用户传递信息、提示或警告用户的行为。通用的方法有setTitle、setMessage、create、show。本片文章主要是简单对话框的使用,如何自定义对话框,如何使用PopupWindow进行弹框,以及如何对PopupWindow弹框加上动画效果。

简单对话框

1
2
3
4
5
6
7
8
9
10
11
12
13
<Button
android:id="@+id/normal_dialog_btn"
android:text="普通对话框"
android:onClick="myClick"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<Button
android:id="@+id/diy_dialog_btn"
android:text="自定义对话框"
android:onClick="myClick"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

其实普通对话框比较简单:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
public void myClick(View view) {
switch (view.getId()){
case R.id.normal_dialog_btn:
// AlertDialog
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setTitle("提示");
builder.setMessage("确定退出程序吗?");
builder.setPositiveButton("确定", (dialog, which) -> finish());
builder.setNegativeButton("取消", null);
builder.show();
break;
case R.id.diy_dialog_btn:
break;
}
}

不过也可以通过自定义方法进行Dialog的新建:

1
2
3
4
5
6
7
8
9
10
11
12
13
// 自定义方法
private void showNormalDialog(){
AlertDialog alertDialog = new AlertDialog.Builder(this).create();
alertDialog.setTitle("提示");
alertDialog.setMessage("确定退出程序吗?");
alertDialog.setButton(DialogInterface.BUTTON_POSITIVE, "确定", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
finish();
}
});
alertDialog.show();
}

自定义对话框

步骤:设置布局 > 设置Style > 自定义Dialog > 显示Dialog

下面通过这几个素材来完成一个非常可爱的自定义对话框:

首先新建一个diy_dialog.xml,在该布局文件中描述我们对话框的布局:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
android:orientation="vertical"
android:gravity="center_horizontal"
android:background="@mipmap/dialog_bg"
android:padding="20dp"
android:layout_height="match_parent">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="你确定要退出吗?"
android:textColor="#ff0000"
android:textSize="35dp"
android:layout_marginTop="260dp"
android:textStyle="bold" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_marginTop="20dp"
android:layout_height="wrap_content">
<Button
android:id="@+id/no_btn"
android:layout_width="120dp"
android:layout_height="50dp"
android:background="@mipmap/no_btn"/>
<Button
android:id="@+id/yes_btn"
android:layout_width="120dp"
android:layout_marginStart="20dp"
android:layout_height="50dp"
android:background="@mipmap/yes_btn"/>
</LinearLayout>
</LinearLayout>

为了去除原始Dialog中的标题和默认背景色,定义一个style,命名为DiyDialog:

1
2
3
4
5
6
<style name="DiyDialog" parent="android:style/Theme.Dialog">
<!--背景颜色及和透明程度-->
<item name="android:windowBackground">@android:color/transparent</item>
<!--是否去除标题 -->
<item name="android:windowNoTitle">true</item>
</style>

接下来写一个自定义类DiyDialog继承Dialog,注意覆写构造方法:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
public class DiyDialog extends Dialog {
public DiyDialog(@NonNull Context context, int themeResId) {
super(context, themeResId);
// 为对话框设置布局
setContentView(R.layout.diy_dialog);

// 按钮添加点击事件
findViewById(R.id.no_btn).setOnClickListener((e)->{
this.dismiss();
});

findViewById(R.id.yes_btn).setOnClickListener((e)->{
System.exit(0);
});
}
}

上面为了能够使用自定义的style,所以选择了带themeResId的构造函数。

接下来在按钮的点击事件中使用即可,在构造DiyDialog时,注意需要把定义的style资源ID传给它:

1
2
DiyDialog diyDialog = new DiyDialog(this, R.style.DiyDialog);
diyDialog.show();

PopupWindow

PopUpWindow 的使用场景很多,因为它能在任意位置弹出, 这是其他方式很难做到的。 从 Google的开发文档中我们不难看出,首先它是一个 Window,弹出时位于其他控件的上层。PopupWindow使用步骤:

1、创建PopupWindow对象实例
2、设置背景、注册事件监听器和添加动画
3、显示PopupWindow

首先按钮的点击事件写为showPopupWindow(View view),点击按钮时弹出PopupWindow。

先写布局文件如下 popup_window.xml,其实就是三个按钮

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:padding="2dp"
android:background="#00ffff"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<TextView
android:id="@+id/chose_btn"
android:layout_width="60dp"
android:layout_height="30dp"
android:gravity="center"
android:textColor="#ffffff"
android:background="#000000"
android:text="选择"/>
<TextView
android:id="@+id/chose_all_btn"
android:layout_width="60dp"
android:layout_height="30dp"
android:textColor="#ffffff"
android:gravity="center"
android:background="#000000"
android:text="全选"/>
<TextView
android:id="@+id/copy_btn"
android:layout_width="60dp"
android:layout_height="30dp"
android:textColor="#ffffff"
android:gravity="center"
android:background="#000000"
android:text="复制"/>
</LinearLayout>

然后实例化并显示PopupWindow即可:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
private void showPopupWindow(View v) {
// 实例化
View view = LayoutInflater.from(this).inflate(R.layout.popup_window, null);
// view 宽高 是否获得焦点
PopupWindow window = new PopupWindow(view, 360, 65, true);
// 设置背景为透明
window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
// 设置可以响应外部的点击事件
window.setOutsideTouchable(true);
// 设置自身可以响应点击事件
window.setTouchable(true);
// 设置动画(1.创建动画资源 2.创建一个style应用动画资源 3.当前弹窗的动画风格设置)
window.setAnimationStyle(R.style.translate_anim);
// 以view为参照物
window.showAsDropDown(v);
// 设置按钮的点击事件监听
view.findViewById(R.id.chose_btn).setOnClickListener((e)->{
Toast.makeText(MainActivity.this, "选择", Toast.LENGTH_SHORT).show();
// 不要忘记关闭PopupWindow
window.dismiss();
});

view.findViewById(R.id.chose_all_btn).setOnClickListener((e)->{
Toast.makeText(MainActivity.this, "全选", Toast.LENGTH_SHORT).show();
window.dismiss();
});

view.findViewById(R.id.copy_btn).setOnClickListener((e)->{
Toast.makeText(MainActivity.this, "复制", Toast.LENGTH_SHORT).show();
window.dismiss();
});
}

设置动画应该如何设置呢?1、创建动画资源 2、创建一个style应用动画资源 3、当前弹窗的动画风格设置

先在res目录下新建anim目录:

新建一个只包含了平移动画的动画资源文件translate.xml

1
2
3
4
5
6
7
8
9
10
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0"
android:toXDelta="0"
android:fromYDelta="200"
android:toYDelta="0"
>
</translate>
</set>

创建一个style应用该动画资源:

1
2
3
4
<!-- 应用动画资源 -->
<style name="translate_anim">
<item name="android:windowEnterAnimation">@anim/translate</item>
</style>

然后在代码中使用即可:

1
2
// 设置动画(1.创建动画资源 2.创建一个style应用动画资源 3.当前弹窗的动画风格设置)
window.setAnimationStyle(R.style.translate_anim);

赏

谢谢你请我喝咖啡

支付宝
微信
  • 本文作者: Tim
  • 本文链接: https://zouchanglin.cn/50852.html
  • 版权声明: 本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 许可协议。转载请注明出处!
  • Android
  • 自定义UI
  • 移动开发

扫一扫,分享到微信

UI片段——Fragment
Android Menu
  1. 1. 简单对话框
  2. 2. 自定义对话框
  3. 3. PopupWindow
© 2017-2021 Tim
本站总访问量次 | 本站访客数人
  • 所有文章
  • 工具

tag:

  • 生活
  • Android
  • 索引
  • MySQL
  • 组件通信
  • Nginx
  • JavaSE
  • JUC
  • JavaWeb
  • 模板引擎
  • 前端
  • Linux
  • 计算机网络
  • Docker
  • C/C++
  • JVM
  • 上传下载
  • JavaEE
  • SpringCloud
  • Golang
  • Gradle
  • 网络安全
  • 非对称加密
  • IDEA
  • SpringBoot
  • Jenkins
  • 字符串
  • vim
  • 存储
  • 文件下载
  • Mac
  • Windows
  • NIO
  • RPC
  • 集群
  • 微服务
  • SSH
  • 配置中心
  • XML
  • Chrome
  • 压力测试
  • Git
  • 博客
  • 概率论
  • 排序算法
  • 分布式
  • 异常处理
  • 文件系统
  • 哈希
  • openCV
  • 栈
  • 回溯
  • SpringCore
  • 流媒体
  • rtmp
  • 面向对象
  • Vue
  • ElementUI
  • 软件工程
  • 异步
  • 自定义UI
  • ORM框架
  • 模块化
  • 交互式
  • Jsoup
  • Http Client
  • LRUCache
  • RabbitMQ
  • 消息通信
  • 服务解耦
  • 负载均衡
  • 权限
  • 多线程
  • 单例模式
  • Protobuf
  • 序列化
  • Python
  • m3u8
  • 堆
  • 二叉树
  • 自定义View
  • 观察者模式
  • 设计模式
  • 线程池
  • 动态扩容
  • 高可用
  • GC
  • ffmpeg
  • SpringMVC
  • REST
  • Redis
  • 缓存中间件
  • UML
  • Maven
  • Netty
  • 高性能网络
  • IPC通信
  • IO
  • Stream
  • 发布订阅
  • SQLite
  • Hash
  • 集合框架
  • 链表
  • Lambda
  • 汇编语言
  • 组件化
  • Router
  • 开发工具

    缺失模块。
    1、请确保node版本大于6.2
    2、在博客根目录(注意不是yilia-plus根目录)执行以下命令:
    npm i hexo-generator-json-content --save

    3、在根目录_config.yml里添加配置:

      jsonContent:
        meta: false
        pages: false
        posts:
          title: true
          date: true
          path: true
          text: false
          raw: false
          content: false
          slug: false
          updated: false
          comments: false
          link: false
          permalink: false
          excerpt: false
          categories: false
          tags: true
    

  • 思维导图
  • PDF工具
  • 无损放大
  • 代码转图
  • HTTPS证书