Orienting Controls on Ribbon.xaml - 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=" " />

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>

Add Event to UI button click

I have created a custom ribbon in Microsoft Word but I am having issues attaching events to the buttons found in a ribbon. Below is my code:
UI XML:
<mso:cmd app="Word" dt="1" />
<customUI xmlns="http://schemas.microsoft.com/office/2006/01/customui">
<ribbon startFromScratch="true" >
<tabs>
<tab id="CustomTab" label="MyTasks" >
<group id="Group1" label="Details Labels">
<menu id="Menu1" label="Details" size="large">
<menu id="Menu21" label="Dates">
<button id="my_date" onAction="foo_eventhandler" label="Some Date" />
</menu>
</menu>
</group>
</tab>
</tabs>
</ribbon>
</customUI>
I then have the following VBA code in Modules/NewMacros VBA code:
Sub foo_eventhandler(control As IRibbonControl)
End Sub
NOTE:
I import the XML by opening Word-->going to File-->Options-->Customize Ribbon-->Import/Export. I then select my XML file and import it.
When this code is run, though, I get the error "Argument Not Optional". If I run the same code without the "control As IRibbonControl" it's fine but I need to be able to get the Sender object. Anyone have any suggestions?
jason
I think you are running into problems because you are importing the XML code via Options -> Customize Ribbon ->Import/Export. This method is really for general users who wish, for example, to never see the Page Layout tab and have it hidden. They can export their custom ribbon and import it onto new machines for the same layout.
For developers a better method is use the most excellent CustomUIEditor for Word and Excel. http://openxmldeveloper.org/blog/b/openxmldeveloper/archive/2009/08/07/7293.aspx
The steps you need to take are to create your normal macro enabled Word template (the .dotm) file and save it. Then open that file up in the CustomUIEditor and paste you XML (minus the first line). I've expanded your XML code with another button and I've added the tag to the XML so the VBA knows which button is being pressed.
<customUI xmlns="http://schemas.microsoft.com/office/2006/01/customui">
<ribbon startFromScratch="false" >
<tabs>
<tab id="CustomTab" label="MyTasks" >
<group id="Group1" label="Details Labels">
<menu id="Menu1" label="Details" size="large">
<menu id="Menu21" label="Dates">
<button id="my_date_1" onAction="foo_eventhandler" label="Some Date" tag="Date1" />
<button id="my_date_2" onAction="foo_eventhandler" label="Some Other Date" tag="Date2" />
</menu>
</menu>
</group>
</tab>
</tabs>
</ribbon>
</customUI>
I generally put my Ribbon code in a Ribbon module. In your callback code you just need to use the .Tag property of the inputted control variable to know which button is pressed which you'll see corresponds to the tag in the XML. ie:
Sub foo_eventhandler(control As IRibbonControl)
MsgBox "Hooray! for " & control.Tag
End Sub

Problems using a composite view in Titanium Alloy

I am trying to implement a simple app in Alloy that has a very basic structure but I cannot get it to layout reliably. I am trying to bottom align a group of navigation buttons with a working area above them which in the following example would be a TableView.
<Alloy>
<Collection src="book">
<Window height="100%" id="main" title="My Library {opts.username}" exitOnClose="true" onOpen="loadExtras">
<TableView id="content" dataCollection="book" top="10px" bottom="100px" onDragEnd="refreshTable">
<TableViewRow title="{title}" color="black" onClick="showBook"/>
</TableView>
<View bottom="0px" height="72px" layout="horizontal" id="actionPanel">
<Button class="footerBtn" onClick="refreshTable">View</Button>
<Button class="footerBtn" onClick="refreshTable">Help</Button>
<Button class="footerBtn" onClick="refreshTable">List</Button>
<Button class="footerBtn add" onClick="addBook"></Button>
</View>
</Window>
The only way I can get this to work is to specify a height for the TableView such as height="80%" and then play with this value until things layout as I would prefer but I do not want to do as I need this to work independently of the devices physical screen size.
How can I implement this kind of layout in Alloy to get a view to pin to the bottom of the screen with a variable working area above it - or, do I have to assume a standard height and work relative to that?
Try pinning the table to the bottom of the parent view and then setting the height to be 80% of the parent view height. Also, use dp values to be screen independent.
<TableView id="content" height="80%" bottom="100dp"
onDragEnd="refreshTable"
dataCollection="book">

How to make a button event in pure xaml

I have this code
<Image Name="LightOn_BMP" Source="Res/LightOn.bmp" Canvas.Left="150" Canvas.Top="10" />
<Image Name="LightOff_BMP" Source="Res/LightOFF.bmp" Canvas.Left="150" Canvas.Top="10" />
<Button Canvas.Left="215" Canvas.Top="150" Click="PowerOn">
<Image Name="SwitchDown_BMP" Source="Res/SwitchDown.bmp" />
</Button>
<Button Canvas.Left="215" Canvas.Top="150" Click="PowerOff">
<Image Name="SwtichUp_BMP" Source="Res/SwitchUp.bmp" />
</Button>
And I want in pure XAML to make the PowerOn event to change so that LightOn.bmp is visible and LightOff.bmp is hidden and hide the Switchdown.bmp picture/button
Then I should be able to figure out how to make the event for the PowerOff
Simply put, you can't. The whole idea behind WPF is that you should separate behavior from display. So, at least without making some crazy black magic, you won't be able to change the state of the Image object (visible to false).

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.