前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >console控制台打印自定义样式图案

console控制台打印自定义样式图案

作者头像
Diuut
发布2022-11-22 20:39:41
1.5K0
发布2022-11-22 20:39:41
举报
文章被收录于专栏:Diuut

需求: F12控制台打印彩色自定义图片

实现是伪实现,还得基于别人的程序把图片转换成字符化以后自己再转换成console展示。以下描述实现方式。

图片转字符化网站

先去该网站上将自己图片转换成字符串,然后F12去拿到他的html格式样式文件

拿到该段样式文件 copy Element,复制到本地一个txt文件中。 将该段样式Uedit或者其他文本软件中,进行XML格式化。然后去掉头尾的<div></div>标签。

然后到写的一个工具类中跑一下,得到console版本的打印代码。

代码语言:javascript
复制
package xyz.diuut;

import java.io.File;
import java.io.IOException;
import java.nio.file.Files;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.LinkedList;
import java.util.List;

/**
 * @Author Diuut
 * @Date 2020/8/15  19:32
 */
public class consoleUtil {

    //console打印图画

    public static void main(String[] args) {
        //此处就是处理了头尾的txt样式文件
        List<String> strList = getList("C:\\Users\\82425\\Desktop\\test.txt");
        StringBuilder result = new StringBuilder();
        StringBuilder temp3 = new StringBuilder();
        for (String s : strList) {
            if (!s.contains("<br>")) {
                temp3.append(s + "&&");
            }
            if (s.contains("<br>")) {
                if (temp3 == null) {
                    continue;
                }
                String consoleStr = getConsoleStr(temp3.toString());
                result.append(consoleStr);
                temp3 = new StringBuilder();
            }
        }
        System.out.println(result);
        //这里可以输入到文件中,也可以直接控制台取,我偷懒直接控制台复制得了。
    }

    public static String getConsoleStr(String strr) {
        List<String> urlList = Arrays.asList(strr.split("&&"));
        List colorList = new LinkedList();
        List strList = new LinkedList();

        for (String s : urlList) {
            int index1 = s.indexOf('"');
            if (s.length() < 14) {
                continue;
            }
            String color = s.substring(index1 + 1, index1 + 8);
            colorList.add(color);
            int index2 = s.indexOf('>');
            int index3 = s.indexOf("</");
            String str = s.substring(index2 + 1, index3);
            strList.add(str);
        }
        String perString = "console.log(";
        String endString = ");";
        String andString = ",";
        StringBuilder colorString = new StringBuilder();
        StringBuilder strString = new StringBuilder();
        StringBuilder sumStr = new StringBuilder();
        for (int i = 0; i < colorList.size(); i++) {
            String tempStr1 = (String) colorList.get(i);
            String tempStr2 = (String) strList.get(i);
            if (i != colorList.size() - 1) {
                colorString.append("\"color:" + tempStr1 + "\",");
                sumStr.append("\"%c" + tempStr2 + "\"+");
            } else {
                colorString.append("\"color:" + tempStr1 + "\"");
                sumStr.append("\"%c" + tempStr2 + "\"");
            }
        }
        String result = perString + sumStr + andString + colorString + endString;
        return result;
    }

    /**
     * 根据路径文件生成列表
     *
     * @param path 地址
     * @return
     */
    public static List<String> getList(String path) {
        File listFile = new File(path);
        List<String> urlList = new ArrayList<String>();
        if (listFile.exists()) {
            try {
                urlList = Files.readAllLines(listFile.toPath());
            } catch (IOException ex) {
                ex.printStackTrace();
            }
            if (urlList.isEmpty()) {
                System.out.println("路径文件生成为空");
                return null;
            }
        }
        return urlList;
    }
}

将格式化后的代码复制下来,建议再将代码根据console.log进行换行替换^pconsole.log(^p 换行符),以免一行内容过多编辑器无法正常展示。然后就可以去自己想要展示的页面上打印了,头尾要包一下

代码语言:javascript
复制
<script type="text/javascript" language="javascript">
	if(window.console&&window.console.log){
     <!--中间就将上面格式化得到的代码复制进来->
     console.log("%c00","color:#FDFDFD");
     <!--中间就将上面格式化得到的代码复制进来-->
    }
</script>

其实实现打印很简单,直接写都可以,但图片的话色彩丰富,工作量太大了,作为程序员就没必要做那种重复无脑,便写一个类处理下,虽然可能其他地方没什么用,也没什么学习意义,或许,这就是快乐吧。

Post Views: 353

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021年8月15日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档