react-native-navigation navbar中的上下文彈出菜單

是否可以使用「react-native-navigation」導航欄中的「react-native-popup-menu」來設置三個點上下文菜單？或者我們有任何其他的方法來設置三個點上下文菜單在IOS和Android與「react-native-navigation」導航欄？react-native-navigation navbar中的上下文彈出菜單

來源

2017-09-28 ugendrang

hm ...對於RNN來說，它看起來沒有直接的解決方案（適用於ios和android），因爲它意味着真正的本地導航，因此不支持使用自定義組件的高度可擴展性。 – sodik

您可以使用showAsAction屬性控制每個按鈕的優先級和定位（在Android上）。請參閱docs瞭解更多詳情。

總之，下面的片段將增加兩個按鈕在菜單和一個外：

static navigatorButtons = { 
    rightButtons: [ 
    { 
     id: 'btn1', 
     title: 'Menu button 1' 
     showAsAction: 'never' 
    }, 
    { 
     id: 'btn2', 
     title: 'Menu button 2' 
     showAsAction: 'never' 
    }, 
    { 
     id: 'btn3', 
     title: 'Regular Button' 
     icon: require('./img/button.jpeg'), 
     showAsAction: 'always' 
    } 
    ] 
);

因爲在iOS一個動作片通常用於代替菜單這是不適用於iOS。

來源

2017-09-29 15:26:39

我一直在想關於這個問題，很好，找到了解決方法：一般情況下，所有的菜單部分必須是Menu標籤內，所以MenuTrigger爲好。您可以設定MenuTrigger的樣式，但我沒有將它帶入頂部欄。

好消息：它甚至比這更簡單，只需將整個Menu到您的navigationOptions這樣的：

static navigationOptions = ({navigation}) => ({ 
    title: 'Uploaded Videos', 
    drawerLockMode: 'locked-closed', 
    headerRight: 
    <Menu renderer={SlideInMenu} style={{ zIndex: 10 }}> 
     <MenuTrigger text="open menu"/> 
     <MenuOptions style={{ flex: 1 }}> 
     <Text>Menu</Text> 
     <MenuOption onSelect={() => { console.log("clicked") text="Click me" /> 
     </MenuOptions> 
    </Menu>

警告：navigationOptions是靜態的，所以在你的菜單中，您不能使用該組件的功能。但是有一些方法，例如this issue at react-native-navigation。一般來說，你可能應該使用redux。

希望這仍然可以幫助你！

來源

2018-02-28 11:54:05 konse

react-native-navigation navbar中的上下文彈出菜單

回答

相關問題