Unity 工具之 UniWebView 内嵌网页/浏览器到应用中,并且根据UGUI大小放置(简单适配UGUI)

目录

Unity 工具之 UniWebView 内嵌网页/浏览器到应用中,并且根据UGUI大小放置(简单适配UGUI)

一、简单介绍

二、UniWebView 组件上的几个参数属性选项介绍

三、一些关键接口介绍

四、Transition

五、Memory Management(内存管理)

六、Messaging System

七、注意实现

八、效果预览

九、实现 通过UGUI控制 WebView 大小的使用的具体步骤

十、关键代码

十一、参考工程


一、简单介绍

Unity 工具类,自己整理的一些游戏开发可能用到的模块,单独独立使用,方便游戏开发。

本节介绍,使用 UniWebView 内嵌网页/浏览器到应用中,并通过 UGUI 控制 Web View 大小显示的方法。方法不唯一,这里仅供参考。

UniWebView 包含一组 C# 的高层级 API,它对 iOS 和 Android 平台的本机 API 进行了抽象封装。使用 UniWebView,您可以在无需了解本机开发的任何内容的情况下,就将浏览器行为添加到游戏中。当您需要显示活动公告及通知,或为玩家排名添加排行板,或是向用户显示任何网页内容时,UniWebView 都可以帮助您轻松解决问题。

UniWebView 支持 在iOS 9.0 或更高版本,以及 Android 5.0 (API Level 21) 或更高版本。它还包含在 macOS 上的 Unity Editor 的完整功能支持。

功能:

  • 网络浏览

  • 载入本地 HTML 文件

  • JavaScript 完整支持

  • 基于 url scheme 的消息系统

  • 通过绝对值或引用 Unity UI 元素的相对值来设置位置和大小

  • 播放 YouTube,Vimeo 或本地视频

  • 获取照片和上传

注意:UniWebView 使用版本为 UniWebView 3.7.0

二、UniWebView 组件上的几个参数属性选项介绍

1、Url On Start

在UniWebView的Start() 方法里会加载url

2、Show On Start

勾选的话会在Start()方法里主动显示。

未勾选的话需要主动调用Show()方法

3、Full Screan

全屏展示,勾选上的话会忽略Frame 和 Reference Rect Transform的设置

4、使用固定大小展示的话 设置 Frame的值,并且取消勾选Full Scream,以及

Reference Rect Transform 设置为None

5、Reference Rect Transform

引用一个Rect Transform并更改web view的大小以遵循该转换。如果您正在使用具有多个分辨率支持的Unity UI,那么它是非常有用的。

6、Use Toolbar

勾选后只在ios已经mac上有用。包括关闭,前进,返回等。可以设置Toolbar Position 为Top,则在顶端显示,Bottom 则在底端显示。android的导航栏就有这些功能,所以不需要这个。

7、一旦UniWebView被Done按钮或Back按钮关闭,它将在默认情况下销毁组件本身,以便尽快释放资源。您将无法重用相同的UniWebView。如果想要显示另一个页面,则需要创建一个新的UniWebView。

三、一些关键接口介绍

1、OnPageFinished 当url加载完毕后调用

也可以使用方法作为委托侦听器(delegate Listener)

参考: https://msdn.microsoft.com/en-us/library/018hxwa8.aspx

2、OnShouldClose

OnShouldClose是在web视图即将关闭时发送给您的事件。用户可以使用iOS上的“完成”按钮或Android上的“后退”按钮。一旦web view关闭,UniWebView组件也将被销毁,以保持干净。如果您在引用中保存web视图(例如,我们在这里通过webView字段保存web视图),那么很有可能将其设置为null。否则,如果你想要加入的话,你以后可能会遇到麻烦。

tips:

在Android上,“后退”按钮将引导用户返回到上一个页面。如果没有返回的页面,它将发送OnShouldClose事件,如果返回true,则尝试关闭web view。

3、EvaluateJavaScript 调用 JavaScript 方法

第一个参数:JavaScript 的方法

