多图片生成PDF（一）多图片生成HTML

多图片生成HTML
一、准备前提
1、准备一个html模板

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>pdf</title>
    <link rel="stylesheet" href="./css/pdf.css" />
</head>

<body>

    <div class="box">
        <div class="img-box">
            ###image_list###
        </div>
    </div>
</body>
</html>

2、准备CSS模板(css模板网上找的)

@page { 
  size: 10.42in 8.12in; 
  margin: 0; 
  content: counter(page);
  width: 100%; 
  height: 100%; 
} /*不能随意修改这里 hongwei.lian*/
html,
body {
    margin: 0;
}

ul,
ol,
li,
img {
    margin: 0;
    padding: 0;
}

li {
    list-style-type: none;
}

.box {
    width: 100%;
    position: relative;
}

img {
    width: 100%;
}

.content-box {
    position: absolute;
    top: 230px;
    left: 100px;
    bottom: 150px;
    right: 30px;
}

.order-track .track-list {
    margin: 20px 10px;
    /* max-height: 300px; */
    padding-left: 5px;
    /* overflow-y: auto; */
    position: relative;
}

.box-track .track-list li:first-child {
    padding-top: 0;
}

.order-track .track-list li:first-child {
    padding-top: 0;
}

.order-track .track-list li {
    position: relative;
    padding: 9px 10px 0 15px;
    line-height: 22px;
    border-left: 1px solid #d9d9d9;
    color: #333;
    font-size: 0;
}

.order-track .track-list li:first-child .node-icon {
    background-position: 0 0;
    height: 20px;
    top: 0;
}

.order-track .track-list li .node-icon {
    position: absolute;
    left: -6px;
    top: 50%;
    width: 11px;
    height: 11px;
    background: url("../img/order-track.png") -21px -8px #fff no-repeat;
}

.order-track .track-list li:first-child .date {
    border-left-color: #fff;
}

.order-track .track-list li .date {
    display: inline-block;
    width: 150px;
    color: #333;
    border-radius: 14px;
    font-size: 14px;
    text-align: left;
}

.order-track .track-list li:first-child .txt {
    font-weight: 600;
}

.order-track .track-list li .txt {
    font-size: 14px;
    max-width: 80%;
    padding-left: 10px;
}

.order-track .track-list li .time,
.order-track .track-list li .txt {
    position: relative;
    display: inline-block;
}

.box-track .track-list .name {
    float: right;
    vertical-align: top;
    font-size: 14px;
    max-width: 80%;
    margin-right: 10px;
}

二、Java代码

import cn.qcdoc.common.core.exception.BaseException;

import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.util.ArrayList;
import java.util.List;

/**
 * Html
 *
 * @author: wx
 * @date: 2022/12/08
 */
public class HtmlDemo {
    public static String MakeHtml(List<String> listPath, String distPath, String templatePath){
        String fileame = "test.html";
        try {
            String templateContent = "";
            // 读取模板文件
            FileInputStream fileinputstream = new FileInputStream(templatePath);
            int length = fileinputstream.available();
            byte bytes[] = new byte[length];
            fileinputstream.read(bytes);
            fileinputstream.close();
            templateContent = new String(bytes);
            StringBuilder sbPath = new StringBuilder();
            for (String path : listPath) {
                String imgs = "<img src=\""+path+"\"/>"+"\n"+"<div style='page-break-before: always;'>\n" +
                        "\t\t</div>";
                sbPath.append(imgs);
            }
            String str = sbPath.toString().replace("\\", "/");
            //把模板页面上的 ###image_list### 替换成 img 里的内容
            templateContent = templateContent.replaceAll("###image_list###", str);
            // 生成的html文件保存路径。
            fileame = distPath + fileame;
            // 建立文件输出流
            FileOutputStream fileoutputstream = new FileOutputStream(fileame);
            byte tag_bytes[] = templateContent.getBytes();
            fileoutputstream.write(tag_bytes);
            fileoutputstream.close();
        } catch (Exception e) {
            throw new BaseException("创建html失败!");
        }
        return fileame;
    }

    public static void main(String[] args) throws Exception {
        List<String> listPath = new ArrayList<>();
        listPath.add("1665989812537.jpg");
        listPath.add("1665989815178.jpg");
        String distPath = "upload\\depot\\electronic\\23335\\NJ01TYQABYM\\";
        String templatePath = "upload\\depot\\table.html";
        MakeHtml(listPath,distPath,templatePath);
    }
}

生成示例入下图：
html代码：

总结：
以上生成HTML是基于本地生成，html里面的路径要写正常，否则打开html不会显示图片

接下来，将根据生成好的HTML生成PDF

posted @ 2022-12-08 17:53  why0703  阅读(159)  评论(0)  编辑  收藏  举报