Kaynağa Gözat

Now allowing the custom nav bar to take up the whole space on iOS (#2306)

* Now allowing the custom nav bar to take up the whole space on iOS

- Also the custom nav bar reacts well to orientation changes
- Fixes: https://github.com/wix/react-native-navigation/issues/1893

* It now works well on iOS 11 as well

* v1.1.314 [ci skip]

* Added optional fixedWidth property to the Android side menu

    - Fixes: https://github.com/wix/react-native-navigation/issues/510
Ioannis Kokkinidis 7 yıl önce
ebeveyn
işleme
74a02ccfc5

+ 1
- 1
ios/RCCCustomTitleView.h Dosyayı Görüntüle

11
 @interface RCCCustomTitleView : UIView
11
 @interface RCCCustomTitleView : UIView
12
 
12
 
13
 -(instancetype)initWithFrame:(CGRect)frame subView:(UIView*)subView alignment:(NSString*)alignment;
13
 -(instancetype)initWithFrame:(CGRect)frame subView:(UIView*)subView alignment:(NSString*)alignment;
14
-
14
+- (void) viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator;
15
 @end
15
 @end

+ 54
- 0
ios/RCCCustomTitleView.m Dosyayı Görüntüle

11
 @interface RCCCustomTitleView ()
11
 @interface RCCCustomTitleView ()
12
 @property (nonatomic, strong) UIView *subView;
12
 @property (nonatomic, strong) UIView *subView;
13
 @property (nonatomic, strong) NSString *subViewAlign;
13
 @property (nonatomic, strong) NSString *subViewAlign;
14
+@property float initialWidth;
14
 @end
15
 @end
15
 
16
 
16
 @implementation RCCCustomTitleView
17
 @implementation RCCCustomTitleView
17
 
18
 
18
 
19
 
19
 -(instancetype)initWithFrame:(CGRect)frame subView:(UIView*)subView alignment:(NSString*)alignment {
20
 -(instancetype)initWithFrame:(CGRect)frame subView:(UIView*)subView alignment:(NSString*)alignment {
21
+    _initialWidth = frame.size.width;
20
     self = [super initWithFrame:frame];
22
     self = [super initWithFrame:frame];
21
     
23
     
22
     if (self) {
24
     if (self) {
52
     }
54
     }
53
 }
55
 }
54
 
56
 
57
+- (void)setFrame:(CGRect) frame {
58
+
59
+    float referenceWidth = [self statusBarWidth];
60
+    if (referenceWidth == 0) {
61
+        referenceWidth = _initialWidth;
62
+    }
63
+    float newNavBarWidth = frame.size.width;
64
+    BOOL frameNeedsToBeCorrected = newNavBarWidth < referenceWidth || CGRectEqualToRect(self.frame, CGRectZero);
65
+
66
+    if (frameNeedsToBeCorrected) {
67
+        // first we need to find out the total point diff of the status bar and the nav bar
68
+        float navBarHorizontalMargin = referenceWidth - newNavBarWidth;
69
+        
70
+        CGRect correctedFrame = frame;
71
+
72
+        // then we need to place the nav bar half times the horizontal margin to the left
73
+        correctedFrame.origin.x = -(navBarHorizontalMargin / 2);
74
+        
75
+        // and finally set the width so that it's equal to the status bar width
76
+        correctedFrame.size.width = referenceWidth;
77
+        
78
+        [super setFrame:correctedFrame];
79
+    } else if (frame.size.height != self.frame.size.height) { // otherwise
80
+        // if only the height has changed
81
+        CGRect newHeightFrame = self.frame;
82
+        // make sure we update just the height
83
+        newHeightFrame.size.height = frame.size.height;
84
+        [super setFrame:newHeightFrame];
85
+    }
86
+    
87
+    // keep a ref to the last frame, so that we avoid setting the frame twice for no reason
88
+//    _lastFrame = frame;
89
+}
90
+
91
+
92
+- (void) viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator {
93
+    // whenever the orientation changes this runs
94
+    // and sets the nav bar item width to the new size width
95
+    CGRect newFrame = self.frame;
96
+
97
+    if (newFrame.size.width < size.width) {
98
+        newFrame.size.width = size.width;
99
+        newFrame.origin.x = 0;
100
+    }
101
+    [super setFrame:newFrame];
102
+}
103
+
104
+-(float) statusBarWidth {
105
+    CGSize statusBarSize = [[UIApplication sharedApplication] statusBarFrame].size;
106
+    return MAX(statusBarSize.width, statusBarSize.height);
107
+}
108
+
55
 @end
109
 @end

+ 13
- 2
ios/RCCViewController.m Dosyayı Görüntüle

649
       NSDictionary *initialProps = self.navigatorStyle[@"navBarCustomViewInitialProps"];
649
       NSDictionary *initialProps = self.navigatorStyle[@"navBarCustomViewInitialProps"];
650
       RCTRootView *reactView = [[RCTRootView alloc] initWithBridge:bridge moduleName:navBarCustomView initialProperties:initialProps];
650
       RCTRootView *reactView = [[RCTRootView alloc] initWithBridge:bridge moduleName:navBarCustomView initialProperties:initialProps];
651
       
651
       
652
-      RCCCustomTitleView *titleView = [[RCCCustomTitleView alloc] initWithFrame:self.navigationController.navigationBar.bounds subView:reactView alignment:self.navigatorStyle[@"navBarComponentAlignment"]];
652
+      RCCCustomTitleView *titleView = [[RCCCustomTitleView alloc] initWithFrame:self.navigationController.navigationBar.bounds
653
+                                                                        subView:reactView
654
+                                                                      alignment:self.navigatorStyle[@"navBarComponentAlignment"]];
653
       titleView.backgroundColor = [UIColor clearColor];
655
       titleView.backgroundColor = [UIColor clearColor];
654
       reactView.backgroundColor = [UIColor clearColor];
656
       reactView.backgroundColor = [UIColor clearColor];
655
       
657
       
658
+    
656
       self.navigationItem.titleView = titleView;
659
       self.navigationItem.titleView = titleView;
657
       
660
       
658
       self.navigationItem.titleView.backgroundColor = [UIColor clearColor];
661
       self.navigationItem.titleView.backgroundColor = [UIColor clearColor];
659
-      self.navigationItem.titleView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
662
+      self.navigationItem.titleView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
660
       self.navigationItem.titleView.clipsToBounds = YES;
663
       self.navigationItem.titleView.clipsToBounds = YES;
661
     }
664
     }
662
   }
665
   }
663
 }
666
 }
664
 
667
 
668
+- (void) viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator {
669
+  [super viewWillTransitionToSize:size withTransitionCoordinator:coordinator];
670
+  RCCCustomTitleView* customNavBar = (RCCCustomTitleView*) self.navigationItem.titleView;
671
+  if (customNavBar && [customNavBar isKindOfClass:[RCCCustomTitleView class]]) {
672
+    [customNavBar viewWillTransitionToSize:size withTransitionCoordinator:coordinator];
673
+  }
674
+}
675
+
665
 
676
 
666
 -(void)storeOriginalNavBarImages {
677
 -(void)storeOriginalNavBarImages {
667
   
678