Monday, January 3, 2011

How to link a command item to its documentation in Windows Forms Applications

The following examples demonstrate how to link a command item to its documentation with LinsUI Layout Manager 2.1.
Examples 1:
First define a unique ID for m_nColorsDropDownID, and a detail description for the command item in LinsResource class as following,
using LinsUI;
public static class LinsResource
{
 // The Category name
[CommandGroupNameAttribute("Colors"),              
 // Tell the application, it is a dropdown button
 CommandTypeAttribute(TSITEM_TYPEID.DROPDOWNBUTTON),  
 // Tooltip for the menu item  
 ToolTipAttribute("Select a color"),   
 // The detail description           
 DetailDescriptionAttribute("Select a color for the selected shapes.")]    
public const long m_nColorsDropDownID = FlexConstants.m_nUserDefinedControlStartID + 5;
}

Then assign the unique ID to the tag of the command item as following,

public partial class ColorsMenu : LinsUI.LinsMenuStrip
{  
private ToolStripMenuItem m_Colors;
public ColorsMenu()
{
InitializeComponent();
m_Colors = new ToolStripMenuItem();
// Assign an unique ID to the m_Colors menu dropdown item
m_Colors.Tag = LinsResource.m_nColorsDropDownID;
}
}

Examples 2:
First define a unique ID for m_nColorsDropDownID, and a rich text format(RTF) documentation file for the command item in LinsResource class as following. The RTF file must be stored under the directory defined by FlexUISettings. DefaultHelpFilePath.

using LinsUI;
public static class LinsResource
{
 // The Category name
[CommandGroupNameAttribute("Colors"),              
 // Tell the application, it is a dropdown button
 CommandTypeAttribute(TSITEM_TYPEID.DROPDOWNBUTTON),  
 // Tooltip for the menu item  
 ToolTipAttribute("Select a color"),   
 // Link the help button to a rich text format file           
 CommandHelpFileAttribute("ColorHelp.rtf")]    
public const long m_nColorsDropDownID = FlexConstants.m_nUserDefinedControlStartID + 5;
}

Then assign the unique ID to the tag of the command item as following,

public partial class ColorsMenu : LinsUI.LinsMenuStrip
{  
private ToolStripMenuItem m_Colors;
public ColorsMenu()
{
InitializeComponent();
m_Colors = new ToolStripMenuItem();
// Assign an unique ID to the m_Colors menu dropdown item
m_Colors.Tag = LinsResource.m_nColorsDropDownID;
}
}

Examples 3:
First define a unique ID for m_nColorsDropDownID in LinsResource class as following,

using LinsUI;
public static class LinsResource
{
 // The Category name
[CommandGroupNameAttribute("Colors"),              
 // Tell the application, it is a dropdown button
 CommandTypeAttribute(TSITEM_TYPEID.DROPDOWNBUTTON),  
 // Tooltip for the menu item  
 ToolTipAttribute("Select a color")]    
public const long m_nColorsDropDownID = FlexConstants.m_nUserDefinedControlStartID + 5;
}

Then assign the unique ID to the tag of the command item, and define the handler function for the HELPBUTTON_CLICK event as following,

