更新记录

1.1.0（2025-03-29）

支持IOS端

1.0.6（2024-10-27）

适配hbx 4.31版本readFile接口调整引起的类型错误

1.0.5（2024-06-16）

修改minSdkVersion版本为21

平台兼容性

xwq-svga-view

开发文档说明

需打自定义基座运行！

需打自定义基座运行！

需打自定义基座运行！

参数说明

方法说明

• start 开始动画
• pause 暂停动画
• continuePlay 继续动画

注意：IOS暂不支持设置自定义内容！

使用例子

<template>
    <view class="page">
        <scroll-view>
        <xwq-svga-view v-if="showSvga" ref="svga" :hiddenKeyName="hiddenKeyName" :dynamicText="dynamiText" :dynamicImage="dynamicImage" hiddenKeyName="张三11" :source="source" :loops="loops" :style="{width:'414px',height:'350px'}" @finished="svgaFinish"></xwq-svga-view>
        <button @click="start">开始动画</button>
        <button @click="pause">暂停动画</button>
        <button @click="continuePlay">继续动画</button>
        </scroll-view>
    </view>
</template>

<script lang="uts">

    export default {
        data() {
            return {
                showSvga:true,
                // source:"https://www.wanguoqiche.com/files/web/pic/demo/car.svga?raw=true",
                source:"/static/angel.svga",
                loops:1,
                dynamiText:'{"size":28,"color":"#ff0000","text":"自定义内容","keyName":"GuangHuan"}',
                dynamicImage:'{"url":"/static/logo.jpg","keyName":"xin02"}',
                // dynamicImage:'{"url":"https://www.wanguoqiche.com/files/web/pic/jns/danger_icon.png?raw=true","keyName":"xin02"}',
                hiddenKeyName:'keyName'
            }
        },
        methods: {
            //暂停动画
            stop(){
                let svgaC = (this.$refs["svga"] as XwqSvgaViewElement);
                svgaC.stop();
            },
            //开始动画
            start(){
                let svgaC = (this.$refs["svga"] as XwqSvgaViewElement);
                svgaC.start();
            },
            //暂停动画
            pause(){
                let svgaC = (this.$refs["svga"] as XwqSvgaViewElement);
                svgaC.pause();
            },
            //继续动画
            continuePlay(){
                let svgaC = (this.$refs["svga"] as XwqSvgaViewElement);
                svgaC.continue();
            },
            //动画完成
            svgaFinish(){
                console.log('动画完成')
            },
        }
    }
</script>

<style>
    .page{
        background-color:#f2f2f2;
        height:100%;
    }
.pic-wrap{
    margin-top:50px;
    width:100%;
    justify-content: center;
    align-items: center;
}

.qr-code{
    width:100%;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

</style>