当前位置: 首页 > news >正文

新发布的一款使用ReactNative新架构加载Svga动画的开源插件[android/ios]

这是一款使用 ReactNative 加载 Svga 动画的新架构支持开源插件

版本:latest

rn-newarch-svga-player

[!TIP] Github 地址

安装与使用

[!TIP] 注意 ⚠️ 本库 android/ios 仅给予 Fabric 新架构 支持,旧架构不在跟进,若需旧架构支持请移步https://github.com/yrjwcharm/react-native-svga-player

npm
npm install rn-newarch-svga-player
yarn
yarn add rn-newarch-svga-player

若想更改库的别名 react-native-svga-player 来导入。你则需要把 rn-newarch-svga-player 库修改下,重新 yarn 执行

+  "dependencies": {"@react-native-oh/react-native-harmony": "0.72.48","patch-package": "^8.0.0","postinstall-postinstall": "^2.1.0","react": "18.2.0","react-native": "0.72.5",
-    "rn-newarch-svga-player":"^1.0.2"
+   "react-native-svga-player":"npm:rn-newarch-svga-player@1.0.2","react-native-ohos-svgaplayer": "^1.1.7"},

下面的代码展示了这个库的基本使用场景:

import React from "react";
import { View, Dimensions, StyleSheet } from "react-native";
import RNSvgaPlayer from "react-native-svga-player";export function App() {return (<RNSvgaPlayersource="https://raw.githubusercontent.com/yyued/SVGAPlayer-iOS/master/SVGAPlayer/Samples/Goddess.svga"style={{width: 300,height: 150,}}/>);
}const styles = StyleSheet.create({container: {flex: 1,justifyContent: "flex-start",alignItems: "center",},
});

更多详情用法参考 三端 Svga 动画统一使用点击这里

开源不易,希望您可以动一动小手点点小 ⭐⭐
👴 希望大家如有好的需求踊跃提交,如有问题请提交 issue,空闲时间会扩充与修复优化

开源协议

本项目基于 The MIT License (MIT) ,请自由地享受和参与开源。

demo 示例请查看 https://github.com/yrjwcharm/react-native-newarch-support
http://www.xdnf.cn/news/1058689.html

相关文章:

  • 数据结构——选择题—查漏补缺
  • 【unitrix】 3.0 基本结构体(types.rs)
  • 二、OpenCV的第一个程序
  • Uniapp H5端SEO优化全攻略:提升搜索引擎排名与流量
  • 结合 STM32CubeMX 使用 FreeRTOS 实时操作系统
  • 【ClipPal】推荐一个非常好用的粘贴板记录工具
  • 侧信道分析中的简单模板攻击(TA)Python实现(带测试)
  • 【web应用】Vue 3 中实现 Chart.js 折线图:详细指南与最佳实践
  • 14.2 《3小时从零搭建企业级LLaMA3语言助手:GitHub配置+私有化模型集成全实战》
  • 基于CNN的FashionMNIST数据集识别6——DenseNet模型
  • 基于深度学习的智能文本摘要系统:技术与实践
  • Uniapp性能优化全面指南:从原理到实践
  • GNU Octave 基础教程(1):在 Ubuntu 22.04 和 Windows 11 上的安装指南
  • 【Linux】UDP与TCP协议
  • 电路图识图基础知识-普通卧式镗床识图(三十)
  • 深度体验KingbaseES在线平台:从零掌握企业级数据库实战(附架构图+代码案例)
  • Python基础学习框架(总周期:8周)
  • 九日集训第六天
  • 1572. 矩阵对角线元素的和
  • 计算机网络学习笔记:TCP流控、拥塞控制
  • 大模型知识库RAG框架,比如LangChain、ChatChat、FastGPT等等,哪个效果比较好
  • 前端开发面试题总结-vue2框架篇(三)
  • 安装谷歌vue开发工具插件devtools支持vue2
  • CentOS7 安装最新版 Docker
  • 【RocketMQ 生产者和消费者】- 消费者重平衡(1)
  • 《开窍》读书笔记9
  • 为什么要进行行为验证,行为验证方式有哪些?
  • 什么是数据清洗?数据清洗有哪些步骤?
  • FPGA 43 ,UDP 协议详细解析( FPGA 中的 UDP 协议 )
  • 课设作业图书管理系统