牙叔教程 简单易懂
这种setImageBitmap必须主动回收图片,
bitmap已经赋值给了你定义的变量, 既然你给图片添加了新的引用,
那么这张图片就归你管, 系统就不管了
"ui";
ui.layout(
<vertical>
<img id="img"></img>
</vertical>
);
let img = images.read(imgPath);
let bitmap = img.bitmap;
ui.img.setImageBitmap(bitmap);
events.on("exit", function () {
img.recycle();
});
这种就不用自己主动回收图片,
因为你没有对图片进行引用, 引用是系统自己搞的, 系统可以处理
"ui";
ui.layout(
<vertical>
<img id="img" src="file://{{imgPath}}"></img>
</vertical>
);
这种也不用自己主动回收图片, 原因同上
ui.layout(
<vertical>
<img id="img"></img>
</vertical>
);
ui.img.attr("src", "file://" + imgPath);
下面来看看RecyclerView中使用图片的情况
这是使用 img.attr("src", "file://" + data.imgPath);
不需要主动回收, 但是滑动rv的时候, 有点卡,
因为每次加载数据, 都去读取一遍图片
ui.layout(
<vertical>
<text text="牙叔教程 简单易懂" textSize="28sp" textColor="#fbfbfe" bg="#00afff" w="*" gravity="center"></text>
<androidx.recyclerview.widget.RecyclerView id="recyclerView"></androidx.recyclerview.widget.RecyclerView>
</vertical>
);
let imgPath = "/storage/emulated/0/脚本/ui界面图片回收/" + "road.jpg";
let dataList = [];
var len = 33;
for (var i = 0; i < len; i++) {
dataList.push({
imgPath: imgPath,
});
}
let recyclerView = ui.recyclerView;
let layoutManager = new LinearLayoutManager(context);
layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
recyclerView.setLayoutManager(layoutManager);
let recycleAdapter = createRecyclerViewAdapter(dataList);
recyclerView.setAdapter(recycleAdapter);
/* ---------------------------自定义函数----------------------------------------------- */
function createRecyclerViewAdapter(dataList) {
let boxXml = (
<horizontal id="horizontalParent">
<text id="num"></text>
<img id="img"></img>
</horizontal>
);
return RecyclerView.Adapter({
onCreateViewHolder: function (parent, viewType) {
log("onCreateViewHolder");
// 视图创建
let view;
let holder;
view = ui.inflate(boxXml, parent, false);
holder = JavaAdapter(RecyclerView.ViewHolder, {}, view);
return holder;
},
onBindViewHolder: function (holder, position) {
// log("onBindViewHolder");
// 数据绑定
let data = dataList[position];
holder.itemView.num.setText(position + "");
holder.itemView.img.attr("src", "file://" + data.imgPath);
},
getItemCount: function () {
return dataList.length;
},
});
}
我们把onBindViewHolder改写一下, 如果已经加载过一次图片, 就不用执行 img.attr("src"这个命令了,
这属于最简单的缓存吧
onBindViewHolder: function (holder, position) {
let data = dataList[position];
holder.itemView.num.setText(position + "");
if ("file://" + imgPath !== holder.itemView.img.attr("src")) {
log("需要读取图片");
holder.itemView.img.attr("src", "file://" + data.imgPath);
} else {
log("不需要读取图片");
}
},
修改之后, 除了一开始加载的前几张图片有点卡之外, 其他的一点都不卡, 丝滑的很,
那么问题还是有的, 如何让前几张图片, 滑动的时候, 也不要卡呢?
我们提前读取图片试试, 也就是用setImageBitmap
let imgPath = "/storage/emulated/0/脚本/ui界面图片回收/" + "road.jpg";
let dataList = [];
var len = 33;
let img = images.read(imgPath);
let bitmap = img.bitmap;
for (var i = 0; i < len; i++) {
dataList.push({
imgPath: imgPath,
img: img,
bitmap: bitmap,
});
}
events.on("exit", function () {
img.recycle();
});
ui.layout(
<vertical>
<text text="牙叔教程 简单易懂" textSize="28sp" textColor="#fbfbfe" bg="#00afff" w="*" gravity="center"></text>
<androidx.recyclerview.widget.RecyclerView id="recyclerView"></androidx.recyclerview.widget.RecyclerView>
</vertical>
);
let recyclerView = ui.recyclerView;
let layoutManager = new LinearLayoutManager(context);
layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
recyclerView.setLayoutManager(layoutManager);
let recycleAdapter = createRecyclerViewAdapter(dataList);
recyclerView.setAdapter(recycleAdapter);
/* ---------------------------自定义函数----------------------------------------------- */
function createRecyclerViewAdapter(dataList) {
let boxXml = (
<horizontal id="horizontalParent">
<text id="num"></text>
<img id="img"></img>
</horizontal>
);
return RecyclerView.Adapter({
onCreateViewHolder: function (parent, viewType) {
log("onCreateViewHolder");
// 视图创建
let view;
let holder;
view = ui.inflate(boxXml, parent, false);
holder = JavaAdapter(RecyclerView.ViewHolder, {}, view);
return holder;
},
onBindViewHolder: function (holder, position) {
let data = dataList[position];
holder.itemView.num.setText(position + "");
holder.itemView.img.setImageBitmap(data.bitmap);
},
getItemCount: function () {
return dataList.length;
},
});
}
试了一下bitmap, 真的很丝滑呢, 起码小米11pro是丝滑的,
我们的dataList有33条数据, 每条数据使用的都是同一张图片的bitmap,
我们来试试33张不同的图片, 看会不会卡顿
修改dataList即可, 注意, bitmap是需要自己主动回收的
let img = images.read(imgPath);
for (var i = 0; i < len; i++) {
let newImg = img.clone();
let bitmap = newImg.bitmap;
dataList.push({
imgPath: imgPath,
img: newImg,
bitmap: bitmap,
});
}
events.on("exit", function () {
img.recycle();
dataList.map(function (item) {
item.img.recycle();
});
});
基本和使用同一张图片的bitmap效果一样, 感觉不到卡顿.
这就表明, 读取图片是最消耗资源的, 我们尽量少的去读取图片, 尽量早的读取图片,
尤其要在ui中, 减少此类耗时操作, 不然, 卡顿是避免不了的.
现在加载33张图片, 还算可以吧.
如果我们加载3333张图片呢? 我觉得光是提前读取图片就会非常卡了, 非常耗时,
说不定就OOM了(Out Of Memory),
所以在数量级上去之后, 我们是不会提前读取全部图片的,
我们只会读取一小部分图片, 应该叫预加载吧,
手机是支撑不了同一时刻, 加载那么多图片数据的, 一会就卡爆了,
那么我们设定一个阈值, 只在同一时刻保存阈值以内数量的图片数据,
如果有新的图片需要显示, 那么就删掉以前的旧图片, 这个叫
LruCache（Least Recently Used Cache） 全称最近最少使用算法，其主要思想是使用SoftReference（或者WeakReference），因为我们的缓存容量是有限的，它会面临一个问题：当有新的内容需要加入我们的缓存，但我们的缓存空闲的空间不足以放进新的内容时，我们就需要舍弃原有的部分内容从而腾出空间用来放新的内容。
当然了, 写脚本估计用不到几张图片, 这个LurCache了解即可.
环境
手机: Mi 11 Pro
Android版本: 11
Autojs版本: 9.0.11
名人名言
思路是最重要的, 其他的百度, bing, stackoverflow, github, 安卓文档, autojs文档, 最后才是群里问问
--- 牙叔教程
声明
部分内容来自网络
本教程仅用于学习, 禁止用于其他用途
网友评论