public partial class ColorsMenu : LinsUI.LinsMenuStrip
{  
private ToolStripMenuItem m_Colors;
public ColorsMenu()
{
InitializeComponent();
m_Colors = new ToolStripMenuItem();
// Assign an unique ID to the m_Colors menu dropdown item
m_Colors.Tag = LinsResource.m_nColorsDropDownID;
}

// define the handler function for the HELPBUTTON_CLICK event 
// once user clicks at the help button on Tooltip, this event will be fired
// user can use this to link to the command’s help documentation
[CommandIDAttribute(LinsResource.m_nColorsDropDownID),
 CommandEventAttribute(CUSTOM_TI_EVENT.HELPBUTTON_CLICK)]
public void OnColorDropDownHelpButtonClick(object sender, HelpButtonEventArgs ev)
{
}

Initialize a toolstripitem in Windows Forms Applications

The user can initialize a toolstripitem very easily with LinsUI Layout Manager 2.1.
The following example demonstrates how to specify and code the handler for the INITIALIZE event of a Dropdown control
First define a unique ID for m_nColorsDropDownID in LinsResource class as following,
using LinsUI;
public static class LinsResource
{
 // The Category name
[CommandGroupNameAttribute("Colors"),              
 // Tell the application, it is a dropdown button
 CommandTypeAttribute(TSITEM_TYPEID.DROPDOWNBUTTON),  
 // Tooltip for the menu item  
 ToolTipAttribute("Select a color"),   
 // The detail description           
 DetailDescriptionAttribute("Select a color for the selected shapes.")]    
public const long m_nColorsDropDownID = FlexConstants.m_nUserDefinedControlStartID + 5;
}

Then assign the unique ID to the tag of the menu item, and define the handler function for the INITIALIZE event as following,

public partial class ColorsMenu : LinsUI.LinsMenuStrip
{
private ToolStripMenuItem m_Colors;
public ColorsMenu()
{
InitializeComponent();
m_Colors = new ToolStripMenuItem();
// Assign an unique ID to the m_Colors menu dropdown item
m_Colors.Tag = LinsResource.m_nColorsDropDownID;
 }

// define the handler function for the INITIALIZE event
// when the Color dropdown is created, this event will be fired and only fired once.
// The user can use this event to do initialization
[CommandIDAttribute(LinsResource.m_nColorsDropDownID),
// The event type, here is an initialize event    
 CommandEventAttribute(CUSTOM_TI_EVENT.INITIALIZE)]
void ColorsInitialize(object sender, System.EventArgs e)
{
// Add all possible colors into the Color dropdown list
foreach (Color_Name pair in DemoManager.m_lsColorName)
{
this.m_Colors.DropDownItems.Add(pair.m_csName);
}
}

Update the command UI state in Windows Forms Applications

The user can update the command UI state very easily with LinsUI Layout Manager 2.1.
The following example demonstrates how to specify and code the handler for the UPDATE_COMMAND_UI event of a Dropdown control
First define a unique ID for m_nColorsDropDownID in LinsResource class as following,
using LinsUI;
public static class LinsResource
{
 // The Category name
[CommandGroupNameAttribute("Colors"),              
 // Tell the application, it is a dropdown button
 CommandTypeAttribute(TSITEM_TYPEID.DROPDOWNBUTTON),  
 // Tooltip for the menu item  
 ToolTipAttribute("Select a color"),   
 // The detail description           
 DetailDescriptionAttribute("Select a color for the selected shapes.")]    
public const long m_nColorsDropDownID = FlexConstants.m_nUserDefinedControlStartID + 5;
}

Then assign the unique ID to the tag of the menu item, and define the handler function for the UPDATE_COMMAND_UI event as following,

public partial class ColorsMenu : LinsUI.LinsMenuStrip
private ToolStripMenuItem m_Colors;
public ColorsMenu()
{
InitializeComponent();
m_Colors = new ToolStripMenuItem();
// Assign an unique ID to the m_Colors menu dropdown item
m_Colors.Tag = LinsResource.m_nColorsDropDownID;
}

// define the handler function for the UPDATE_COMMAND_UI event 
// when system is on idle, this event will be fired, and
// user can use this to update the user interface for the Color dropdown
[CommandIDAttribute(LinsResource.m_nColorsDropDownID),
 CommandEventAttribute(CUSTOM_TI_EVENT.UPDATE_COMMAND_UI)]
public void OnUpdateUIColorDropDown(object sender, UpdateUIEventArgs ev)
{
ev.Enabled = true;
}

Sunday, January 2, 2011

VirualPanelSheet class of LinsUI Layout Manager 2.1

It represents a container that contains multiple panels/sheets that have the same docking style.
Remarks
The VirualPanelSheet is useful for minimizing screen space usage while allowing an application to expose a large amount of data. A VirualPanelSheet consists of at least two FlexPanel / FlexPanelTabSheet objects that have the same docking style. The contents of all the FlexPanel / FlexPanelTabSheet objects in a VirualPanelSheet are always visible at the same time.
User can drag page out of the virtual sheet by dragging the page. You can also drag a FlexPanel / FlexPanelTabSheet into a virtual sheet to make it one page of the sheet.

Examples
The following example shows how to create a VirualPanelSheet object.

public class MyPanel1: FlexPanel
{
    // ***** //
}

public class MyPanel2: FlexPanel
{
    // ***** //
}

public class MDIForm : FlexMDIForm
{
    // ***** //
}

public MDIForm ()
{
SuspendLayout();
InitializeComponent();

// Create a panel.
MyPanel1 myPanel1 = new MyPanel1();
// Assign a unique ID which is between FlexConstants.m_nUserDefinedControlStartID and
// FlexConstants.m_nUserDefinedControlEndID
myPanel1.ID = FlexConstants.m_nUserDefinedControlStartID + 1;
// Show the panel.
myPanel1.ShowPanel();

// Create another panel.
MyPanel2 myPanel2 = new MyPanel2();
// Assign a unique ID which is between FlexConstants.m_nUserDefinedControlStartID and
// FlexConstants.m_nUserDefinedControlEndID
myPanel2.ID = FlexConstants.m_nUserDefinedControlStartID + 2;
// Show the panel.
myPanel2.ShowPanel();

// Create a panel virtual sheet
VirtualPanelSheet sheet = new VirtualPanelSheet();
//Assign the dock style to RIGHT
sheet.FlexDock = FLEX_DOCKING_ALIGN.BOTTOM;
sheet.Size = new Size(400, 400);
// Assign a unique ID which is between FlexConstants.m_nUserDefinedControlStartID and
// FlexConstants.m_nUserDefinedControlEndID
sheet.ID = FlexConstants.m_nUserDefinedControlStartID + 3;
// Add panel 1 as one of its pages
sheet.AddPage( myPanel1, false );
// Insert panel 2 as the first page
sheet.InsertPage( 0, myPanel2, false );
//Show the sheet
sheet.ShowPanel();

ResumeLayout(false);
PerformLayout();
}

§      Members
1)  public long ID { get; set; }               
Remarks
Every VirualPanelSheet object should have a unique ID. If its value is between FlexConstants.m_nUserDefinedControlStartID and FlexConstants.m_nUserDefinedControlStartID, then its layout will be persistent; otherwise, its layout will not be saved.

2)  public virtual FLEX_DOCKING_ALIGN FlexDock { get; set; }
Remarks
Gets or sets which control borders are docked to its parent control and determines how a control is resized with its parent. It can be one of the following values,
§         NONE:             
The control is not docked.
§         TOP:                
The control's top edge is docked to the top of its containing control.
§         BOTTOM:         
The control's bottom edge is docked to the bottom of its containing control.
§         LEFT:              
The control's left edge is docked to the left edge of its containing control.
§         RIGHT:             
The control's right edge is docked to the right edge of its containing control.

