react native万能公用组件_react-native 组件公共-程序员宅基地

技术标签： 公共组件  万能组件  react native  react native公共组件  

项目中总是会用到很多公共的组件，样式就跟设置里面的单个item很像，本项目就是打造一个公共的万能组件 项目中有两个文件，一个是公用组件，一个是字体大小适配

你可以自定义各种组件哦！


具体代码请参考：https://github.com/LiuC520/react-native-public-component



react native万能公用组件
使用说明

npm install --save react-native-public-component

项目中引入：

import {PublicCompoennt, dimens} from 'react-native-public-component'

如果要使用字体适配和宽高等信息，可以导入dimens

参数说明：




props 说明 备注

containerStyle 整个容器的样式，可以设置padding、margin、背景颜色等等

leftComponent 自定义左侧组件

centerContent 自定义中间组件

rightComponent 自定义右侧组件

leftComponentStyle 自定义左侧组件样式

centerContentStyle 自定义中间组件样式

rightComponentStyle 自定义右侧组件样式

leftIcon 左侧图标

leftIconStyle 左侧图标样式

rightIcon 右侧图标

rightIconStyle 右侧图标样式

rightArrow 右侧箭头

rightArrowStyle 右侧箭头样式

isRightArrowShow 是否显示右侧箭头 默认显示 true

leftText 左侧文字 可以为字符串或者Text组件

leftTextStyle 左侧文字样式

centerText 中间文字 可以为字符串或者Text组件

centerTextStyle 中间文字样式

rightText 右侧文字 可以为字符串或者Text组件

rightTextStyle 右侧文字样式

onPress 整个item的点击事件 方法

onLeftPress 左侧点击事件 方法

onRightPress 右侧点击事件 方法

onCenterPress 中间点击事件 方法

hiddenLeft 隐藏左侧 bool，默认为false

hiddenRight 隐藏右侧 bool，默认为false

removeLeftView 移除左侧 bool，默认为false

removeCenterView 移除中间 bool，默认为false

removeRightView 移除�右侧 bool，默认为false

hiddenTopLine 隐藏上划线 默认为�true

topLineStyle 上划线样式

topLineLeftMargin 上划线左边距 数字

topLineRightMargin 上划线右边距 数字

hiddenBottomLine 隐藏下划线 默认为false

bottomLineStyle 下划线样式

bottomLineLeftMargin 下划线左边距 数字，默认左边距为15

bottomLineRightMargin 下划线右边距 数字

具体的使用方法请参考示例 https://github.com/LiuC520/react-native-public-component/blob/master/example/App.js

上面的样式或者icon为number表示常量，图标为require导入的，如果uri导入表示对象，具体参考示例
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liu__520/article/details/79888009

智能推荐

泰克Tektronix AFG3021函数信号发生器-程序员宅基地

文章浏览阅读408次，点赞8次，收藏7次。在隔离式输出的设计中，所有输出通道接地与大地是隔离的，适用在浮动电路的测试应用中，例如与电源供应器的DC电压串接后，直流加交流的输出高可达到+42V 或-42V。支持频率扫瞄及振幅扫瞄，可以和线性/对数，单向(锯齿波)/双向(三角波)，连续/单次触发/闸门触发的功能结合，以不同的扫瞄方式以达到各种应用需求。在隔离式输出的设计中，所有输出通道接地与大地是隔离的，适用在浮动电路的测试应用中，例如与电源供应器的DC电压串接后，直流加交流的输出高可达到+42V 或-42V。

mysql 生明变量_在 MySQL 的 SQL 文件中，定义变量与使用变量-程序员宅基地

文章浏览阅读297次。1、现阶段存在一个新需求，需要在部署产品时，针对产品做一些初始化数据的工作。预先准备好相应的 SQL 文件。由于需要执行多条 SQL 语句，且后续的 SQL 语句依赖于之前的 SQL 语句生成的主键 ID。因此，需要在 SQL 文件中，定义变量与使用变量。2、SQL 文件中的 SQL 语句如下：INSERT INTO `operation_types`(`alias`, `name`) VALUE..._[sql] query oasys start [sql] finished successfully

高通量测序的数据处理与分析指北(二)--宏基因组2-程序员宅基地

文章浏览阅读586次，点赞2次，收藏9次。然后是每个序列的GC含量，横轴表示GC含量的平均值，纵轴表示read数量，蓝色线是标准线，是原始数据没有被污染的理想分布情况，即符合正态分布。这个模块中横轴代表的是碱基的位置，纵轴代表的是tile的index编号，tile表示的是高通量测序仪上的一小块矩形区域，冷色代表在平均质量附近，暖色代表比平均质量低，正常来讲需要去除掉质量比较的低的部分tile，但是fastp中没有针对于tile编号进行去除的参数，其他质控软件中我也没有找到，所以这一部分质控如何质控目前不清楚，我认为如果上一步,通常N含量不会太高。_高通量测序的数据处理与分析指北(二)--宏基因组2

