react-native-navigation的迁移库

options-button.mdx 2.9KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. ---
  2. id: options-button
  3. title: Button Options
  4. sidebar_label: Button
  5. ---
  6. ```js
  7. const options = {
  8. topBar: {
  9. leftButtons: [
  10. {
  11. id: "id",
  12. text: "Button"
  13. }
  14. ]
  15. }
  16. };
  17. ```
  18. ### `id`
  19. Buttons are identified by their id property. When a button is clicked, a buttonPress event is emitted to js, containing the id of the clicked button.
  20. | Type | Required | Platform |
  21. | ------ | -------- | -------- |
  22. | string | Yes | Both |
  23. ### `icon`
  24. Button icon. If the button is pushed to the overflow menu, the button [text](#text) is used instead.
  25. | Type | Required | Platform |
  26. | ------ | -------- | -------- |
  27. | number | No | Both |
  28. ### `text`
  29. Button text. Ignored if an icon is specified, unless the button is displayed in the overflow menu.
  30. | Type | Required | Platform |
  31. | ------ | -------- | -------- |
  32. | string | No | Both |
  33. ### `showAsAction`
  34. | Type | Required | Platform |
  35. | --------------------------------------------- | -------- | -------- |
  36. | enum('always', 'never', 'withText', 'ifRoom') | No | Android |
  37. - **ifRooom** - Only add button to the TopBar if there is room for it, otherwise add it to the overflow menu.
  38. - **never** - Never place this button in the TopBar. Instead, list the button in the overflow menu.
  39. - **always** - Always place this button in the app bar.
  40. ### `component`
  41. Set a react [component](layout-component.mdx) as this button's view which will be displayed instead of the regular view.
  42. | Type | Required | Platform |
  43. | ---------------------- | -------- | -------- |
  44. | [Component](layout-component.mdx) | No | Both |
  45. ### `iconInsets`
  46. [IconInsets](options-iconInsets.mdx) are applied to the icon to translate its original position on the screen.
  47. | Type | Required | Platform |
  48. | ---------- | -------- | -------- |
  49. | IconInsets | No | iOS |
  50. ### `systemItem`
  51. System icon; ignored if an [icon](#icon-number) is specified. For more information, see [apple's guidelines](https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/system-icons/).
  52. | Type | Required | Platform |
  53. | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- |
  54. | enum('done', 'cancel', 'edit', 'save', 'add', 'flexibleSpace', 'fixedSpace', 'compose', 'reply', 'action', 'organize', 'bookmarks', 'search', 'refresh', 'stop', 'camera', 'trash', 'play', 'pause', 'rewind', 'fastForward', 'undo', 'redo') | No | iOS |