第二个参数:第二个参数是带有UniWebViewNativeResultPayload的操作。payLoad也用于其他web view的方法回调,其中包含来自本机端的基本信息。这里我们只需要检查下状态码,“0”表示一切正常。

4、OnMessageReceived

html里需要有

四、Transition

1、显示/隐藏过渡

通过修改Show 和 Hide的参数

fade 淡入淡出效果

edge 出现/消失的方向 eg:UniWebViewTransitionEdge.Bottom 从底部出现

duration 持续时间

completionHandler:完成后回调

tip:这两个方法有个bool返回值,每次只允许进行一个转换,如果您试图在上一个转换打开时初始化另一个转换,那么新的转换将不会启动,返回值将为false。

2、Web View Animation

UniWebView还支持在显示web视图时对其进行动画处理。使用AnimateTo方法,就可以指定一个帧作为目标帧。通过使用此方法,您还可以设置动画的持续时间和延迟,以便进行精细的控制。

五、Memory Management(内存管理)

1、在不需要时销毁web视图

2、如果web视图的holder组件(本例中为MyMonoBehaviour组件)有可能被破坏,您可能还需要在MyMonoBehaviour中添加OnDestroy,并关闭web视图以防止泄漏:

3、将一个监听器添加到OnShouldClose事件中,在关闭用户操作的web view时,Android和iOS将调用该事件。

tip:如果return false , 视图不会被关闭。OnShouldClose让我们有机会重写关闭方法。

4、在使用webView的MyMonoBehaviour网站的其他部分,你可以在使用webView之前检查它是否为null:

5、在不使用时清理缓存

当用户浏览Internet时,它将创建一些缓存,包括缓存的图像和响应,或者web页面将一些内容存储在本地存储中。虽然在大多数情况下它不会占用内存,但是如果您没有在这种情况下使用缓存,您可以调用CleanCache清除它们。

六、Messaging System

1、UniWebView通常情况下检查所有从"uniwebview://"启动的链接。OnMessageReceived事件将会收到UniwebViewMessage object

UniWebView消息传递系统还可以帮助您解析输入

2、添加你自己的scheme

3、也可以设置"http"和"https"作为一个scheme,它将阻止所有web资源的加载并将它们发送给您。这给了一个检查所有交通的机会。

eg:它的一个用例是您不希望您的用户离开当前页面。因此,您可以首先加载您的页面,然后在OnPageFinished事件中,通过向UniWebView消息系统添加“http(s)”方案来禁用所有导航:

4、消息系统构建在URL和Unity的消息发送器上。这意味着您不能同时发送无限大小的数据。URL的最大允许长度与设备和系统版本不同。但是一个URL的安全长度是~16KB。如果你有什么大的东西从网页发送到Unity并且遇到一些问题,最好把它们分成小块。

更多接口信息可到官网,或者查看插件的接口说明,这里不再赘述

七、注意实现

1、由于UniWebView 是贴屏显示的,所以在UGUI中的的UI组件在Web显示后会被覆盖掉

2、由于UniWebView 是贴屏幕显示,所以在AR/VR 3D世界中使用不是很有好

3、UniWebView 不支持 PC端,所以请打包到 Android 或者 IOS 设备上运行

八、效果预览

九、实现 通过UGUI控制 WebView 大小的使用的具体步骤

1、打开Unity,导入 UniWebView 插件

2、在场景中搭建 UI

3、新建脚本,编写脚本,并添加到 UI 控件上,对应赋值脚本

4、添加 UniWebView 脚本给 Web_Image,把Web_Image 赋值 UniWebView 的 Reference Rect Transform,这样 Web_Image ,并且取消 Full Screen ,这样就可以控制 Web View 大小随 Web_Image 了

5、打包,到设备上运行,效果如下

十、关键代码

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
36
37
38
39
40
41
42
43
44
45
46
47
48

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;


public class WebViewUI : MonoBehaviour {


    public UniWebView uniWebView;
    public Text state;
    public Button openUrlBtn;