QT报错：C2131：表达式的计算结果不是常数_qt表达式的计算结果不是常数-程序员宅基地

文章浏览阅读630次，点赞10次，收藏10次。如果确定代码没有问题那么可以试一下下面的解决方案：下载：找到QT安装路径的QTCore目录下：用刚下载的文件替换注意：以上方法只对QT5.10版本有用。_qt表达式的计算结果不是常数

闪客工具：基于Flash 3D API Molehill 进行GPU加速2D的引擎_as3 molehill 键控-程序员宅基地

文章浏览阅读2k次。闪客工具：基于Flash 3D API Molehill 进行GPU加速2D的引擎_as3 molehill 键控

腾讯云与阿里云的对比_漏洞扫描 阿里云 腾讯云 对比-程序员宅基地

文章浏览阅读1.3k次。经过几年的发展腾讯云已经逐渐完善，与阿里云的差距在逐渐缩小中。个人实践中两者之间的服务器性能上已经非常接近了，程序员又多了一个服务器供应商的选择了..._漏洞扫描 阿里云 腾讯云 对比

随便推点

每个AI/ML工程师必须了解的人工智能框架和工具_haystack rag-程序员宅基地

文章浏览阅读1.4k次，点赞42次，收藏20次。每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗？订阅我们的简报，深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同，从行业内部的深度分析和实用指南中受益。不要错过这个机会，成为AI领域的领跑者。点击订阅，与未来同行！订阅：https://rengongzhineng.io/在迅速发展的技术格局中,生成式AI作为革命性力量,改变了开发人员和AI / ML工程师解决复杂问题和创新的方式。本文深入探讨了生成式AI的世界,揭示了每个开发人员都必不可少的框架和工具。_haystack rag

微信支付之企业付款_付款金额超出限制。低于最小金额1.00元或累计超过20000.00元-程序员宅基地

文章浏览阅读1.2k次。企业付款业务是基于微信支付商户平台的资金管理能力，为了协助商户方便地实现企业向个人付款，针对部分有开发能力的商户，提供通过API完成企业付款的功能。 比如目前的保险行业向客户退保、给付、理赔。企业付款将使用商户的可用余额，需确保可用余额充足。查看可用余额、充值、提现请登录商户平台“资金管理”进行操作。https://pay.weixin.qq.com/ 注意：与商户微信支付收款资金并非_付款金额超出限制。低于最小金额1.00元或累计超过20000.00元

微信小程序该怎么推广引流？_小程序怎么引流推广-程序员宅基地

文章浏览阅读1.7k次。微信小程序如何运营推广?不同的行业有不同的推广模式，但也有“普适”的方法。下面就来看看有哪些普适的小程序推广方法吧：1.小程序“自带”流量微信搜索小程序已支持关键字模糊搜索，并且小程序名称最长可达20个字，因此给小程序取个好名字也能带来很多搜索流量，尽量选择搜索量大的产品或服务、行业词汇。此外，附近的小程序功能对线下商家来说尤为重要，可覆盖方圆5公里的用户，而每个小程序可绑定10个..._小程序怎么引流推广

EtherCAT简介_ethercat是tcp还是itc-程序员宅基地

文章浏览阅读464次。EtherCAT（EtherNet Control Automation Technology）是由德国公司BECKHOFF公司于2003年提出的实时工业以太网技术。其具有高速、高数据有效率的特点，支持多种设备的连接拓扑结构。从站节点使用专用的控制芯片，例如：microchip公司的Lan9252、BECKHOFF公司的ET1100等ESC（EtherCAT slave controller）芯片。主站的搭建方式有很多，例如：开源主站IGH、SOEM、商业化主站TwinCAT等。_ethercat是tcp还是itc

实现h5网页微信分享、朋友圈分享功能（微信右上角分享）_h5分享到微信朋友圈-程序员宅基地

文章浏览阅读3.9k次。后台工作: 根据微信网页开发文档撰写一个接口返回一个对象给前端, 以下为返回结果。微信打开h5网页右上角分享功能需要前端和后台配合实现功能。2. 引入SDK,并进行相关配置。1. 获取微信网页SDK。_h5分享到微信朋友圈

qpython3安装turtle_Turtlebot3-ROS2入门教程-PC安装-程序员宅基地

文章浏览阅读228次。说明：介绍如何进行Turtlebot3-ROS2入门教程中的PC安装安装步骤安装Ubuntu Bionic 18.04 LTS 操作系统[Remote PC] 安装ROS2依赖包# Install Colcon$ sudo apt install python3-colcon-common-extensions# Install Cartographer dependencies$ sudo ap..._vcs import < turtlebot3_behavior_demos/dependencies.repos

推荐文章

热门文章

相关标签