webview_h5与原生增加权限索取行为交互(Flutter)

应各大应用市场上架要求,增加权限索取行为用户交互弹窗

详细: https://developer.huawei.com/consumer/cn/doc/app/FAQ-faq-05#h1-1698326401789-0

  1. flutter端使用permission_handler申请权限
  2. 注册一个MethodChannel,增加一个函数,提供安卓webview相机/麦克风等权限被触发时回调用到flutter端
bash 复制代码
static const platform = MethodChannel('webview_permission'); 
bash 复制代码
platform.setMethodCallHandler((MethodCall call) async {
	// 处理回调
	switch (call.method) {  
        case 'requestCameraPermission': 
         ...略
         // 回调showPermissionDialog
    }
}
  1. 增加一个通用权限交互弹窗
dart 复制代码
  /// 通用权限弹窗
  /// @permission
  /// @title
  /// @desc
  void showPermissionDialog(Permission permission) {
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8.0),
          ),
          title: Text(title),
          content: Text(desc),
          actions: <Widget>[
            TextButton(
              child: Text('去授权'),
              onPressed: () {
                Navigator.of(context).pop();
                // 处理权限授予逻辑
                permission.request().then((status) {
                  print(status.isGranted);
              });
              },
            ),
            TextButton(
              child: Text('不'),
              onPressed: () {
                // 处理权限拒绝逻辑
                Navigator.of(context).pop();
              },
            ),
          ],
        );
      },
    );
  }
  1. 安卓端同样注册MethodChannel
bash 复制代码
import android.content.pm.PackageManager;
import androidx.core.content.ContextCompat;
...略
//
methodChannel4Premission = new MethodChannel(messenger, "webview_permission");
methodChannel4Premission.setMethodCallHandler(this);
  1. webview发起申请权限索取时,判断是否已授权,未授权时通过methodChannel调用flutter弹窗向用户说明权限用途

判断是否已授权麦克风权限

bash 复制代码
if (ContextCompat.checkSelfPermission(WebViewFlutterPlugin.activity, Manifest.permission.RECORD_AUDIO) != PackageManager.PERMISSION_GRANTED) {
	   methodChannel4Premission.invokeMethod("requestMicroPhonePermission", null);
	 }

判断是否已授权相机权限

bash 复制代码
if (ContextCompat.checkSelfPermission(WebViewFlutterPlugin.activity, Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
        methodChannel4Premission.invokeMethod("requestCameraPermission", null);
      }
  1. flutter端批量索取权限
bash 复制代码
    // 列出需要请求的权限
    Map<Permission, PermissionStatus> statuses = {
      Permission.camera: await Permission.camera.status,
      Permission.location: await Permission.location.status,
      Permission.microphone: await Permission.microphone.status,
    };
    bool allPermissionsGranted = true;
    for (final entry in statuses.entries) {
      if (entry.value != PermissionStatus.granted) {
        allPermissionsGranted = false;
        break;
      }
    }
    if (allPermissionsGranted) {
      // 所有权限都已授权,调用成功的回调函数
      onSuccess();
    } else {
      // 批量索取权限
      await [
          Permission.camera,
          Permission.location,
          Permission.microphone,
        ].request();
    }
  
相关推荐
FrameNotWork11 小时前
HarmonyOS 照片浏览器手势交互实现:打造流畅的滑动体验
华为·交互·harmonyos
ZC跨境爬虫11 小时前
跟着 MDN 学CSS day_21:(图像溢出控制与表单元素样式定制)
前端·javascript·css·ui·交互
UXbot15 小时前
无需设计经验也能做原型:AI辅助工具功能评测
前端·人工智能·低代码·ui·ios·交互
UXbot17 小时前
企业AI开发工具:界面自动生成与前端代码交付能力详解
前端·人工智能·交互·web app·ui设计
小贺儿开发18 小时前
Unity UGUI 可视化热区编辑与交互系统
unity·编辑器·游戏引擎·交互·工具·适配·ugui
程序员老刘·18 小时前
Flutter 3.44 更新要点:很重要但暂时先别升级
flutter·ai编程·跨平台开发·客户端开发
用户862841295494418 小时前
Flutter rxflare 计算属性 computed:自动依赖追踪 + 缓存(超实用)
flutter
用户862841295494418 小时前
Flutter rxflare 性能测试(最终推荐版):1000 列表极致优化・官方最佳写法
flutter
用户862841295494419 小时前
Flutter rxflare 响应式编程:.obs + Rx 组件极简实战
flutter
用户862841295494419 小时前
Flutter rxflare 响应式进阶:Map/List 精准字段更新(高性能实战)
前端·flutter