diff --git a/docs/adding-buttons-to-the-navigator.md b/docs/adding-buttons-to-the-navigator.md index ed3f1ebbf1e..11eb16569e7 100644 --- a/docs/adding-buttons-to-the-navigator.md +++ b/docs/adding-buttons-to-the-navigator.md @@ -64,11 +64,42 @@ class FirstTabScreen extends Component { buttonColor: 'blue', // Set color for the button (can also be used in setButtons function to set different button style programatically) buttonFontSize: 14, // Set font size for the button (can also be used in setButtons function to set different button style programatically) buttonFontWeight: '600' // Set font weight for the button (can also be used in setButtons function to set different button style programatically) + systemItem: 'compose', // Optional, iOS only. Set a system bar button item as the icon. Matches UIBarButtonSystemItem naming. }], leftButtons: [] // buttons for the left side of the nav bar (optional) } ``` +##### iOS System Items +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. + +* `done` +* `cancel` +* `edit` +* `save` +* `add` +* `flexibleSpace` +* `fixedSpace` +* `compose` +* `reply` +* `action` +* `organize` +* `bookmarks` +* `search` +* `refresh` +* `stop` +* `camera` +* `trash` +* `play` +* `pause` +* `rewind` +* `fastForward` +* `undo` +* `redo` + +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/). + + ##### Android left button 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: diff --git a/ios/Helpers/RCTConvert+UIBarButtonSystemItem.h b/ios/Helpers/RCTConvert+UIBarButtonSystemItem.h new file mode 100644 index 00000000000..c55a42b63cf --- /dev/null +++ b/ios/Helpers/RCTConvert+UIBarButtonSystemItem.h @@ -0,0 +1,8 @@ +#import +#import + +@interface RCTConvert (UIBarButtonSystemItem) + ++ (UIBarButtonSystemItem)UIBarButtonSystemItem:(id)json; + +@end diff --git a/ios/Helpers/RCTConvert+UIBarButtonSystemItem.m b/ios/Helpers/RCTConvert+UIBarButtonSystemItem.m new file mode 100644 index 00000000000..9ec9c03389b --- /dev/null +++ b/ios/Helpers/RCTConvert+UIBarButtonSystemItem.m @@ -0,0 +1,32 @@ +#import +#import "RCTConvert+UIBarButtonSystemItem.h" + +@implementation RCTConvert (UIBarButtonSystemItem) + +RCT_ENUM_CONVERTER(UIBarButtonSystemItem, (@{ + @"done" : @(UIBarButtonSystemItemDone), + @"cancel" : @(UIBarButtonSystemItemCancel), + @"edit" : @(UIBarButtonSystemItemEdit), + @"save" : @(UIBarButtonSystemItemSave), + @"add" : @(UIBarButtonSystemItemAdd), + @"flexibleSpace" : @(UIBarButtonSystemItemFlexibleSpace), + @"fixedSpace" : @(UIBarButtonSystemItemFixedSpace), + @"compose" : @(UIBarButtonSystemItemCompose), + @"reply" : @(UIBarButtonSystemItemReply), + @"action" : @(UIBarButtonSystemItemAction), + @"organize" : @(UIBarButtonSystemItemOrganize), + @"bookmarks" : @(UIBarButtonSystemItemBookmarks), + @"search" : @(UIBarButtonSystemItemSearch), + @"refresh" : @(UIBarButtonSystemItemRefresh), + @"stop" : @(UIBarButtonSystemItemStop), + @"camera" : @(UIBarButtonSystemItemCamera), + @"trash" : @(UIBarButtonSystemItemTrash), + @"play" : @(UIBarButtonSystemItemPlay), + @"pause" : @(UIBarButtonSystemItemPause), + @"rewind" : @(UIBarButtonSystemItemRewind), + @"fastForward" : @(UIBarButtonSystemItemFastForward), + @"undo" : @(UIBarButtonSystemItemUndo), + @"redo" : @(UIBarButtonSystemItemRedo), +}), UIBarButtonSystemItemDone, integerValue) + +@end diff --git a/ios/RCCNavigationController.m b/ios/RCCNavigationController.m index 4bdbffa0664..bbf0e534559 100755 --- a/ios/RCCNavigationController.m +++ b/ios/RCCNavigationController.m @@ -13,6 +13,7 @@ #import "RCCCustomBarButtonItem.h" #import "UIViewController+Rotation.h" #import "RCTHelpers.h" +#import "RCTConvert+UIBarButtonSystemItem.h" @implementation RCCNavigationController { @@ -379,6 +380,8 @@ -(void)setButtons:(NSArray*)buttons viewController:(UIViewController*)viewContro id icon = button[@"icon"]; if (icon) iconImage = [RCTConvert UIImage:icon]; NSString *__nullable component = button[@"component"]; + NSString *__nullable systemItemName = button[@"systemItem"]; + UIBarButtonSystemItem systemItem = [RCTConvert UIBarButtonSystemItem:systemItemName]; UIBarButtonItem *barButtonItem; if (iconImage) @@ -398,6 +401,9 @@ -(void)setButtons:(NSArray*)buttons viewController:(UIViewController*)viewContro RCTBridge *bridge = [[RCCManager sharedInstance] getBridge]; barButtonItem = [[RCCCustomBarButtonItem alloc] initWithComponentName:component passProps:button[@"passProps"] bridge:bridge]; } + else if (systemItemName) { + barButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:systemItem target:self action:@selector(onButtonPress:)]; + } else continue; objc_setAssociatedObject(barButtonItem, &CALLBACK_ASSOCIATED_KEY, button[@"onPress"], OBJC_ASSOCIATION_RETAIN_NONATOMIC); [barButtonItems addObject:barButtonItem]; diff --git a/ios/ReactNativeNavigation.xcodeproj/project.pbxproj b/ios/ReactNativeNavigation.xcodeproj/project.pbxproj index 635048b1b3b..212af1bd60e 100644 --- a/ios/ReactNativeNavigation.xcodeproj/project.pbxproj +++ b/ios/ReactNativeNavigation.xcodeproj/project.pbxproj @@ -12,6 +12,7 @@ 26714EAC1EB0E9D3009F4D52 /* RCCCustomTitleView.m in Sources */ = {isa = PBXBuildFile; fileRef = 26714EAB1EB0E9D3009F4D52 /* RCCCustomTitleView.m */; }; 26AFF3F51D7EEE2400CBA211 /* RCCTitleViewHelper.m in Sources */ = {isa = PBXBuildFile; fileRef = 26AFF3F41D7EEE2400CBA211 /* RCCTitleViewHelper.m */; }; 2DCD499A1F33AAC30035123A /* RCCCustomBarButtonItem.m in Sources */ = {isa = PBXBuildFile; fileRef = 2DCD49981F33AAC30035123A /* RCCCustomBarButtonItem.m */; }; + 2DDE72091FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.m in Sources */ = {isa = PBXBuildFile; fileRef = 2DDE72071FB27E720017290C /* RCTConvert+UIBarButtonSystemItem.m */; }; CC84A19E1C1A0C4E00B3A6A2 /* RCCManager.m in Sources */ = {isa = PBXBuildFile; fileRef = CC84A1941C1A0C4E00B3A6A2 /* RCCManager.m */; }; CC84A19F1C1A0C4E00B3A6A2 /* RCCManagerModule.m in Sources */ = {isa = PBXBuildFile; fileRef = CC84A1961C1A0C4E00B3A6A2 /* RCCManagerModule.m */; }; CC84A1A01C1A0C4E00B3A6A2 /* RCCNavigationController.m in Sources */ = {isa = PBXBuildFile; fileRef = CC84A1981C1A0C4E00B3A6A2 /* RCCNavigationController.m */; }; @@ -61,6 +62,8 @@ 26AFF3F41D7EEE2400CBA211 /* RCCTitleViewHelper.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = RCCTitleViewHelper.m; path = Helpers/RCCTitleViewHelper.m; sourceTree = ""; }; 2DCD49981F33AAC30035123A /* RCCCustomBarButtonItem.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCCCustomBarButtonItem.m; sourceTree = ""; }; 2DCD49991F33AAC30035123A /* RCCCustomBarButtonItem.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCCCustomBarButtonItem.h; sourceTree = ""; }; + 2DDE72071FB27E720017290C /* RCTConvert+UIBarButtonSystemItem.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = "RCTConvert+UIBarButtonSystemItem.m"; sourceTree = ""; }; + 2DDE72081FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = "RCTConvert+UIBarButtonSystemItem.h"; sourceTree = ""; }; CC84A1931C1A0C4E00B3A6A2 /* RCCManager.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCCManager.h; sourceTree = ""; }; CC84A1941C1A0C4E00B3A6A2 /* RCCManager.m */ = {isa = PBXFileReference; fileEncoding = 4; indentWidth = 2; lastKnownFileType = sourcecode.c.objc; path = RCCManager.m; sourceTree = ""; tabWidth = 2; }; CC84A1951C1A0C4E00B3A6A2 /* RCCManagerModule.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCCManagerModule.h; sourceTree = ""; }; @@ -241,6 +244,8 @@ D8D779951D04B7180050CFEA /* Helpers */ = { isa = PBXGroup; children = ( + 2DDE72081FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.h */, + 2DDE72071FB27E720017290C /* RCTConvert+UIBarButtonSystemItem.m */, 2611087E1E6C495400BF5D98 /* UIViewController+Rotation.h */, 2611087F1E6C495400BF5D98 /* UIViewController+Rotation.m */, D8D779961D04B7180050CFEA /* RCTHelpers.h */, @@ -335,6 +340,7 @@ D85082E41CBCF54200FDB961 /* SidebarAnimation.m in Sources */, D8E11C571CBD1F670018B644 /* RCCDrawerController.m in Sources */, 260804DB1CE0D9D20094DBA1 /* RCCToolBar.m in Sources */, + 2DDE72091FB27E730017290C /* RCTConvert+UIBarButtonSystemItem.m in Sources */, ); runOnlyForDeploymentPostprocessing = 0; };