§      Methods
1)  public void ShowPanel()              
Remarks
This make the VirualPanelSheet object visible.

2)  public virtual void HidePanel()
Remarks
This make the VirualPanelSheet object invisible.

3)  public void AddPage(
FlexPanel panel,
bool bUsingFirstChildInfo)
Parameters
panel
Type: FlexPanel
The FlexPanel is going to be added into the sheet.

bUsingFirstChildInfo
Type: bool
If the panel is the first page of the sheet, and bUsingFirstChildInfo is true, the sheet will use the panel.’s parameters, such as size, location, and docking style, to create it. If the sheet already has other pages, then this parameter will be ignored.

Remarks
Add a FlexPanel object into the sheet, and append the page at the bottom.

4)  public void InsertPage(
int nIndex,
FlexPanel panel,
bool bUsingFirstChildInfo)
Parameters
nIndex
Type: int
The page index of the FlexPanel is going to be inserted into the sheet.

panel
Type: FlexPanel
The FlexPanel is going to be added into the sheet.

bUsingFirstChildInfo
Type: bool
If the panel is the first page of the sheet, and bUsingFirstChildInfo is true, the sheet will use the panel.’s parameters, such as size, location, and docking style, to create it. If the sheet already has other pages, then this parameter will be ignored.

Remarks
Insert a FlexPanel object into the sheet at a specific position.


Download Free Trial,

TSITEM_TYPEID enumeration of LinsUI Layout Manager 2.1

