目录
  1. 1. 效果图:
  2. 2. 代码概述
    1. 2.1. 显示页
    2. 2.2. 字符串类型的数字做比较
JSBOX-漫画小插件

GitHub:鼠绘漫画

版本记录


2019/4/11

  • 发布1.2版本了,哈哈哈哈哈哈哈哈哈~。可以获取全部的资源可,目前只有87部漫画。

2019/4/1

  • 发布1.0版本了…哈哈哈。官方换了接口,重新调整了接口。

之后应该会保证持续更新,应该吧。毕竟现在界面是真的丑啊

作为RSS重度用户,还是果断的采用RSS吧(让我手动点开app等更新,还不如直接推送给。毕竟我这么懒)

RSSHub-鼠绘漫画 传送门:鼠绘RSS接口

TODO:

  • 漫画还未针对腾讯的做优化
  • 显示界面有点问题
  • 数据持久化问题未解决
  • 不支持备份机制
  • 漫画显示页之后会添加更多功能

效果图:

效果图

嗯~动态图略卡…………..

代码概述

第一次尝试纯JavaScript编写的小插件(PS.我特么终于自己写出了带界面的程序,主要还是UIKit封装的很好,哈哈哈)

整个程序是基于JSBOX的底层!

显示页

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
49
50
51
52
$ui.render({
views: [
{
type: "list",
props: {
rowHeight: 80,
id: "index",
template: [
{
type: "image",
props: {
id: "image"
},
layout: (make, view) => {
make.left.top.bottom.inset(5);
make.width.equalTo(view.height);
}
},
{
type: "label",
props: {
id: "label",
font: $font("bold", 17),
lines: 0
},
layout: make => {
make.left.equalTo($("image").right).offset(10);
make.top.bottom.equalTo(0);
make.right.inset(10);
}
}
],
actions: [
{
title: "Share",
handler: (sender, indexPath) => {
var data = sender.object(indexPath);
$share.sheet([data.url, data.label.text]);
}
}
]
},
layout: $layout.fill,
events: {
didSelect: (sender, indexPath, data) => {
episodePage(data.animeID);
},
pulled: getAllComics
}
}
]
});

这是首屏的渲染,和vue原理一样,都是渲染和数据双向绑定。渲染层只需要负责渲染就行了,数据做的任何改变渲染层紧随着更新。

其余的界面同样原理,只是为了维持view栈,采用的$ui.push进行渲染。

字符串类型的数字做比较

我特么第一次知道"51""101"大–>限于JS对比数据。

1
2
3
4
5
6
7
8
9
10
11
// 补齐位数--->又特么递归,迟早会死翘翘!!!!
// 还没谁能把漫画更新到99999话,五位数足够了
function toSameLength(indexKey) {
newIndexKey = indexKey;
if (indexKey.length==5) {
return newIndexKey;
}else {
newIndexKey = "0" + newIndexKey;
return toSameLength(newIndexKey);
}
}

一个很投机取巧的办法,补齐位数,who怕who。


如果还有啥接下来慢慢更新吧……………….

文章作者: ZyTomorrow
文章链接: https://zytomorrow.top/2019/04/01/jsbox/jsbox-man-hua-xiao-cha-jian/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 Tomorrow
打赏
  • 微信
  • 支付寶

评论