    // Use this for initialization
    void Start()
    {
        uniWebView.OnPageFinished += (UniWebView webView, int statusCode, string url) => {
            uniWebView.Show();
            state.text = "";
        };

        uniWebView.OnPageStarted += (UniWebView webView, string url)=>{
            uniWebView.Hide();
            state.text = "Loading...";
        };

        uniWebView.OnPageErrorReceived += (UniWebView webView, int errorCode, string errorMessage)=>{
            state.text = "Error:" + errorCode;
        };

        openUrlBtn.onClick.AddListener(()=> {
            Load("http://www.baidu.com");
        });

       
    }

    public void Load(string url)
    {
        gameObject.SetActive(true);
        uniWebView.CleanCache();
        uniWebView.Load(url);
    }

    public void Close(){
        gameObject.SetActive(false);
    }
}

十一、参考工程

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/388178.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

OJ刷题:找出单身狗1,2【建议收藏点赞】

目录 1. 单身狗12. 单身狗2 1. 单身狗1 代码实现&#xff1a; #include <stdio.h>int main() {int arr[] { 1,2,3,2,1 };int sz sizeof(arr) / sizeof(arr[0]);int i 0;int tmp 0;for (i 0; i < sz; i){tmp ^ arr[i];}printf("%d\n", tmp);return 0; …

微信小程序介绍、账号申请、开发者工具目录结构详解及小程序配置

目录 一、微信小程序介绍 1.什么是小程序&#xff1f; 2.小程序可以干什么&#xff1f; 3.微信小程序特点 二、账号申请 1.账号注册 2.测试号申请 三、安装开发工具 四、开发小程序 五、目录结构 JSON 配置 小程序配置 app.json 工具配置 project.config.json 页…

PHP毕业设计图片分享网站76t17

图片分享网站主要是为了提高工作人员的工作效率和更方便快捷的满足用户&#xff0c;更好存储所有数据信息及快速方便的检索功能&#xff0c;对系统的各个模块是通过许多今天的发达系统做出合理的分析来确定考虑用户的可操作性&#xff0c;遵循开发的系统优化的原则&#xff0c;…

Linux 查看 系统基本信息 uname

基本用法&#xff1a; 在终端中输入"uname"即可显示系统的内核名称。 可以结合不同的参数使用&#xff0c;获取更详细的系统信息。 常见参数&#xff1a; “-s”&#xff1a;显示操作系统名称。 “-n”&#xff1a;显示网络节点主机名。 “-r”&#xff1a;显示内核版…

【初中生讲机器学习】9. 我是怎么用朴素贝叶斯实现垃圾邮件分类的?真的超全!

创建时间&#xff1a;2024-02-14 最后编辑时间&#xff1a;2024-02-15 作者&#xff1a;Geeker_LStar 你好呀~这里是 Geeker_LStar 的人工智能学习专栏&#xff0c;很高兴遇见你~ 我是 Geeker_LStar&#xff0c;一名初三学生&#xff0c;热爱计算机和数学&#xff0c;我们一起加…

Java学习第十四节之多维数组和Arrays类讲解

