Browse Source

Support iOS system item icons for top bar (#4547)

Bernd Schrooten 6 years ago
parent
commit
7a26ea956c

+ 30
- 0
docs/docs/topBar-buttons.md View File

10
     name: 'example.CustomButtonComponent'
10
     name: 'example.CustomButtonComponent'
11
   },
11
   },
12
   text: 'Button one',
12
   text: 'Button one',
13
+  systemItem: 'done', // iOS only. Sets a system bar button item as the icon. Matches UIBarButtonSystemItem naming. See below for details.
13
   enabled: true,
14
   enabled: true,
14
   disableIconTint: false,
15
   disableIconTint: false,
15
   color: 'red',
16
   color: 'red',
18
 }
19
 }
19
 ```
20
 ```
20
 
21
 
22
+## iOS System Items
23
+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.
24
+
25
+* `done`
26
+* `cancel`
27
+* `edit`
28
+* `save`
29
+* `add`
30
+* `flexibleSpace`
31
+* `fixedSpace`
32
+* `compose`
33
+* `reply`
34
+* `action`
35
+* `organize`
36
+* `bookmarks`
37
+* `search`
38
+* `refresh`
39
+* `stop`
40
+* `camera`
41
+* `trash`
42
+* `play`
43
+* `pause`
44
+* `rewind`
45
+* `fastForward`
46
+* `undo`
47
+* `redo`
48
+
49
+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/).
50
+
21
 # Declaring Buttons statically
51
 # Declaring Buttons statically
22
 
52
 
23
 Buttons can be defined in a screen's options:
53
 Buttons can be defined in a screen's options:

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

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
lib/ios/RCTConvert+UIBarButtonSystemItem.m View File

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

+ 3
- 0
lib/ios/RNNNavigationButtons.m View File

67
 	NSString* buttonId = dictionary[@"id"];
67
 	NSString* buttonId = dictionary[@"id"];
68
 	NSString* title = [self getValue:dictionary[@"text"] withDefault:[defaultStyle.text getWithDefaultValue:nil]];
68
 	NSString* title = [self getValue:dictionary[@"text"] withDefault:[defaultStyle.text getWithDefaultValue:nil]];
69
 	NSDictionary* component = dictionary[@"component"];
69
 	NSDictionary* component = dictionary[@"component"];
70
+	NSString* systemItemName = dictionary[@"systemItem"];
70
 	
71
 	
71
 	if (!buttonId) {
72
 	if (!buttonId) {
72
 		@throw [NSException exceptionWithName:@"NSInvalidArgumentException" reason:[@"button id is not specified " stringByAppendingString:title] userInfo:nil];
73
 		@throw [NSException exceptionWithName:@"NSInvalidArgumentException" reason:[@"button id is not specified " stringByAppendingString:title] userInfo:nil];
91
 		if (buttonTextAttributes.allKeys.count > 0) {
92
 		if (buttonTextAttributes.allKeys.count > 0) {
92
 			[barButtonItem setTitleTextAttributes:buttonTextAttributes forState:UIControlStateNormal];
93
 			[barButtonItem setTitleTextAttributes:buttonTextAttributes forState:UIControlStateNormal];
93
 		}
94
 		}
95
+	} else if (systemItemName) {
96
+		barButtonItem = [[RNNUIBarButtonItem alloc] init:buttonId withSystemItem:systemItemName];
94
 	} else {
97
 	} else {
95
 		return nil;
98
 		return nil;
96
 	}
99
 	}

+ 1
- 0
lib/ios/RNNUIBarButtonItem.h View File

9
 -(instancetype)init:(NSString*)buttonId withIcon:(UIImage*)iconImage;
9
 -(instancetype)init:(NSString*)buttonId withIcon:(UIImage*)iconImage;
10
 -(instancetype)init:(NSString*)buttonId withTitle:(NSString*)title;
10
 -(instancetype)init:(NSString*)buttonId withTitle:(NSString*)title;
