【笔记】Trae+Andrioid Studio+Kotlin开发安卓WebView应用

【笔记】Trae+Andrioid Studio+Kotlin开发安卓WebView应用

文章目录

简介

使用Trae配合Andriod Studio开发一个内嵌WebView的安卓应用, 在WebView中加载本地资源, 在APP中捕获按键事件对WebView中的内容进行操作;

依赖

  • Trae CN (https://www.trae.com.cn/)
  • Andriod Studio (https://developer.android.google.cn/studio?hl=zh-cn), 以下简称AS
    • 吃内存, 占用了我大约6GB内存
    • 下载项目依赖和安卓虚拟机(约2GB)依赖网络
  • 基础的编程知识

步骤

AS(Andriod Studio)创建项目

  • 在AS打开新窗口后, 等待右下角进度条初始化完毕(下载依赖和编译)

打开AS, 创建一个Empty Activity

在这里插入图片描述


在这里插入图片描述

AS创建虚拟机

启动模板项目

在这里插入图片描述


在这里插入图片描述

找到镜像, 如果是灰色的, 需要点击下载图标进入下载界面(大约2G, 非常依赖网络)

在这里插入图片描述


在这里插入图片描述

在右上角创建虚拟机

在这里插入图片描述


在这里插入图片描述

TRAE CN 修改项目

  • 使用Trae打开该文件夹
  • 按下Ctrl+U开启右侧AI工具

按下Ctrl+P, 在顶部打开的输入框中输入Main, 选择MainActivity.kt

在这里插入图片描述

新增按键捕获功能

  • 输入提示"我想要安卓应用可以捕获键盘的上下2个方向键并打印日志信息"
  • 鼠标点击模拟器中的应用的白色区域, 后按下上下键, 可看到日志输出

切换到日志查看界面

在这里插入图片描述

打开AS, 会自动刷新代码, 点击右上角的绿色重启按钮或者启动按钮重新编译和启动

在这里插入图片描述


在这里插入图片描述

生成完毕后, 在提示框的上方选择"全部接受"

在这里插入图片描述

新增WebView

  • 输入提示"我想将Greeting中的Text控件替换为Webview"
    • 生成完毕后, 选择"全部接受"
  • 回到AS, 点击右上角的绿色重启按钮或者启动按钮重新编译和启动
  • 回到TRAE, 输入提示信息界面提示"webpage not avalible"
    • 在点击"全部接受"前, 我看了修复内容, 它没添加网络权限还把地址改成google了, 这个方案是不行的, 所以点击"全部拒绝"
  • 重新输入提示"应该是没有配置网络权限, 修复一下"
    • 它给"AndroidManifest.xml"的文件内容清空了, 添加了一行权限代码, 这个方案是不行的, 所以点击"全部拒绝"
  • 重新输入提示"应该是没有配置网络权限, 添加一下相关的权限, 注意不要影响原有的配置信息"
  • 还是无法打开页面
  • 此时发现按键事件的捕获失效了
  • 回到AS, 编译报错了, 把提示信息MainActivity.kt:61:17 Modifier 'override' is not applicable to 'local function'发给TRAE
    • 新回复删除了override解决了报错, 但是没有解决按键的问题
  • 重启项目, 成功解决按键问题

重新输入提示"不行, 按键事件还是没有被APP捕获到", 生成了新回复

在这里插入图片描述

输入提示信息"按键事件被Webview捕获了导致应用程序的无法捕获上下键了, 修复一下" (这里我之前尝试过几次提问, 最后发现是Webview优先处理了事件导致的)

在这里插入图片描述

还是不行, 换了百度网址也不行, 打开自带的谷歌浏览器也访问不了网络, 最后是在下拉的通知栏里重新开关wifi后解决(上一步操作没有成功停止虚拟机)

在这里插入图片描述

重启后还是不能打开页面, 重启一下虚拟机

在这里插入图片描述


在这里插入图片描述

回到TRAE输入提示信息"还是提示"webpage not avalible", 是不是还缺少哪个网络权限", 给出新的修复

在这里插入图片描述

回到AS重启项目, 结果提示xml有问题, 仔细一看, 它代码加错位置了, 手动调整一下, 向下挪动一行

在这里插入图片描述

这次正确的添加了权限, 选择接受

在这里插入图片描述

出现了网络连接的错误

在这里插入图片描述

这里有个报错信息, 把鼠标移动到红色的文字上会给出提示, 点击import修复一下

在这里插入图片描述

WebView加载本地资源

  • 输入提示"我想打印webview都请求了哪些链接"
  • 输入提示"本地资源文件需要放在哪个目录, 帮我生成一个示例"

有2个导入报错, 鼠标移动到红色文字上, 给出了提示信息, 点击import导入一下, 重启项目

在这里插入图片描述

还需要修改一下拦截的地址(下面的日志打印又改回错误的了, 手动修复一下)

在这里插入图片描述

这里给出了2步, 一个是手动创建本地文件夹和文件, 一个是修改MainActivity.kt(没有自动修改, 可以点击应用按钮)

在这里插入图片描述


在这里插入图片描述


在这里插入图片描述

输入提示信息"我想在shouldInterceptRequest中拦截请求, 然后加载本地的资源文件"

在这里插入图片描述

新增了一个shouldInterceptRequest方法, 这里的斜杠是多余的, 导致没能正确打印日志, 手动删除一下

在这里插入图片描述


在这里插入图片描述

在按键回调中向WebView注入JS代码

  • 输入提示信息"我想在onKeyDown的回调中修改WebView中的显示内容"
  • 输入提示信息"我想在onKeyDown的回调中修改Greeting中创建的WebView中的显示内容"
    • 这次他给WebView加了个全局变量webViewInstance, 但是修改后的代码少了花括号, 手动修复一下
  • 发现没效果, 手动加了日志打印了一下日志发现webViewInstance是空的
  • 输入提示信息"webViewInstance是null, 是不是哪里有问题, 导致没赋值成功"
    • 只是加了日志, 没解决
  • 输入提示信息"Greeting 中返回 webView 的时候, webView 还没初始化吧?"
    • 发癫了, 胡乱输出
  • 输入提示信息"AndroidView 中是不是异步执行的, 导致返回的webview是null"
    • 偷懒了, 不想解决问题, 一味的加日志
  • 输入提示信息"已打印日志确认Greeting中返回的webView是null"
  • 输入提示信息"通过日志发现WebViewReturn提示webView有值, WebViewRequests处为null, 且WebViewRequests 先WebViewReturn输出, 可以确定AndroidView异步执行导致的返回null, 修复一下"
    • 这次改成了回调的方式, 成功解决
  • 在控制台直接粘贴JS, 发现js没有问题

重启, 按下上键, 成功解决

在这里插入图片描述

输入提示信息"evaluateJavascript 没有效果", 给出新修复

在这里插入图片描述

发现没效果, 打开Edge, 访问"edge://inspect/#devices", chrome不行, 会超时然后显示404

在这里插入图片描述

没注意看, 重新输入提示"不要使用webViewInstance?.loadUrl, 使用注入JS的方式"

在这里插入图片描述

手动修改一下

在这里插入图片描述

输入提示信息"不要跳转到new-url, 而是执行JS代码"

在这里插入图片描述

还是加日志

在这里插入图片描述

给了一个通过findViewById实现的方法, 接受后发现不能用, 退回一下

在这里插入图片描述

最终关键代码

  • MainActivity.kt
package com.example.dm2 import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.tooling.preview.Preview import com.example.dm2.ui.theme.DM2Theme import android.util.Log import android.view.KeyEvent import android.webkit.WebView import android.webkit.WebViewClient import android.webkit.WebResourceRequest import android.webkit.WebResourceResponse import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.viewinterop.AndroidView import java.io.IOException var webViewInstance: WebView?=nullclass MainActivity :ComponentActivity(){overridefunonCreate(savedInstanceState: Bundle?){super.onCreate(savedInstanceState) setContent { DM2Theme {Surface( modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background ){Greeting("Android"){ webView -> webViewInstance = webView }}}}}overridefunonKeyDown(keyCode: Int, event: KeyEvent?): Boolean {when(keyCode){ KeyEvent.KEYCODE_DPAD_UP ->{ Log.d("KeyEvent","上方向键被按下"+ webViewInstance) webViewInstance?.evaluateJavascript("document.body.innerText = new Date();",null)returntrue}}returnsuper.onKeyDown(keyCode, event)}}@ComposablefunGreeting(name: String, modifier: Modifier = Modifier, onWebViewCreated:(WebView)-> Unit ={}){val context = LocalContext.current AndroidView( factory ={ ctx ->val webView =WebView(ctx).apply{ settings.javaScriptEnabled =true Log.d("WebViewInit","WebView实例已创建: $this") webViewClient =object:WebViewClient(){overridefunshouldInterceptRequest(view: WebView, request: WebResourceRequest): android.webkit.WebResourceResponse?{val url = request.url.toString()if(url.equals("https://www.example.com/")){try{val inputStream = context.assets.open("example.html")returnWebResourceResponse("text/html","UTF-8", inputStream)}catch(e: IOException){ e.printStackTrace()}} Log.d("WebViewRequests","请求链接: ${request.url}")returnsuper.shouldInterceptRequest(view, request)}}loadUrl("https://www.example.com") isFocusable =false isFocusableInTouchMode =falsefunonKeyDown(keyCode: Int, event: KeyEvent): Boolean {returnfalse}}onWebViewCreated(webView)return@AndroidView webView }, modifier = modifier )}@Preview(showBackground =true)@ComposablefunGreetingPreview(){ DM2Theme {Greeting("Android")}}
  • AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?><manifestxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"><uses-permissionandroid:name="android.permission.INTERNET"/><uses-permissionandroid:name="android.permission.ACCESS_NETWORK_STATE"/><uses-permissionandroid:name="android.permission.ACCESS_WIFI_STATE"/><applicationandroid:allowBackup="true"android:dataExtractionRules="@xml/data_extraction_rules"android:fullBackupContent="@xml/backup_rules"android:icon="@mipmap/ic_launcher"android:label="@string/app_name"android:roundIcon="@mipmap/ic_launcher_round"android:supportsRtl="true"android:theme="@style/Theme.DM2"tools:targetApi="31"><activityandroid:name=".MainActivity"android:exported="true"android:label="@string/app_name"android:theme="@style/Theme.DM2"><intent-filter><actionandroid:name="android.intent.action.MAIN"/><categoryandroid:name="android.intent.category.LAUNCHER"/></intent-filter></activity></application></manifest>
  • example.html
<!DOCTYPEhtml><htmllang="zh-CN"><head><metacharset="UTF-8"><title>示例页面</title></head><body><h1>这是一个本地资源文件示例</h1><p>该文件从 Android 的 assets 目录加载。</p></body></html>

吐槽

  • java是大家闺秀, js是小伙子, kotlin简直是耍**, 那语法糖看的我抓耳挠腮

Read more

FPGA实现MIPI协议全解析 + MIPI协议完整时序规范

FPGA实现MIPI协议全解析 + MIPI协议完整时序规范

一、MIPI协议核心基础认知 百度网盘链接:https://pan.baidu.com/s/1rDsLAXGj8WbX82teSkhuIw?pwd=1234 提取码: 1234 包含FPGA系统学习资料,免费分享 1. MIPI协议定义与核心特点 MIPI(Mobile Industry Processor Interface,移动产业处理器接口)是由MIPI联盟制定的高速串行差分接口协议,最初为手机、平板等移动设备设计,目前广泛应用于FPGA/嵌入式的图像采集(摄像头)、显示驱动(液晶屏)、高速数据传输 场景。 核心特点: ✅ 采用差分信号传输,抗干扰能力强、EMI电磁辐射小; ✅ 支持高低速双模切换,兼顾高速大数据传输和低速控制指令传输; ✅ 串行传输,引脚数量极少(对比并行RGB的几十根引脚,MIPI仅需时钟+1~4路数据差分对),硬件设计简洁; ✅ 传输速率高:单lane(数据通道)速率可达1Gbps~

[论文阅读] AI + 软件工程 | AI辅助编程时代,新手真能替代资深开发者吗?这份实证研究给出答案

[论文阅读] AI + 软件工程 | AI辅助编程时代,新手真能替代资深开发者吗?这份实证研究给出答案

AI辅助编程时代,新手真能替代资深开发者吗?这份实证研究给出答案 论文信息 1. 原标题:Novice Developers Produce Larger Review Overhead for Project Maintainers while Vibe Coding 2. 主要作者:Syed Ammar Asdaque、Imran Haider、Muhammad Umar Malik、Abdul Ali Bangash、Maryam Abdul Ghafoor 3. 研究机构:巴基斯坦拉合尔管理科学大学(Lahore University of Management Sciences) 4. 发表会议:23rd International Conference on Mining Software

视程空间(Vision Space)机器人高算力开发板重磅登场

视程空间(Vision Space)机器人高算力开发板重磅登场

算力革新 智驱未来 ARC SC6N0 Thor AGX 128GB T5X(T5000)       当物理AI时代加速到来,人形机器人协同作业、服务机器人精准响应、特种机器人突破极限场景的需求日益迫切,机器人开发的核心痛点——算力瓶颈、存储不足、场景适配受限,正成为制约产业升级的关键壁垒。在此背景下,视程空间深度整合NVIDIA前沿技术,重磅推出机器人开发板专用系列旗舰产品——ARC SC6N0 Thor AGX 128GB T5X(T5000),以Blackwell架构为核心,以巅峰算力与全维适配为支撑,重新定义机器人开发板性能标杆,为全球机器人开发者点亮创新之路,助力千行百业实现智能化转型。         作为ARC SC6N0全谱系产品矩阵中的旗舰力作,ARC SC6N0 Thor AGX 128GB T5X(T5000)并非简单的硬件堆叠,而是基于机器人开发全场景需求深度优化的一体化算力解决方案,融合了视程空间在AI硬件领域的深厚积淀与NVIDIA在物理AI领域的技术突破,从算力、存储、架构到生态,实现全方位跨越式升级,让机器人开发更高效、

FPGA 项目开发完整流程及常用工具梳理(工程向,收藏专用)

FPGA 项目开发完整流程及常用工具梳理(工程向,收藏专用)

很多刚接触 FPGA 的同学,会下意识把注意力放在“语法”“IP”“例程”上。 但真正做过项目之后就会发现: FPGA 工程从来不是“把代码写对”这么简单。 一个 FPGA 项目能不能顺利交付,往往取决于你是否具备完整的工程视角,而不是会不会某几条 always 块。 从需求理解,到代码实现,再到板级调试,FPGA 工程师的工作,本质上是一条不断自证、不断修正的工程闭环。 下面就从工程实践角度,梳理一套FPGA 项目中常见、且真正有用的开发流程与工具。 一、理解需求与系统背景(不是一上来就写代码) FPGA 项目的第一步,永远不是打开 Vivado / Quartus。 而是把下面几件事搞清楚: * 这个 FPGA 在系统中扮演什么角色 * 数据从哪里来,到哪里去 * 上下游是谁(CPU / ADC / PHY / 传感器