From 84d55868e8b4e5a555d324c6162b8e38571524d8 Mon Sep 17 00:00:00 2001 From: Samuel Susla Date: Wed, 28 Apr 2021 13:47:11 -0700 Subject: [PATCH] Fix DatePicker sizing issue Summary: Changelog: Fix possible sizing issue with DatePicker Changing `preferredDatePickerStyle` changes size of the component without triggering re-layout of the react native screen. The fix is to make sure the size stays the same after changing the style. Reviewed By: mdvacca Differential Revision: D28035226 fbshipit-source-id: 2dcb50fd5ebaa0c0d01d3289c4ffa77a053cfc4a --- React/Views/RCTDatePickerManager.m | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/React/Views/RCTDatePickerManager.m b/React/Views/RCTDatePickerManager.m index 3fb37eeadb..f6fec6d739 100644 --- a/React/Views/RCTDatePickerManager.m +++ b/React/Views/RCTDatePickerManager.m @@ -85,11 +85,17 @@ RCT_EXPORT_METHOD(setNativeDate : (nonnull NSNumber *)viewTag toDate : (NSDate * RCT_CUSTOM_VIEW_PROPERTY(pickerStyle, UIDatePickerStyle, RCTDatePicker) { if (@available(iOS 14, *)) { + // If the style changed, then the date picker may need to be resized and will generate a layout pass to display + // correctly. We need to prevent that to get consistent layout. That's why we memorise the old frame and set it + // after style is changed. + CGRect oldFrame = view.frame; if (json) { - view.preferredDatePickerStyle = [RCTConvert UIDatePickerStyle:json]; + UIDatePickerStyle style = [RCTConvert UIDatePickerStyle:json]; + view.preferredDatePickerStyle = style; } else { view.preferredDatePickerStyle = UIDatePickerStyleWheels; } + view.frame = oldFrame; } } #endif