11
 -(instancetype)init:(NSString*)buttonId withCustomView:(RCTRootView*)reactView;
11
 -(instancetype)init:(NSString*)buttonId withCustomView:(RCTRootView*)reactView;
12
+-(instancetype)init:(NSString*)buttonId withSystemItem:(NSString*)systemItemName;
12
 
13
 
13
 @end
14
 @end
14
 
15
 

+ 8
- 0
lib/ios/RNNUIBarButtonItem.m View File

1
 #import <Foundation/Foundation.h>
1
 #import <Foundation/Foundation.h>
2
 #import <UIKit/UIKit.h>
2
 #import <UIKit/UIKit.h>
3
 #import "RNNUIBarButtonItem.h"
3
 #import "RNNUIBarButtonItem.h"
4
+#import "RCTConvert+UIBarButtonSystemItem.h"
4
 
5
 
5
 @implementation RNNUIBarButtonItem
6
 @implementation RNNUIBarButtonItem
6
 
7
 
25
 	self.buttonId = buttonId;
26
 	self.buttonId = buttonId;
26
 	return self;
27
 	return self;
27
 }
28
 }
29
+	
30
+-(instancetype)init:(NSString*)buttonId withSystemItem:(NSString *)systemItemName {
31
+	UIBarButtonSystemItem systemItem = [RCTConvert UIBarButtonSystemItem:systemItemName];
32
+	self = [super initWithBarButtonSystemItem:systemItem target:nil action:nil];
33
+	self.buttonId = buttonId;
34
+	return self;
35
+}
28
 
36
 
