Skip to content

feat(iOS): change Fabric implementation to UIScrollView #672

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 10 commits into from
Jan 17, 2023
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
#pragma once

#include "RNCViewPagerShadowNode.h"
#include <react/renderer/core/ConcreteComponentDescriptor.h>

namespace facebook {
namespace react {

using RNCViewPagerComponentDescriptor = ConcreteComponentDescriptor<RNCViewPagerShadowNode>;

}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
#include "RNCViewPagerShadowNode.h"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
#include "RNCViewPagerShadowNode.h"
// https://github.com/facebook/react-native/blob/main/ReactCommon/react/renderer/components/scrollview/ScrollViewShadowNode.cpp
#include "RNCViewPagerShadowNode.h"

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

any way to generate that with codegen or suggest the feature request?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Right now, the codegen generates those files inside a build folder. We can suggest a feature request and request a comment from other developers, on what they think about it.


#include <react/debug/react_native_assert.h>
#include <react/renderer/core/LayoutMetrics.h>

namespace facebook {
namespace react {

const char RNCViewPagerComponentName[] = "RNCViewPager";

void RNCViewPagerShadowNode::updateStateIfNeeded() {
ensureUnsealed();

auto contentBoundingRect = Rect{};
for (const auto &childNode : getLayoutableChildNodes()) {
contentBoundingRect.unionInPlace(childNode->getLayoutMetrics().frame);
}

auto state = getStateData();

if (state.contentBoundingRect != contentBoundingRect) {
state.contentBoundingRect = contentBoundingRect;
setStateData(std::move(state));
}
}

#pragma mark - LayoutableShadowNode

void RNCViewPagerShadowNode::layout(LayoutContext layoutContext) {
ConcreteViewShadowNode::layout(layoutContext);
updateStateIfNeeded();
}

}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
#pragma once
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.


#include <react/renderer/components/RNCViewPager/EventEmitters.h>
#include <react/renderer/components/RNCViewPager/Props.h>
#include <react/renderer/components/RNCViewPager/RNCViewPagerState.h>
#include <react/renderer/components/view/ConcreteViewShadowNode.h>
#include <react/renderer/core/LayoutContext.h>

namespace facebook {
namespace react {

extern const char RNCViewPagerComponentName[];

class RNCViewPagerShadowNode final : public ConcreteViewShadowNode<
RNCViewPagerComponentName,
RNCViewPagerProps,
RNCViewPagerEventEmitter,
RNCViewPagerState> {
public:
using ConcreteViewShadowNode::ConcreteViewShadowNode;

#pragma mark - LayoutableShadowNode

void layout(LayoutContext layoutContext) override;

private:
void updateStateIfNeeded();
};

}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
#include "RNCViewPagerState.h"

namespace facebook {
namespace react {

Size RNCViewPagerState::getContentSize() const {
return contentBoundingRect.size;
}

}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
#pragma once

#include <react/renderer/graphics/Geometry.h>

namespace facebook {
namespace react {

class RNCViewPagerState final {
public:
Point contentOffset;
Rect contentBoundingRect;

Size getContentSize() const;

};

}
}
13 changes: 11 additions & 2 deletions fabricexample/ios/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -625,7 +625,16 @@ PODS:
- React-jsinspector (0.70.5)
- React-logger (0.70.5):
- glog
- react-native-pager-view (6.1.1):
- react-native-pager-view (6.1.2):
- RCT-Folly
- RCTRequired
- RCTTypeSafety
- React-Codegen
- React-Core
- react-native-pager-view/common (= 6.1.2)
- React-RCTFabric
- ReactCommon/turbomodule/core
- react-native-pager-view/common (6.1.2):
- RCT-Folly
- RCTRequired
- RCTTypeSafety
Expand Down Expand Up @@ -1013,7 +1022,7 @@ SPEC CHECKSUMS:
React-jsiexecutor: 31564fa6912459921568e8b0e49024285a4d584b
React-jsinspector: badd81696361249893a80477983e697aab3c1a34
React-logger: fdda34dd285bdb0232e059b19d9606fa0ec3bb9c
react-native-pager-view: 22ef94ca5a46cb18e4573ed3e179f4f84d477490
react-native-pager-view: 991c947924d48f1232a98ba6e6d3466eaf51034d
react-native-safe-area-context: 2f75b317784a1a8e224562941e50ecbc932d2097
React-perflogger: e68d3795cf5d247a0379735cbac7309adf2fb931
React-RCTActionSheet: 05452c3b281edb27850253db13ecd4c5a65bc247
Expand Down
10 changes: 2 additions & 8 deletions ios/Fabric/RNCPagerViewComponentView.h
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,8 @@

NS_ASSUME_NONNULL_BEGIN

@interface RNCPagerViewComponentView : RCTViewComponentView <UIPageViewControllerDataSource, UIPageViewControllerDelegate, UIScrollViewDelegate>

@property(strong, nonatomic, readonly) UIPageViewController *nativePageViewController;
@property(nonatomic, strong) NSMutableArray<UIViewController *> *nativeChildrenViewControllers;
@property(nonatomic) NSInteger initialPage;
@property(nonatomic) NSInteger currentIndex;
@property(nonatomic) NSInteger destinationIndex;
@property(nonatomic) NSString* layoutDirection;
@interface RNCPagerViewComponentView : RCTViewComponentView <UIScrollViewDelegate>

@property(nonatomic) BOOL overdrag;

- (void)setPage:(NSInteger)number;
Expand Down
Loading