多维数组 package array;public class ArrayDemo05 {public static void main(String[] args) {//[4][2] 面向对象/*1,2 array[0]2,3 array[1]3,4 array[2]4,5 array[3]*/int[][] array {{1,2},{2,3},{3,4},{4,5}};for (int i 0; i <array.length; i) {for (int…

Pandas数据库大揭秘:read_sql、to_sql 参数详解与实战篇【第81篇—Pandas数据库】

Pandas数据库大揭秘&#xff1a;read_sql、to_sql 参数详解与实战篇 Pandas是Python中一流的数据处理库&#xff0c;而数据库则是数据存储和管理的核心。将两者结合使用&#xff0c;可以方便地实现数据的导入、导出和分析。本文将深入探讨Pandas中用于与数据库交互的两个关键方…

Linux 基础/子目录分配/文件路径

在Linux系统中&#xff0c;整个系统只具有一个根目录“/”&#xff0c;用斜杠表示。根目录是整个文件系统的顶层目录&#xff0c;在他下面可以创建其他的目录和文件。 Linux中的子目录分配&#xff1a; /bin - 基本命令的二进制文件&#xff0c;这些命令可供所有用户使用&am…

数据结构第十四天(树的存储/双亲表示法)

目录 前言 概述 接口&#xff1a; 源码&#xff1a; 测试函数&#xff1a; 运行结果&#xff1a; 往期精彩内容 前言 孩子&#xff0c;一定要记得你的父母啊&#xff01;&#xff01;&#xff01; 哈哈&#xff0c;今天开始学习树结构中的双亲表示法&#xff0c;让孩…

SB+AVL——二刷错误总结

码云 SBTree insert中对头节点的处理 void Insert(int val){Node* node new Node(val);// 找插入位置if (_root nullptr){_root node;return;}else{Node* pre _root, *head _root;while (head){pre head;if (head->_val < val) head head->_right;else if (h…

P1259 黑白棋子的移动题解

题目 有2n个棋子排成一行&#xff0c;开始为位置白子全部在左边&#xff0c;黑子全部在右边&#xff0c;如下图为n5的情况&#xff1a; 移动棋子的规则是&#xff1a;每次必须同时移动相邻的两个棋子&#xff0c;颜色不限&#xff0c;可以左移也可以右移到空位上去&#xff0c…

【C++】内存管理方式--new/delete

&#x1f490; &#x1f338; &#x1f337; &#x1f340; &#x1f339; &#x1f33b; &#x1f33a; &#x1f341; &#x1f343; &#x1f342; &#x1f33f; &#x1f344;&#x1f35d; &#x1f35b; &#x1f364; &#x1f4c3;个人主页 &#xff1a;阿然成长日记 …

Repo命令使用实例(三十八)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

(01)Hive的相关概念——架构、数据存储、读写文件机制

目录 一、架构及组件介绍 1.1 Hive整体架构 1.2 Hive组件 1.3 Hive数据模型&#xff08;Data Model&#xff09; 1.3.1 Databases 1.3.2 Tables 1.3.3 Partitions 1.3.4 Buckets 二、Hive读写文件机制 2.1 SerDe 作用 2.2 Hive读写文件流程 2.2.1 读取文件的过程 …

BUGKU-WEB 你必须让他停下

题目描述 题目截图如下&#xff1a; 进入场景看看&#xff1a; 解题思路 图片会消失,那应该是使用了js来控制根据提示,那就是要停止js才会看到flag (也就是要抓包,不要陷入停止js的思维) 相关工具 F12大法Burp Suit抓包工具 解题步骤 出现图片的时候,源码中确实出现…

ICLR 2023#Learning to Compose Soft Prompts for Compositional Zero-Shot Learning

组合零样本学习&#xff08;CZSL&#xff09;中Soft Prompt相关工作汇总&#xff08;一&#xff09; 文章目录 组合零样本学习&#xff08;CZSL&#xff09;中Soft Prompt相关工作汇总&#xff08;一&#xff09;ICLR 2023#Learning to Compose Soft Prompts for Compositional…

Android之Android.bp文件格式语法(一百八十六)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

力扣hot3--并查集+哈希

第一想法是排个序然后遍历一遍&#xff0c;but时间复杂度就超啦 并查集居然与哈希结合了&#xff08;&#xff09; 已经好久没用过并查集了&#xff0c;&#xff0c;&#xff0c;我们用哈希表f_node中来记录原结点的父节点&#xff0c;其中key是原结点&#xff0c;value是父节点…

Github项目推荐-Tiny-Rdm

项目地址 GitHub - tiny-craft/tiny-rdm: A Modern Redis GUI Client 项目简述 一个开源的Redis管理工具&#xff0c;有漂亮的界面和丰富的功能。使用的编程语言如下 项目截图

【Qt】环境安装与初识

目录 一、Qt背景介绍 二、搭建Qt开发环境 三、新建工程 四、Qt中的命名规范 五、Qt Creator中的快捷键 六、QWidget基础项目文件详解 6.1 .pro文件解析 6.2 widget.h文件解析 6.3 widget.cpp文件解析 6.4 widget.ui文件解析 6.5 main.cpp文件解析 七、对象树 八、…