29
 - (void)rootViewDidChangeIntrinsicSize:(RCTRootView *)rootView {
37
 - (void)rootViewDidChangeIntrinsicSize:(RCTRootView *)rootView {
30
 	CGSize size = rootView.intrinsicContentSize;
38
 	CGSize size = rootView.intrinsicContentSize;

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

235
 		50F5DFC21F407A8C001A00BC /* RNNTabBarController.m in Sources */ = {isa = PBXBuildFile; fileRef = 50F5DFC01F407A8C001A00BC /* RNNTabBarController.m */; };
235
 		50F5DFC21F407A8C001A00BC /* RNNTabBarController.m in Sources */ = {isa = PBXBuildFile; fileRef = 50F5DFC01F407A8C001A00BC /* RNNTabBarController.m */; };
236
 		50F5DFC51F407AA0001A00BC /* RNNNavigationController.h in Headers */ = {isa = PBXBuildFile; fileRef = 50F5DFC31F407AA0001A00BC /* RNNNavigationController.h */; };
236
 		50F5DFC51F407AA0001A00BC /* RNNNavigationController.h in Headers */ = {isa = PBXBuildFile; fileRef = 50F5DFC31F407AA0001A00BC /* RNNNavigationController.h */; };
237
 		50F5DFC61F407AA0001A00BC /* RNNNavigationController.m in Sources */ = {isa = PBXBuildFile; fileRef = 50F5DFC41F407AA0001A00BC /* RNNNavigationController.m */; };
237
 		50F5DFC61F407AA0001A00BC /* RNNNavigationController.m in Sources */ = {isa = PBXBuildFile; fileRef = 50F5DFC41F407AA0001A00BC /* RNNNavigationController.m */; };
238
+		7365071121E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.h in Headers */ = {isa = PBXBuildFile; fileRef = 7365070F21E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.h */; };
239
+		7365071221E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.m in Sources */ = {isa = PBXBuildFile; fileRef = 7365071021E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.m */; };
238
 		7B1126A01E2D263F00F9B03B /* RNNEventEmitter.m in Sources */ = {isa = PBXBuildFile; fileRef = 7B11269F1E2D263F00F9B03B /* RNNEventEmitter.m */; };
240
 		7B1126A01E2D263F00F9B03B /* RNNEventEmitter.m in Sources */ = {isa = PBXBuildFile; fileRef = 7B11269F1E2D263F00F9B03B /* RNNEventEmitter.m */; };
239
 		7B1126A31E2D2B6C00F9B03B /* RNNSplashScreen.h in Headers */ = {isa = PBXBuildFile; fileRef = 7BA500761E254908001B9E1B /* RNNSplashScreen.h */; };
241
 		7B1126A31E2D2B6C00F9B03B /* RNNSplashScreen.h in Headers */ = {isa = PBXBuildFile; fileRef = 7BA500761E254908001B9E1B /* RNNSplashScreen.h */; };
240
 		7B1126A61E2D2B6C00F9B03B /* RNNBridgeModule.h in Headers */ = {isa = PBXBuildFile; fileRef = 7BBFE5421E25330E002A6182 /* RNNBridgeModule.h */; };
242
 		7B1126A61E2D2B6C00F9B03B /* RNNBridgeModule.h in Headers */ = {isa = PBXBuildFile; fileRef = 7BBFE5421E25330E002A6182 /* RNNBridgeModule.h */; };
558
 		50F5DFC01F407A8C001A00BC /* RNNTabBarController.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTabBarController.m; sourceTree = "<group>"; };
560
 		50F5DFC01F407A8C001A00BC /* RNNTabBarController.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTabBarController.m; sourceTree = "<group>"; };
559
 		50F5DFC31F407AA0001A00BC /* RNNNavigationController.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNNavigationController.h; sourceTree = "<group>"; };
561
 		50F5DFC31F407AA0001A00BC /* RNNNavigationController.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNNavigationController.h; sourceTree = "<group>"; };
560
 		50F5DFC41F407AA0001A00BC /* RNNNavigationController.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNNavigationController.m; sourceTree = "<group>"; };
562
 		50F5DFC41F407AA0001A00BC /* RNNNavigationController.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNNavigationController.m; sourceTree = "<group>"; };
563
+		7365070F21E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = "RCTConvert+UIBarButtonSystemItem.h"; sourceTree = "<group>"; };
564
+		7365071021E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = "RCTConvert+UIBarButtonSystemItem.m"; sourceTree = "<group>"; };
561
 		7B11269E1E2D263F00F9B03B /* RNNEventEmitter.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RNNEventEmitter.h; sourceTree = "<group>"; };
565
 		7B11269E1E2D263F00F9B03B /* RNNEventEmitter.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RNNEventEmitter.h; sourceTree = "<group>"; };
562
 		7B11269F1E2D263F00F9B03B /* RNNEventEmitter.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RNNEventEmitter.m; sourceTree = "<group>"; };
566
 		7B11269F1E2D263F00F9B03B /* RNNEventEmitter.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RNNEventEmitter.m; sourceTree = "<group>"; };
563
 		7B4928061E70415400555040 /* RNNCommandsHandler.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RNNCommandsHandler.h; sourceTree = "<group>"; };
567
 		7B4928061E70415400555040 /* RNNCommandsHandler.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RNNCommandsHandler.h; sourceTree = "<group>"; };
693
 				5038A3C0216E1E66009280BC /* RNNFontAttributesCreator.m */,
697
 				5038A3C0216E1E66009280BC /* RNNFontAttributesCreator.m */,
694
 				505EDD48214FDA800071C7DE /* RCTConvert+Modal.h */,
698
 				505EDD48214FDA800071C7DE /* RCTConvert+Modal.h */,
695
 				50E02BD521A6E54B00A43942 /* RCTConvert+SideMenuOpenGestureMode.h */,
699
 				50E02BD521A6E54B00A43942 /* RCTConvert+SideMenuOpenGestureMode.h */,
700
+				7365070F21E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.h */,
701
+				7365071021E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.m */,
696
 				5038A3BB216E1490009280BC /* RNNTabBarItemCreator.h */,
702
 				5038A3BB216E1490009280BC /* RNNTabBarItemCreator.h */,
697
 				5038A3BC216E1490009280BC /* RNNTabBarItemCreator.m */,
703
 				5038A3BC216E1490009280BC /* RNNTabBarItemCreator.m */,
698
 				5053CE7D2175FB1900D0386B /* RNNDefaultOptionsHelper.h */,
704
 				5053CE7D2175FB1900D0386B /* RNNDefaultOptionsHelper.h */,
1186
 				50495942216F5E5D006D2B81 /* NullBool.h in Headers */,
1192
 				50495942216F5E5D006D2B81 /* NullBool.h in Headers */,
1187
 				263905AE1E4C6F440023D7D3 /* MMDrawerBarButtonItem.h in Headers */,
1193
 				263905AE1E4C6F440023D7D3 /* MMDrawerBarButtonItem.h in Headers */,
1188
 				5012241621736667000F5F98 /* Color.h in Headers */,
1194
 				5012241621736667000F5F98 /* Color.h in Headers */,
1195
+				7365071121E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.h in Headers */,
1189
 				5064495D20DC62B90026709C /* RNNSideMenuSideOptions.h in Headers */,
1196
 				5064495D20DC62B90026709C /* RNNSideMenuSideOptions.h in Headers */,
1190
 				50F5DFC11F407A8C001A00BC /* RNNTabBarController.h in Headers */,
1197
 				50F5DFC11F407A8C001A00BC /* RNNTabBarController.h in Headers */,
1191
 				50395587217480C900B0A663 /* IntNumber.h in Headers */,
1198
 				50395587217480C900B0A663 /* IntNumber.h in Headers */,
1418
 				263905B41E4C6F440023D7D3 /* MMDrawerVisualState.m in Sources */,
1425
 				263905B41E4C6F440023D7D3 /* MMDrawerVisualState.m in Sources */,
1419
 				5012240B21735959000F5F98 /* RNNSideMenuPresenter.m in Sources */,
1426
 				5012240B21735959000F5F98 /* RNNSideMenuPresenter.m in Sources */,
1420
 				502CB46F20CD1DDA0019B2FE /* RNNBackButtonOptions.m in Sources */,
1427
 				502CB46F20CD1DDA0019B2FE /* RNNBackButtonOptions.m in Sources */,
1428
+				7365071221E4B16F004E020F /* RCTConvert+UIBarButtonSystemItem.m in Sources */,
1421
 				5012241B21736678000F5F98 /* Image.m in Sources */,
1429
 				5012241B21736678000F5F98 /* Image.m in Sources */,
1422
 				50495943216F5E5D006D2B81 /* NullBool.m in Sources */,
1430
 				50495943216F5E5D006D2B81 /* NullBool.m in Sources */,
1423
 				5038A3C7216E2D93009280BC /* Number.m in Sources */,
1431
 				5038A3C7216E2D93009280BC /* Number.m in Sources */,

+ 5
- 0
lib/src/interfaces/Options.ts View File

5
 type FontFamily = string;
5
 type FontFamily = string;
6
 type LayoutOrientation = 'portrait' | 'landscape';
6
 type LayoutOrientation = 'portrait' | 'landscape';
7
 type AndroidDensityNumber = number;
7
 type AndroidDensityNumber = number;
8
+type SystemItemIcon = 'done' | 'cancel' | 'edit' | 'save' | 'add' | 'flexibleSpace' | 'fixedSpace' | 'compose' | 'reply' | 'action' | 'organize' | 'bookmarks' | 'search' | 'refresh' | 'stop' | 'camera' | 'trash' | 'play' | 'pause' | 'rewind' | 'fastForward' | 'undo' | 'redo';
8
 
9
 
9
 export interface OptionsSplitView {
10
 export interface OptionsSplitView {
10
   /**
11
   /**
256
      */
257
      */
257
     passProps?: object;
258
     passProps?: object;
258
   };
259
   };
260
+  /**
261
+   * (iOS only) Set the button as an iOS system icon
262
+   */
263
+  systemItem?: SystemItemIcon;
259
   /**
264
   /**
260
    * Set the button text
265
    * Set the button text
261
    */
266
    */