更新记录

1.3.0（2023-05-06）

本次主要更新：

1. ios 更改 100vh 为pdf每页高度

1.2.0（2023-05-05）

本次主要更新： 1.修改ios使用A4大小生成pdf

1.1.0（2023-03-20）

本次主要更新： 1.增加 支持plus、vue、nvue里的WebView 生成pdf

平台兼容性

原生插件通用使用流程：

1. 购买插件，选择该插件绑定的项目。
2. 在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
3. 根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
4. 打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择

KJ-WebViewToPDF

生成pdf、支持vue页面、支持plus、vue、nvue里的WebView

vue页面生成pdf

<template>
    <view class="content">
        <view class="btns">
            <button type="primary" @click="start">当前页面生成pdf</button>
            <button type="primary" @click="navigateTo">跳转</button>
        </view>
        <view class="list" v-for="(item,index) in 100">
            <image class="image" src="https://ask.dcloud.net.cn/uploads/avatar/000/73/57/99_avatar_max.jpg"></image>
            <view class="index">第{{index+1}}页</view>
        </view>
    </view>
</template>

<script>
    const KJWebViewToPDF = uni.requireNativePlugin('KJ-WebViewToPDF');
    export default {
        data() {
            return {}
        },
        onLoad() {},
        methods: {
            start() {
                var dic = {
                    "path": plus.io.convertLocalFileSystemURL("_doc/KJ-WebViewToPDF"), //保存pdf文件的路径
                    "pagePath": "pages/index/index" //当前页面的路由
                };
                KJWebViewToPDF.start(dic, (res) => {
                    console.log("start:" + JSON.stringify(res));
                    uni.openDocument({
                        filePath: res.filePath,
                        success: function(res) {
                            uni.showToast({
                                title: '打开文档成功'
                            })
                            console.log('打开文档成功');
                        },
                        fail: function(res) {
                            uni.showToast({
                                title: JSON.stringify(res)
                            })
                        }
                    })
                })
            },
            navigateTo() {
                uni.navigateTo({
                    url: "/pages/index/index2"
                })
            }
        }
    }
</script>
<style>
    .btns {
        position: absolute;
        z-index: 999;
    }

    .list {
        position: relative;

        /*pdf每页的高度*/
        height: 100vh;

        background-color: grey;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }

    .index {
        position: absolute;
        bottom: 0;
    }
</style>

WebView组件生成pdf

<template>
    <view class="content">
        <view class="title">我是web-view组件</view>
        <web-view ref="webview" class="webView" :src="src"></web-view>
        <view class="title title2">我是plus.webview组件</view>
        <view class="btns">
            <button type="primary" @click="start">当前页面生成pdf</button>
            <button type="primary" @click="search">搜索所有webview</button>
            <button type="primary" @click="startV2_webview">web-view组件生成pdf</button>
            <button type="primary" @click="startV2_plusWebview">plus.webview生成pdf</button>
        </view>
    </view>
</template>

<script>
    const KJWebViewToPDF = uni.requireNativePlugin('KJ-WebViewToPDF');
    export default {
        data() {
            return {
                src: 'https://uniapp.dcloud.net.cn/',
                wv: null,
                search_result: null
            }
        },
        onLoad() {

        },
        onHide() {
            plus.webview.close(this.wv);
        },
        onShow() {
            var currentWebview = this.$scope
                .$getAppWebview() //此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效
            setTimeout(function() {
                var wv = currentWebview.children()[0]
                wv.setStyle({
                    top: uni.getSystemInfoSync().statusBarHeight + 44 + 30,
                    height: 200
                })
            }, 1000); //如果是页面初始化调用时，需要延时一下

            setTimeout((res) => {
                this.wv = plus.webview.create(this.src, "custom-webview", {
                    top: uni.getSystemInfoSync().statusBarHeight + 44 + 280,
                    height: 200
                })
                this.wv.show(); // 显示窗口
                this.search()
            }, 100)
        },
        methods: {
            start() {
                var dic = {
                    "path": plus.io.convertLocalFileSystemURL("_doc/KJ-WebViewToPDF"), //保存pdf文件的路径
                    "pagePath": "pages/index/index3" //当前页面的路由
                };
                KJWebViewToPDF.start(dic, (res) => {
                    console.log("start:" + JSON.stringify(res));
                    uni.openDocument({
                        filePath: res.filePath,
                        success: function(res) {
                            uni.showToast({
                                title: '打开文档成功'
                            })
                            console.log('打开文档成功');
                        },
                        fail: function(res) {
                            uni.showToast({
                                title: JSON.stringify(res)
                            })
                        }
                    })
                })
            },
            search() {
                KJWebViewToPDF.search({
                    "noKeywords": ["__uniappview.html"] //不需要捕获的url关键字的webview
                }, (res) => {
                    console.log("search:" + JSON.stringify(res));
                    this.search_result = res.result;
                })
            },
            startV2_webview() {
                var dic = {
                    "tag": 1,
                    "path": plus.io.convertLocalFileSystemURL("_doc/KJ-WebViewToPDF"), //保存pdf文件的路径
                }
                KJWebViewToPDF.startV2(dic, (res) => {
                    console.log("startV2:" + JSON.stringify(res));
                    uni.openDocument({
                        filePath: res.filePath,
                        success: function(res) {
                            uni.showToast({
                                title: '打开文档成功'
                            })
                            console.log('打开文档成功');
                        },
                        fail: function(res) {
                            uni.showToast({
                                title: JSON.stringify(res)
                            })
                        }
                    })
                })
            },
            startV2_plusWebview() {
                var dic = {
                    "tag": 2,
                    "path": plus.io.convertLocalFileSystemURL("_doc/KJ-WebViewToPDF"), //保存pdf文件的路径
                }
                KJWebViewToPDF.startV2(dic, (res) => {
                    console.log("startV2:" + JSON.stringify(res));
                    uni.openDocument({
                        filePath: res.filePath,
                        success: function(res) {
                            uni.showToast({
                                title: '打开文档成功'
                            })
                            console.log('打开文档成功');
                        },
                        fail: function(res) {
                            uni.showToast({
                                title: JSON.stringify(res)
                            })
                        }
                    })
                })
            }
        }
    }
</script>

<style>
    .title {
        text-align: center;
        color: red;
    }

    .title2 {
        width: 100%;
        position: absolute;
        top: 240px;
    }

    .btns {
        width: 100%;
        position: fixed;
        bottom: 20px;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .btns>button {
        font-size: 14px;
    }
</style>