RN ReactNative 使用 MJRefresh 自定义刷新组件

RN 自带的 RefreshControl 是 UIRefreshControl,并且还自己写了自动偏移,存在有时不能回弹和不可以自定义视图的问题

iOS 如下修改后,可以将 RN 中所有的下拉刷新更改为 MJRefresh或者项目中自己的刷新组件(自定义刷新组件)。

更改为 MJRefresh 后,刷新效果和原生一样。

更改刷新组件为 MJRefresh

  • react.podspec 文件

core 增加 ss.dependency "MJRefresh"

  • RCTRefreshControl.h 文件更新
    • #import <MJRefresh/MJRefresh.h>
    • 更改继承为:MJRefreshNormalHeader
  • 如下直接替换内容
- (instancetype)init
{
    if ((self = [super init])) {
        [self setRefreshingTarget:self refreshingAction:@selector(refreshControlValueChanged)];
        _isInitialRender = true;
        _currentRefreshingState = false;
    }
    return self;
}

- (void)setFrame:(CGRect)frame {
    CGFloat width = self.scrollView.frame.size.width ?: [UIScreen mainScreen].bounds.size.width;
    CGFloat height = 54;
    [super setFrame:CGRectMake(frame.origin.x, _isInitialRender ? frame.origin.y : -54, width, height)];
}

RCT_NOT_IMPLEMENTED(- (instancetype)initWithCoder:(NSCoder *)aDecoder)

- (void)layoutSubviews
{
    [super layoutSubviews];
    self.backgroundColor = [UIColor clearColor];
    if (_currentRefreshingState && _isInitialRender) {
        [self _beginRefreshing];
    }
    _isInitialRender = false;
}

- (void)_beginRefreshing
{
    [self.scrollView.mj_header beginRefreshing];
}

- (void)_endRefreshing
{
    [self.scrollView.mj_header endRefreshing];
    _currentRefreshingState = false;
}

- (NSString *)title
{
  return _title;
}

- (void)setTitle:(NSString *)title
{
  _title = title;
  [self _updateTitle];
}

- (void)setTitleColor:(UIColor *)color
{
  _titleColor = color;
  [self _updateTitle];
}

- (void)_updateTitle
{

}

- (void)setRefreshing:(BOOL)refreshing
{
    
  if (_currentRefreshingState != refreshing) {

    if (refreshing) {
      if (!_isInitialRender) {
        [self _beginRefreshing];
      }
    } else {
      [self _endRefreshing];
    }
  }
}

- (void)refreshControlValueChanged
{
    _currentRefreshingState = true;

  if (_onRefresh) {
    _onRefresh(nil);
  }
}
  • RCTScrollView.m 文件
- (void)setRctRefreshControl:(RCTRefreshControl *)refreshControl
{
    _rctRefreshControl = refreshControl;
    self.mj_header = refreshControl;
}
  • RCTScrollView.m 文件 layoutSubviews,如下更改
RCTRefreshControl *refreshControl = _scrollView.rctRefreshControl;
  if (refreshControl && refreshControl.state == MJRefreshStateIdle) {
      refreshControl.frame = CGRectMake(0, -54, self.frame.size.width, 54);
  }

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏QQ音乐技术团队的专栏

React-Native 分包实践

对于很多在使用react-native开发应用的小伙伴们肯定都会遇到一个问题,功能越来越复杂,生成的jsbundle文件越来越大,无论是打包在app内发布还是走...

1.5K60
来自专栏移动端开发

Telegram学习解析系列(二):这我怎么给后台传输数据?

写在前面:          在iOS开发的过程中,有很多时候我们都在和数据打交道,最基本的就是数据的下载和上传了,估计很多很多的小伙伴都在用AFNetwork...

547100
来自专栏『不羁阁』 | 行走少年郎专栏

iOS网络--HTTP请求HTTP请求

19180
来自专栏iOS开发攻城狮的集散地

iOS 全屏侧滑手势/UIScrollView/UISlider间滑动手势冲突

方案一:这个跟UIScrollView的一个属性delaysContentTouches有关。

46020
来自专栏高性能分布式系统设计

怎样判断iPhone/iPad是越狱的

对开发者来说,越狱机盗版开发者的成果是一个灾难。 下面介绍一个方法来检测: 破解程序会在 Info.plist 加入 SignerIdentity 这个 KEY...

29650
来自专栏青玉伏案

iOS开发之新浪微博山寨版代码优化

  之前发表过一篇博客“IOS开发之新浪围脖”,在编写代码的时候太偏重功能的实现了,写完基本功能后看着代码有些别扭,特别是用到的四种cell的类,重复代码有点多...

20990
来自专栏DannyHoo的专栏

在最顶层窗口添加一个视图

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010105969/article/details/...

11920
来自专栏娱乐心理测试

iOS AppDelegate方法,监听进程在后台、被杀死事件

监听进程被杀死时,会发现, 程序处于前台被杀死时会调用applicationWillTerminate:方法,程序处于后台时,并不会调用,需要实现如下代码:

37120
来自专栏青玉伏案

iOS开发之抽屉效果实现

  说道抽屉效果在iOS中比较有名的第三方类库就是PPRevealSideViewController。一说到第三方类库就自然而然的想到我们的CocoaPods...

28760
来自专栏移动端开发

iOS 启动页后广告Demo

重点!       对于启动页后的广告,相信大家也都看到过很多很多的,比如我自己常看到的有 QQ音乐,爱奇艺了。你点击了APP,它会启动就会随之启动。。其实...

52680

扫码关注云+社区

领取腾讯云代金券