Context Menus and NavigateTo in Blend / SketchFlow - xaml

Hoping this will be a simple one, in Sketchflow i'm trying to wire up a context menu to navigate to another page.
I've created the context menu, added a menu item, right clicked the mneu item in the Objects and Timeline panel and selected navigateto. When i run it, the menu comes up but when i click on the menu item it doesn't do anything.
I previously had the NavigateTo working when left clicking on another object, so the screens / connections are all in place.
This is the xaml that was generated:
<ContextMenu>
<MenuItem Header="Edit">
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseDown">
<pb:NavigateToScreenAction TargetScreen="SomeScreen.Screen_3_2"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</MenuItem>
</ContextMenu>

This xaml works for the scenario I think you are trying to achieve:
<Button Content="Button">
<Button.ContextMenu>
<ContextMenu>
<MenuItem Header="Next">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Click">
<pb:NavigateToScreenAction TargetScreen="WpfPrototype3Screens.Screen_2"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</MenuItem>
</ContextMenu>
</Button.ContextMenu>
</Button>

As long as the path for the TargetScreen is correct, just change the EventName to "Click" and it will work. "Click" handles the "MouseDown" event.

Related

Transparent context menu item during Thunderbird addon development

Currently i am developing a context menu addon for Thunderbird 3*. I am trying to add my own Submenu items as part of existing Thunderbird Context menu for mail content.
With the following XUL:
<?xml version="1.0"?>
<overlay id="sample"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/javascript" src="chrome://elane/content/expoverlay.js"/>
<popup id="mailContext">
<menu id="elMenu" label="submenu 1">
<popup id="elMenu-popup">
<menuitem id="openBing"
label="Sub Menu Item 1"
oncommand="openURL('https://bing.com')"/>
<menuitem id="openGoogle"
label="Sub Menu Item 2"
oncommand="openURL('https://google.com')"/>
</popup>
</menu>
</popup>
</overlay>
The newly added Context menu item and submenu items are having transparent background:
Can anyone help me with the reason behind this and possible fix?
Change <popup id="elMenu-popup"> and corresponding </popup> to <menupopup id="elMenu-popup"> and </menupopup>

How to change open animation of flyout menu

I have a menu flyout which is opened on ListView Items. The default open animation is quite slow is there a way to change the default animation of flyout menu?
EDIT
I am using following dependency property for showing context menu on list view item it works fine but when context menu is shown it squeezes the the whole view a bit. I do not want to squeeze the page when context menu is opened.
public class OpenMenuFlyoutAction:DependencyObject,IAction
{
public object Execute(object sender, object parameter)
{
if (!Global.IsDisabledShowContextMenuOnListView)
{
FrameworkElement senderElement = sender as FrameworkElement;
FlyoutBase flyoutBase = FlyoutBase.GetAttachedFlyout(senderElement);
flyoutBase.ShowAt(senderElement);
}
return null;
}
}
List Item data template
<DataTemplate x:Key="MemberListItemDataTemplate">
<Grid Width="{Binding ElementName=searchView,Path=ActualWidth}" Background="{Binding ItemBackground}"
Margin="0,0,0,20" Height="auto">
<i:Interaction.Behaviors>
<icore:EventTriggerBehavior EventName="Holding">
<helpers:OpenMenuFlyoutAction />
</icore:EventTriggerBehavior>
</i:Interaction.Behaviors>
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="share" RequestedTheme="Dark" Command="{Binding ElementName=pageMyProfile, Path=DataContext.ShareMemberDetails}" CommandParameter="{Binding item99}" />
<MenuFlyoutItem Text="reomve from members" RequestedTheme="Dark" Command="{Binding ElementName=pageMyProfile, Path=DataContext.RemoveMember}" CommandParameter="{Binding item99}" />
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
...
</DataTemplate>
Yeah, you need to create a new Style targeting MenuFlyoutPresenter in your resources
<Style TargetType="MenuFlyoutPresenter">
If you copy it from Program Files (x86)\Windows Phone Kits\8.1\Include\abi\Xaml\Design\generic.xaml you'll notice there are already some storyboards inside for various visual states that you need to change in order to get a different animation.
I wrote about something very similar in my blog post MenuFlyout flip animation on Windows Phone WinRT