Specifies what kind of toolstripitem the command is associated to.
§         BUTTON
§         COMBOBOX
§         DROPDOWNBUTTON
§         LABEL
§         MENUITEM
§         PROGRESSBAR
§         SEPARATOR
§         SPLITBUTTON
§         STATUSLABEL
§         TEXTBOX

ToolTipAttribute class of LinsUI Layout Manager 2.1

Specifies the tooltip for the command.
Examples
using LinsUI;

public static class LinsResource
{
[CommandGroupNameAttribute("Shapes and Pictures"), // The Category name
 // Command name
 CommandNameAttribute("Color"),
 // Tell the application, it is a combobox 
 CommandTypeAttribute(TSITEM_TYPEID.COMBOBOX),  
 // Tooltip for the combobox  
 ToolTipAttribute("Select a color for a shape")]
public const long m_nColorID =  FlexConstants.m_nUserDefinedControlStartID + 1;

LinsResource class of LinsUI Layout Manager 2.1

If users want to assign unique identifiers for commands, then they should define this class. Also users can define all attributes for commands inside this class.
Examples
using LinsUI;

public static class LinsResource
{
[CommandGroupNameAttribute("Shapes and Pictures"), // The Category name
 // Command name
 CommandNameAttribute("Color"),
 // The Button Icon
 CommandImageAttribute("ColorFill.ico"),
 // Button display style                                      
 CommandAppearanceAttribute(ToolStripItemDisplayStyle.ImageAndText),
 // The Text and Icon relation
 CommandImageAndTextRelationAttribute(TextImageRelation.TextBeforeImage),
 // Tell the application, it is a combobox 
 CommandTypeAttribute(TSITEM_TYPEID.COMBOBOX),  
 // Tooltip for the combobox  
 ToolTipAttribute("Select a color"),   
 // The rich text file format help file, it will be open when user click at the 
 // Help button on the tooltip         
 CommandHelpFileAttribute("ColorHelp.rtf")]              
public const long m_nColorID =  FlexConstants.m_nUserDefinedControlStartID + 1;


[CommandGroupNameAttribute("Main"),                 // The Category name
 // Tell the application, it is a menu item
 CommandTypeAttribute(TSITEM_TYPEID.MENUITEM),  
 // Tooltip for the menu item  
 ToolTipAttribute("Save layout"),
 // The detail description                  
 DetailDescriptionAttribute("Save Layout.")]       
public const long m_nSaveLayoutID = FlexConstants.m_nUserDefinedControlStartID + 2;

[CommandGroupNameAttribute("Main"),                 // The Category name
 // The Menu item Icon
 CommandImageAttribute("import2.ico"),  
 // Menu item display style          
 CommandAppearanceAttribute(ToolStripItemDisplayStyle.ImageAndText),  
 // The Text and Icon relation
 CommandImageAndTextRelationAttribute(TextImageRelation.TextBeforeImage),
 // Tell the application, it is a menu item 
 CommandTypeAttribute(TSITEM_TYPEID.MENUITEM),     
 // Tooltip for the menu item
 ToolTipAttribute("Import layout"),      
 // The detail description        
 DetailDescriptionAttribute("Import Layout.")]     
public const long m_nImportLayoutID = FlexConstants.m_nUserDefinedControlStartID + 3;


[CommandGroupNameAttribute("Shapes"),               // The Category name
 // Tell the application, it is a menu item
 CommandTypeAttribute(TSITEM_TYPEID.MENUITEM),   
 // Tooltip for the menu item 
 ToolTipAttribute("Selecte a shape"),          
 // The detail description   
 DetailDescriptionAttribute("Select a shape.")]    
public const long m_nShapesDropDownID = FlexConstants.m_nUserDefinedControlStartID + 4;

[CommandGroupNameAttribute("Colors"),               // The Category name
 // Tell the application, it is a dropdown button
 CommandTypeAttribute(TSITEM_TYPEID.DROPDOWNBUTTON),  
 // Tooltip for the menu item  
 ToolTipAttribute("Select a color"),   
 // The detail description           
 DetailDescriptionAttribute("Select a color.")]    
public const long m_nColorsDropDownID = FlexConstants.m_nUserDefinedControlStartID + 5;