78 lines
2.1 KiB
TypeScript
78 lines
2.1 KiB
TypeScript
import * as React from 'react';
|
|
|
|
import { ContextMenuView, OnPressMenuItemEvent } from 'react-native-ios-context-menu';
|
|
|
|
import type { ContextMenuExampleProps } from './SharedExampleTypes';
|
|
import { ContextMenuCard } from '../components/ContextMenuCard';
|
|
import { Alert } from 'react-native';
|
|
|
|
|
|
export function ContextMenuViewTest06(props: ContextMenuExampleProps) {
|
|
const [itemCount, setItemCount] = React.useState(0);
|
|
|
|
const hasItems = (itemCount > 0);
|
|
|
|
const items = [...Array(itemCount).keys()];
|
|
|
|
const hanldeOnPressMenuItem: OnPressMenuItemEvent = ({nativeEvent}) => {
|
|
switch (nativeEvent.actionKey) {
|
|
case 'add-action':
|
|
setItemCount((prevValue) => (prevValue + 1));
|
|
break;
|
|
|
|
case 'delete-all':
|
|
setItemCount(0);
|
|
break;
|
|
|
|
default:
|
|
Alert.alert('onPressMenuItem', `actionKey: ${nativeEvent.actionKey}`);
|
|
break;
|
|
};
|
|
};
|
|
|
|
return (
|
|
<ContextMenuView
|
|
style={props.style}
|
|
menuConfig={{
|
|
menuTitle: 'ContextMenuViewTest06',
|
|
menuItems: [{
|
|
actionKey : 'add-action',
|
|
actionTitle: 'Add Action',
|
|
icon: {
|
|
iconType : 'SYSTEM',
|
|
iconValue: 'plus',
|
|
}
|
|
}, {
|
|
actionKey : 'delete-all',
|
|
actionTitle : 'Delete All',
|
|
menuAttributes: [hasItems? 'destructive' : 'disabled'],
|
|
icon: {
|
|
iconType : 'SYSTEM',
|
|
iconValue: 'trash',
|
|
}
|
|
}, {
|
|
menuTitle : 'submenu',
|
|
menuOptions: ['displayInline'],
|
|
menuItems : items.map(item => ({
|
|
actionKey : `item-key-${item}`,
|
|
actionTitle: `Action #${item}`,
|
|
icon: {
|
|
iconType : 'SYSTEM',
|
|
iconValue: (item % 2 === 0)? 'heart.fill' : 'heart',
|
|
}
|
|
})),
|
|
}],
|
|
}}
|
|
onPressMenuItem={hanldeOnPressMenuItem}
|
|
>
|
|
<ContextMenuCard
|
|
index={props.index}
|
|
title={'ContextMenuViewTest06'}
|
|
subtitle={'add menu action'}
|
|
description={[
|
|
`Test for programmatically adding a menu action`
|
|
]}
|
|
/>
|
|
</ContextMenuView>
|
|
);
|
|
}; |