import React from 'react'; import {StyleSheet, ScrollView} from 'react-native'; import Row from '../components/Row'; class Actions extends React.Component { constructor(props) { super(props); this._fab = false; this._rightButton = null; this._contextualMenu = false; this._toggleTabs = 'shown'; this._toggleNavBar = 'shown'; this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this)); } onNavigatorEvent(event) { if (event.id === 'contextualMenuDismissed') { this._contextualMenu = false; } } setTitle = () => { this.props.navigator.setTitle({ title: 'New Title!', }); }; toggleTabs = () => { const to = this._toggleTabs === 'shown' ? 'hidden' : 'shown'; this.props.navigator.toggleTabs({ to, animated: true, }); this._toggleTabs = to; }; setTabBadge = () => { this.props.navigator.setTabBadge({ tabIndex: 1, badge: Math.floor(Math.random() * 20) + 1, }); }; switchToTab = () => { this.props.navigator.switchToTab({ tabIndex: 0, }); }; toggleNavBar = () => { const to = this._toggleNavBar === 'shown' ? 'hidden' : 'shown'; this.props.navigator.toggleNavBar({ to, animated: true, }); this._toggleNavBar = to; }; showSnackbar = () => { this.props.navigator.showSnackbar({ title: 'Woo Snacks!', }); }; toggleContextualMenu = () => { if (!this._contextualMenu) { this.props.navigator.showContextualMenu({ rightButtons: [{ title: 'Edit', icon: require('../../img/edit.png'), }, { title: 'Delete', icon: require('../../img/delete.png'), }], onButtonPressed: (index) => console.log(`Button ${index} tapped`) }); this._contextualMenu = true; } else { this.props.navigator.dismissContextualMenu(); this._contextualMenu = false; } }; setButtons = () => { let title = ''; if (!this._rightButton) { title = 'Hello'; } else if (this._rightButton === 'Hello') { title = 'Its Me'; } this.props.navigator.setButtons({ rightButtons: [{ title, id: 'topRight', }], animated: true, }); this._rightButton = title; }; toggleFAB = () => { if (this._fab) { this.props.navigator.setButtons({ fab: {}, }); this._fab = false; } else { this.props.navigator.setButtons({ fab: { collapsedId: 'share', collapsedIcon: require('../../img/edit@1x.png'), expendedId: 'clear', expendedIcon: require('../../img/edit@1x.png'), backgroundColor: '#ff505c', actions: [ { id: 'mail', icon: require('../../img/edit@1x.png'), backgroundColor: '#03A9F4' }, { id: 'delete', icon: require('../../img/delete@1x.png'), backgroundColor: '#4CAF50' } ] }, animated: true, }); this._fab = true; } }; render() { return ( ); } } const styles = StyleSheet.create({ container: {}, }); export default Actions;