Horizontal context menu with icons Windows phone 8

I am trying to add a context menu which shows menu items horizontally. My sample code:
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu>
<StackPanel Orientation="Horizontal">
<toolkit:MenuItem Tap="CallMenuItem_tapped">
<toolkit:MenuItem.Header>
<Image Height="50"
Stretch="Uniform"
Source="Assets/icon1.png" />
</toolkit:MenuItem.Header>
</toolkit:MenuItem>
<toolkit:MenuItem Tap="ChatMenuItem_tapped">
<toolkit:MenuItem.Header>
<Image Height="50"
Stretch="Uniform"
Source="Assets/icon2.png" />
</toolkit:MenuItem.Header>
</toolkit:MenuItem>
<toolkit:MenuItem Tap="OtherMenuItem_tapped">
<toolkit:MenuItem.Header>
<Image Height="50"
Stretch="Uniform"
Source="Assets/icon3.png" />
</toolkit:MenuItem.Header>
</toolkit:MenuItem>
</StackPanel>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
I am facing some problems. First of all when I tap a menu item the specific event is called but the menu remains open. As I am showing all the menu items in one line(horizontally), I am unable to fix the height and width of context menu. Is there a better way to add a horizontal context menu using icons?
I would suggest you to use the ItemsPanel property to set the layout as horizontal stack panel. And if you still face any issues then you can manually close the context menu using the IsOpen property. Hope this helps you.

How to add condition in Interaction.Triggers in xaml?

Can anyone help how to add a condition before executing the Interaction.Triggers in xaml.
Am having a button in that trigger event i will do a trainsition and before begin that transition i want check for the textbox is empty or not and then i want to execute.
<button>
<i:Interaction.Triggers>
<i:EventTrigger EventName="Click">
<TransitionBehaviours:ShowHideWithFlip ShowElementName="AlternateFaceGrid" HideElementName="FrontFaceGrid" Direction="BottomToTopCrazy" />
</i:EventTrigger>
</i:Interaction.Triggers>
</button>

XAML Context Menu not closing

I've got a "popup" context menu on a list box, and there are two behaviors that would seem "out-of-the-box" but I am having a tough time getting the XAML ContextMenu to behave the way I would expect...
One is that, when I pick a sub-menu (e.g. "One" or "Two"), the initial menu continues to stay open (e.g. "Menu" does not go away once I've made a selection).
Second is that the menu margins seem odd. Left justifying Horizontally does not seem to make the main menu (e.g. "Menu") left justify... I can work around this by tweaking the margin - but thats painful for dynamic text..
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<StackPanel>
<ListView>
<ListView.ContextMenu>
<!-- StaysOpen="False" -->
<ContextMenu>
<!-- Background="Transparent" Margin="-8,0,-8,0" -->
<Menu>
<!-- StaysOpenOnClick="False" -->
<MenuItem Header="Menu">
<MenuItem Header="One" />
<MenuItem Header="Two" />
</MenuItem>
</Menu>
</ContextMenu>
</ListView.ContextMenu>
<ListViewItem Content="Red" />
<ListViewItem Content="Orange" />
<ListViewItem Content="Black" />
<ListViewItem Content="Blue" />
<ListViewItem Content="Green" />
</ListView>
</StackPanel>
</Page>
Any thoughts on how to make the Main menu of this popup behave?
Thanks in advance,
T
Try this:
<ContextMenu>
<MenuItem Header="Menu">
<MenuItem Header="One" />
<MenuItem Header="Two" />
</MenuItem>
</ContextMenu>
you are not supposed to have a menu inside a context menu.
you should put menuitem directly.