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

React项目在ios和安卓端要做一个渐变色背景,用css不支持,可使用react-native-linear-gradient

在这里插入图片描述
以上有个模块是灰色逐渐到白的背景色过渡
如果是css,以下代码就直接搞定

 background: linear-gradient(180deg, #F6F6F6 0%, #FFF 100%);

但是在RN中不支持这种写法,那应该写呢?
1.引入react-native-linear-gradient插件,我使用的是^2.6.2版本

import LinearGradient from 'react-native-linear-gradient';

2定义颜色

private get linearGradientProps() {return {colors: ['#F6F6F6', '#FFF'],locations: [0, 1],style: {borderTopLeftRadius: getPx(8),borderTopRightRadius: getPx(8),borderBottomRightRadius: getPx(8),borderBottomLeftRadius: getPx(8)}};}

3.引用组件

 <LinearGradient {...this.linearGradientProps}>哈哈哈渐变背景色</LinearGradient>
http://www.lryc.cn/news/2395228.html

相关文章:

  • 【数据分析】特征工程-特征选择
  • 第4节 Node.js NPM 使用介绍
  • RK3399 Android7.1增加应用安装白名单机制
  • uni-app 安卓消失的字符去哪里了?maxLength失效了!
  • #AI短视频制作完整教程
  • 嵌入式STM32学习——串口USART 2.0(printf重定义及串口发送)
  • 【大模型】情绪对话模型项目研发
  • Git 教程 | 如何将指定文件夹回滚到上一次或某次提交状态(命令详解)
  • 【PCI】PCI入门介绍(包含部分PCIe讲解)
  • Cloudera Manager 学习笔记
  • Deepin 23.10安装Docker
  • 使用PowerBI个人网关定时刷新数据
  • 数字人引领政务新风尚:智能设备助力政务服务
  • 深入剖析Java类加载机制:双亲委派模型的突破与实战应用
  • Kotlin JVM 注解详解
  • 将 node.js 项目作为后台进程持续运行
  • 【PhysUnits】15.5 引入P1后的标准化表示(standardization.rs)
  • MySQL-5.7 修改密码和连接访问权限
  • tauri2项目打开某个文件夹,类似于mac系统中的 open ./
  • 企业文件乱、传输慢?用群晖 NAS 构建安全高效的共享系统
  • 防爆手机VS普通手机,区别在哪里?
  • C语言结构体的别名与创建结构体变量
  • 在RTX5060Ti上进行Qwen3-4B的GRPO强化微调
  • SQL进阶之旅 Day 7:视图与存储过程入门
  • 武汉火影数字VR大空间制作
  • Docker部署项目无法访问,登录超时完整排查攻略
  • (增强)基于sqlite、mysql、redis的消息存储
  • Windows上用FFmpeg推流及拉流的流程概览
  • MFC坦克大战游戏制作
  • Kafka ACK机制详解:数据可靠性与性能的权衡之道