Browse Source

[iOS] Add support for bar button system items (#2133)

* Add converter for UIBarButtonSystemItem

* Add support for UIBarButtonSystemItem-styled buttons

* Add documentation about systemItem
Eli Perkins 7 years ago
parent
commit
5f7f6bccfb

+ 31
- 0
docs/adding-buttons-to-the-navigator.md View File

@@ -64,11 +64,42 @@ class FirstTabScreen extends Component {
64 64
     buttonColor: 'blue', // Set color for the button (can also be used in setButtons function to set different button style programatically)
65 65
     buttonFontSize: 14, // Set font size for the button (can also be used in setButtons function to set different button style programatically)
66 66
     buttonFontWeight: '600' // Set font weight for the button (can also be used in setButtons function to set different button style programatically)
67
+    systemItem: 'compose', // Optional, iOS only. Set a system bar button item as the icon. Matches UIBarButtonSystemItem naming.
67 68
   }],
68 69
   leftButtons: [] // buttons for the left side of the nav bar (optional)
69 70
 }
70 71
 ```
71 72
 
73
+##### iOS System Items
74
+On iOS, UIKit supplies some common bar button glyphs for developers to use. The following values can be supplied as values to to `systemItem` to use them as an icon for your button.
75
+
76
+* `done`
77
+* `cancel`
78
+* `edit`
79
+* `save`
80
+* `add`
81
+* `flexibleSpace`
82
+* `fixedSpace`
83
+* `compose`
84
+* `reply`
85
+* `action`
86
+* `organize`
87
+* `bookmarks`
88
+* `search`
89
+* `refresh`
90
+* `stop`
91
+* `camera`
92
+* `trash`
93
+* `play`
94
+* `pause`
95
+* `rewind`
96
+* `fastForward`
97
+* `undo`
98
+* `redo`
99
+
100
+More information about these glyphs can be found in [Apple's Human Interface Guidelines](https://developer.apple.com/ios/human-interface-guidelines/icons-and-images/system-icons/).
101
+
102
+
72 103
 ##### Android left button
73 104
 On Android, four button types are supported by default without the need to provide an icon. You can use them by specifying one of the following ids in your left button definition:
74 105
 

+ 8
- 0
ios/Helpers/RCTConvert+UIBarButtonSystemItem.h View File

@@ -0,0 +1,8 @@
1
+#import <UIKit/UIKit.h>
2
+#import <React/RCTConvert.h>
3
+
4
+@interface RCTConvert (UIBarButtonSystemItem)
5
+
6
++ (UIBarButtonSystemItem)UIBarButtonSystemItem:(id)json;
7
+
8
+@end

+ 32
- 0
ios/Helpers/RCTConvert+UIBarButtonSystemItem.m View File

@@ -0,0 +1,32 @@
1
+#import <UIKit/UIKit.h>
2
+#import "RCTConvert+UIBarButtonSystemItem.h"
3
+
4
+@implementation RCTConvert (UIBarButtonSystemItem)
5
+
6
+RCT_ENUM_CONVERTER(UIBarButtonSystemItem, (@{
7
+    @"done" : @(UIBarButtonSystemItemDone),
8
+    @"cancel" : @(UIBarButtonSystemItemCancel),
9
+    @"edit" : @(UIBarButtonSystemItemEdit),
10
+    @"save" : @(UIBarButtonSystemItemSave),
11
+    @"add" : @(UIBarButtonSystemItemAdd),
12
+    @"flexibleSpace" : @(UIBarButtonSystemItemFlexibleSpace),
13
+    @"fixedSpace" : @(UIBarButtonSystemItemFixedSpace),
14
+    @"compose" : @(UIBarButtonSystemItemCompose),
15
+    @"reply" : @(UIBarButtonSystemItemReply),
16
+    @"action" : @(UIBarButtonSystemItemAction),
17
+    @"organize" : @(UIBarButtonSystemItemOrganize),
18
+    @"bookmarks" : @(UIBarButtonSystemItemBookmarks),
19
+    @"search" : @(UIBarButtonSystemItemSearch),
20
+    @"refresh" : @(UIBarButtonSystemItemRefresh),
21
+    @"stop" : @(UIBarButtonSystemItemStop),
22
+    @"camera" : @(UIBarButtonSystemItemCamera),
23
+    @"trash" : @(UIBarButtonSystemItemTrash),
24
+    @"play" : @(UIBarButtonSystemItemPlay),
25
+    @"pause" : @(UIBarButtonSystemItemPause),
26
+    @"rewind" : @(UIBarButtonSystemItemRewind),
27
+    @"fastForward" : @(UIBarButtonSystemItemFastForward),
28
+    @"undo" : @(UIBarButtonSystemItemUndo),
29
+    @"redo" : @(UIBarButtonSystemItemRedo),
30
+}), UIBarButtonSystemItemDone, integerValue)
31
+
32
+@end

+ 6
- 0
ios/RCCNavigationController.m View File

@@ -13,6 +13,7 @@
13 13
 #import "RCCCustomBarButtonItem.h"
14 14
 #import "UIViewController+Rotation.h"
15 15
 #import "RCTHelpers.h"
16
+#import "RCTConvert+UIBarButtonSystemItem.h"
16 17
 
17 18
 @implementation RCCNavigationController
18 19
 {
@@ -379,6 +380,8 @@ NSString const *CALLBACK_ASSOCIATED_ID = @"RCCNavigationController.CALLBACK_ASSO
379 380
     id icon = button[@"icon"];
380 381
     if (icon) iconImage = [RCTConvert UIImage:icon];
381 382
     NSString *__nullable component = button[@"component"];
383
+    NSString *__nullable systemItemName = button[@"systemItem"];
384
+    UIBarButtonSystemItem systemItem = [RCTConvert UIBarButtonSystemItem:systemItemName];
382 385
 
383 386
     UIBarButtonItem *barButtonItem;
384 387
     if (iconImage)
@@ -398,6 +401,9 @@ NSString const *CALLBACK_ASSOCIATED_ID = @"RCCNavigationController.CALLBACK_ASSO
398 401
       RCTBridge *bridge = [[RCCManager sharedInstance] getBridge];
399 402
       barButtonItem = [[RCCCustomBarButtonItem alloc] initWithComponentName:component passProps:button[@"passProps"] bridge:bridge];
400 403
     }
404
+    else if (systemItemName) {
405
+      barButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:systemItem target:self action:@selector(onButtonPress:)];
406
+    }
401 407
     else continue;
402 408
     objc_setAssociatedObject(barButtonItem, &CALLBACK_ASSOCIATED_KEY, button[@"onPress"], OBJC_ASSOCIATION_RETAIN_NONATOMIC);
403 409
     [barButtonItems addObject:barButtonItem];

+ 6
- 0
ios/ReactNativeNavigation.xcodeproj/project.pbxproj View File

@@ -12,6 +12,7 @@
12 12
 		26714EAC1EB0E9D3009F4D52 /* RCCCustomTitleView.m in Sources */ = {isa = PBXBuildFile; fileRef = 26714EAB1EB0E9D3009F4D52 /* RCCCustomTitleView.m */; };
13 13
 		26AFF3F51D7EEE2400CBA211 /* RCCTitleViewHelper.m in Sources */ = {isa = PBXBuildFile; fileRef = 26AFF3F41D7EEE2400CBA211 /* RCCTitleViewHelper.m */; };
14 14
 		2DCD499A1F33AAC30035123A /* RCCCustomBarButtonItem.m in Sources */ = {isa = PBXBuildFile; fileRef = 2DCD49981F33AAC30035123A /* RCCCustomBarButtonItem.m */; };
15
+		2DDE72091FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.m in Sources */ = {isa = PBXBuildFile; fileRef = 2DDE72071FB27E720017290C /* RCTConvert+UIBarButtonSystemItem.m */; };
15 16
 		CC84A19E1C1A0C4E00B3A6A2 /* RCCManager.m in Sources */ = {isa = PBXBuildFile; fileRef = CC84A1941C1A0C4E00B3A6A2 /* RCCManager.m */; };
16 17
 		CC84A19F1C1A0C4E00B3A6A2 /* RCCManagerModule.m in Sources */ = {isa = PBXBuildFile; fileRef = CC84A1961C1A0C4E00B3A6A2 /* RCCManagerModule.m */; };
17 18
 		CC84A1A01C1A0C4E00B3A6A2 /* RCCNavigationController.m in Sources */ = {isa = PBXBuildFile; fileRef = CC84A1981C1A0C4E00B3A6A2 /* RCCNavigationController.m */; };
@@ -61,6 +62,8 @@
61 62
 		26AFF3F41D7EEE2400CBA211 /* RCCTitleViewHelper.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = RCCTitleViewHelper.m; path = Helpers/RCCTitleViewHelper.m; sourceTree = "<group>"; };
62 63
 		2DCD49981F33AAC30035123A /* RCCCustomBarButtonItem.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCCCustomBarButtonItem.m; sourceTree = "<group>"; };
63 64
 		2DCD49991F33AAC30035123A /* RCCCustomBarButtonItem.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCCCustomBarButtonItem.h; sourceTree = "<group>"; };
65
+		2DDE72071FB27E720017290C /* RCTConvert+UIBarButtonSystemItem.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = "RCTConvert+UIBarButtonSystemItem.m"; sourceTree = "<group>"; };
66
+		2DDE72081FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = "RCTConvert+UIBarButtonSystemItem.h"; sourceTree = "<group>"; };
64 67
 		CC84A1931C1A0C4E00B3A6A2 /* RCCManager.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCCManager.h; sourceTree = "<group>"; };
65 68
 		CC84A1941C1A0C4E00B3A6A2 /* RCCManager.m */ = {isa = PBXFileReference; fileEncoding = 4; indentWidth = 2; lastKnownFileType = sourcecode.c.objc; path = RCCManager.m; sourceTree = "<group>"; tabWidth = 2; };
66 69
 		CC84A1951C1A0C4E00B3A6A2 /* RCCManagerModule.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCCManagerModule.h; sourceTree = "<group>"; };
@@ -241,6 +244,8 @@
241 244
 		D8D779951D04B7180050CFEA /* Helpers */ = {
242 245
 			isa = PBXGroup;
243 246
 			children = (
247
+				2DDE72081FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.h */,
248
+				2DDE72071FB27E720017290C /* RCTConvert+UIBarButtonSystemItem.m */,
244 249
 				2611087E1E6C495400BF5D98 /* UIViewController+Rotation.h */,
245 250
 				2611087F1E6C495400BF5D98 /* UIViewController+Rotation.m */,
246 251
 				D8D779961D04B7180050CFEA /* RCTHelpers.h */,
@@ -335,6 +340,7 @@
335 340
 				D85082E41CBCF54200FDB961 /* SidebarAnimation.m in Sources */,
336 341
 				D8E11C571CBD1F670018B644 /* RCCDrawerController.m in Sources */,
337 342
 				260804DB1CE0D9D20094DBA1 /* RCCToolBar.m in Sources */,
343
+				2DDE72091FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.m in Sources */,
338 344
 			);
339 345
 			runOnlyForDeploymentPostprocessing = 0;
340 346
 		};