Transparent context menu item during Thunderbird addon development - xul

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>

Related

Orienting Controls on Ribbon.xaml

I have a Visio Addin that I have been adding controls to. I have a simple problem but I'm struggling to find an answer to.
I have these four controls in a group. I just added a new one called Query Preference.
I would like to align this in such a way where Modern Shapes shows up under Query Preference in the highlighted area below.
The Xaml code for this group is as follows.
I'm fairly certain there is alignment property, but I can't find for the group tag to do what I want.
Does anyone have experience with this?
<group id="connectionGroup" label="Manage">
<button id="authenticate" label="Configure Connection" size="normal" getImage="GetImage" onAction="OnAction" getEnabled="GetEnabled" supertip="Set the server and authentication information"/>
<button id="stencil" label="Generate Stencil" size="normal" getImage="GetImage" onAction="OnAction" getEnabled="GetEnabled" supertip="Generate a new stencil using the metamodel of the current server"/>
<menu id="modernClassicShapesDropdown" getLabel="GetShapeStyleLabel" getImage="GetShapeStyleImage" getEnabled="GetEnabled" supertip="Determine how new shapes will be rendered">
<button id="modernShapes" label="Modern Shapes" getImage="GetImage" onAction="OnShapeStyleAction"/>
<button id="classicShapes" label="Classic Shapes" getImage="GetImage" onAction="OnShapeStyleAction"/>
</menu>
<menu id="queryPreference" label="Query Preference" getImage="GetImage" getEnabled="GetEnabled" supertip="Determines how much Shape data is queried.">
<button id="Low" label="Low" onAction="OnQueryPreferenceAction" supertip="Only component name and description are queried and available in shape data. Select this option for fastest drawing time."/>
<button id="Medium" label="Medium" onAction="OnQueryPreferenceAction" supertip="Only native component properties are queried. Calculated properties are not initially available in shape data."/>
<button id="High" label="High" onAction="OnQueryPreferenceAction" supertip="All component properties are queried and available in shape data, including calculated properties."/>
</menu>
</group>
Why not just move the "Modern Shapes" menu item to after "Query Preference" and then insert a blank line:
<button id="junk42" label=" " />

titanium alloy raised tab bar with raised center button - dailybooth style

I'm trying to customize my alloy TabGroup to look like the image below (with no luck). no "height" properties on Tab item in the default documentation and with my current version of titanium 3.4.0 can't add View to TabGroup.
anybody know how to create a raised center button using alloy?
that's my index.xml view
<Alloy>
<TabGroup tabsBackgroundColor="white" barColor="#f15b26" activeTabIconTint="black" tintColor="white">
<Require src="home" nr="1" />
<Require src="play" nr="2" />
<Tab icon="/menu/logo.png" height="100">
<Window title="" id="">
<Label></Label>
</Window>
</Tab>
<Require src="chat" nr="3" />
<Require src="config" nr="4" />
</TabGroup>
</Alloy>
you can use an image in the middle of the that exceed the height of the bar.
When we implemented this solution in the past, we did a completely custom tabBar. I dont think you can accomplish what you are trying to do with the base tabBar control

XUL: How do you create a nested menupopup inside a statusbarpanel (with statusbarpanel-menu-iconic)

In XUL you can use create a status bar panel icon, similar to the ones used by Firebug and Greasemonkey, with the <statusbarpanel> tag. If you set the right class, you can throw a <menupop> inside, and then have a pop-up menu when the user clicks on the icon, like so ...
<statusbarpanel class="statusbarpanel-menu-iconic"
src="chrome://YourExtension/content/icon.png">
<menupopup>
<menuitem label="whatever" oncommand="doSomething();">
<menuitem label="whatever else" oncommand="doSomethingElse();">
</menupopup>
</statusbarpanel>
Now, with other pop-up menus, you can nest a series of menus using the menu tag:
<statusbarpanel class="statusbarpanel-menu-iconic"
src="chrome://YourExtension/content/icon.png">
<menu value="Old">
<menupopup>
<menuitem label="whatever" oncommand="doSomething();">
<menuitem label="whatever else" oncommand="doSomethingElse();">
</menupopup>
</menu>
<menu value="New>
<menupopup>
<menuitem label="yet another" oncommand="doYetAnotherSomething();">
</menupopup>
</menu>
</statusbarpanel>
but the above code doesn't actually work, because <statusbarpanel> won't allow a <menu> child (well, it will allow it, but not create the desired effect).
So, what I was wondering was ... is there any way I can make a status bar panel icon-triggered menu with multiple layers of menu items?
* EDIT *
Since I can't post this in the comment to the answer (and get syntax coloring and such), here's what finally worked for me (thanks Sathish!):
<statusbarpanel class="statusbarpanel-menu-iconic"
src="chrome://YourExtension/content/icon.png" popup="stausBarPanelMenu">
</statusbarpanel>
<popup id="statusBarPanelMenu" position="start_before">
<menu value="Old">
<menupopup>
<menuitem label="whatever" oncommand="doSomething();">
<menuitem label="whatever else" oncommand="doSomethingElse();">
</menupopup>
</menu>
<menu value="New>
<menupopup>
<menuitem label="yet another" oncommand="doYetAnotherSomething();">
</menupopup>
</menu>
</popop>
Oh, and as a side note to any XUL devs who might read this: you should really eliminate the "menupopup inside a statusbarpanel" style of pop-up. The style that answered this question is just as easy to learn/use, significantly more powerful, and it relies on the same popup mechanisms that can be used with the other XUL elements. This whole "menupopup inside a statusbarpanel" this is just a confusing, un-needed, anomaly.
Try this:
create a popup element like this:
<popup ... >
<menu ... >
<menupopup ... >
<menuitem ... >
</menupopup ... >
</menu>
</popup>
assign the id of popup element to the oncontextmenu attribute or show it dynamically using onclick event of the statusbarpanel element.

Context Menus and NavigateTo in Blend / SketchFlow

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.

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.