Flutter之自定义Dialog实现版本更新弹窗功能的实现

 更新时间:2020年07月24日 08:54:47   作者:管管  
这篇文章主要介绍了Flutter之自定义Dialog实现版本更新弹窗功能的实现,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

功能点:

1.更新弹窗UI

2.强更与非强更且别控制

3.屏蔽物理返回键(因为强更的时候点击返回键,弹窗会消失)

4.点击弹窗外透明区域时,弹窗不消失

先看下效果图:

Dialog实现代码:

import 'package:flutter/material.dart';
import 'package:xiaopijiang/utils/assets_util.dart';
import 'package:xiaopijiang/utils/toast_util.dart';

///created by WGH
///on 2020/7/23
///description:版本更新提示弹窗
class UpdateDialog extends Dialog {
 final String upDateContent;
 final bool isForce;

 UpdateDialog({this.upDateContent, this.isForce});

 @override
 Widget build(BuildContext context) {
 return Center(
  child: Column(
  mainAxisAlignment: MainAxisAlignment.center,
  children: <Widget>[
   Container(
   width: 319,
   height: 370,
   child: Stack(
    children: <Widget>[
    Image.asset(
     AssetsUtil.getImagePath(
      imageName: 'bg_update', suffix: 'png'),
     fit: BoxFit.cover,
    ),
    Container(
     width: double.infinity,
     child: Column(
     mainAxisAlignment: MainAxisAlignment.spaceBetween,
     children: <Widget>[
      Container(
      margin: EdgeInsets.only(top: 110),
      child: Text('发现新版本',
       style: TextStyle(
        fontSize: 20,
        color: Colors.white,
        decoration: TextDecoration.none)),
      ),
      Text(upDateContent,
       style: TextStyle(
        fontSize: 16,
        color: Colors.black54,
        decoration: TextDecoration.none)),
      Container(
      width: 250,
      height: 42,
      margin: EdgeInsets.only(bottom: 15),
      child: RaisedButton(
       color: Colors.red,
       shape: StadiumBorder(),
       child: Text(
        '立即更新',
        style:
         TextStyle(fontSize: 20, color: Colors.white),
       ),
       onPressed: () {
        ToastUtil.showTips('下载apk');
       }),
      )
     ],
     ),
    ),
    ],
   ),
   ),
   GestureDetector(
   onTap: () {
    Navigator.pop(context);
   },
   child: Offstage(
    offstage: isForce,
    child: Container(
     margin: EdgeInsets.only(top: 30),
     child: Image.asset(
     AssetsUtil.getImagePath(
      imageName: 'ic_update_close', suffix: 'png'),
     width: 35,
     height: 35,
     )),
   ),
   )
  ],
  ),
 );
 }

 static showUpdateDialog(
  BuildContext context, String mUpdateContent, bool mIsForce) {
 return showDialog(
  barrierDismissible: false,
  context: context,
  builder: (BuildContext context) {
   return WillPopScope(
    child: UpdateDialog(
     upDateContent: mUpdateContent, isForce: mIsForce),onWillPop: _onWillPop);
  });
 }

 static Future<bool> _onWillPop() async{
 return false;
 }
}

调用Dialog:

_checkUpdate() async{
 int serviceVersionCode = 101;
 PackageInfo packageInfo = await PackageInfo.fromPlatform();
 //获取当前的版本号
 int currentVersionCode = int.parse(packageInfo.version.replaceAll('.', ''));
 //如果获取服务器的版本号比当前应用程序的版本号还高,那么提示升级
 if (serviceVersionCode > currentVersionCode) {
  if(Platform.isAndroid){
  //Android平台在应用内进行更新
  //弹出"版本更新"的对话框
  UpdateDialog.showUpdateDialog(context, '1.修复已知bug\n2.优化用户体验', false);
  }else if(Platform.isIOS){
  //iOS平台跳转道AppStore进行更新
  }
 }
 }

重点说明:

屏蔽物理返回键(因为强更的时候点击返回键,弹窗会消失)

barrierDismissible: false,

4.点击弹窗外透明区域时,弹窗不消失

return WillPopScope(
    child: UpdateDialog(
     upDateContent: mUpdateContent, isForce: mIsForce),
    onWillPop: _onWillPop);

 static Future<bool> _onWillPop() async {
 return false;
 }

到此这篇关于Flutter之自定义Dialog实现版本更新弹窗功能的实现的文章就介绍到这了,更多相关Flutter自定义Dialog弹窗内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Android帧率监测与优化技巧

    Android帧率监测与优化技巧

    Android 应用的性能优化是开发过程中至关重要的一环,而帧率(Frame Rate)是评估应用性能的一个关键指标,在本文中,我们将深入探讨如何监测 Android 应用的帧率,以及如何通过代码示例来优化应用的性能,需要的朋友可以参考下
    2023-10-10
  • Android消息个数提醒控件使用详解

    Android消息个数提醒控件使用详解

    这篇文章主要为大家详细介绍了Android消息个数提醒控件的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-11-11
  • android开发基础教程—文件存储功能实现

    android开发基础教程—文件存储功能实现

    文件存储功能在实现数据读写时会频繁使用到,接下来介绍文件存储功能的实现,感兴趣的朋友可以了解下
    2013-01-01
  • 使用ViewPager实现高仿launcher左右拖动效果

    使用ViewPager实现高仿launcher左右拖动效果

    今天用ViewPager这个类实现了同样的左右拖动效果,这样代码更少,但是效果是一样的,ViewPager是实现左右两个屏幕平滑地切换的一个类,它是Google提供的,有需要的朋友可以了解下
    2013-01-01
  • Android的OkHttp包处理用户认证的代码实例分享

    Android的OkHttp包处理用户认证的代码实例分享

    OkHttp包(GitHub主页github.com/square/okhttp)是一款高人气安卓HTTP支持包,这里我们来看一下Android的OkHttp包处理用户认证的代码实例分享:
    2016-07-07
  • Android中persistent属性用法详解

    Android中persistent属性用法详解

    这篇文章主要介绍了Android中persistent属性用法,详细分析了persistent属性的功能及相关用法,需要的朋友可以参考下
    2016-06-06
  • 全面解析Android中对EditText输入实现监听的方法

    全面解析Android中对EditText输入实现监听的方法

    这篇文章主要介绍了Android中对EditText输入实现监听的方法,包括一个仿iOS的带清除功能的ClearEditText输入框控件的详细使用介绍,需要的朋友可以参考下
    2016-04-04
  • Android实现水波纹扩散效果的实例代码

    Android实现水波纹扩散效果的实例代码

    这篇文章主要介绍了Android实现水波纹扩散效果的实例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-05-05
  • Android实现ListView控件的多选和全选功能实例

    Android实现ListView控件的多选和全选功能实例

    这篇文章主要介绍了Android实现ListView控件的多选和全选功能,结合实例形式分析了ListView控件多选及全选功能的布局与功能实现技巧,需要的朋友可以参考下
    2017-07-07
  • Flutter事件监听与EventBus事件的应用详解

    Flutter事件监听与EventBus事件的应用详解

    EventBus的核心是基于Streams。它允许侦听器订阅事件并允许发布者触发事件,使得不同组件的数据不需要一层层传递,可以直接通过EventBus实现跨组件通讯
    2023-04-04

最新评论