ActiveReports 10
Customize the Toolbar
ActiveReports 10 > ActiveReports User Guide > Viewing Reports > ASP.NET > Flash Viewer > Customize the Toolbar

When you use the WebViewer that is licensed with the Professional Edition, one of the ViewerTypes that you can select is FlashViewer. The FlashViewer toolbar is very similar to the Viewer control's toolbar. You can show or hide it, reorder buttons, remove buttons, add custom buttons, or create a custom toolbar. Use the Web.Controls namespace to create custom buttons or a custom toolbar that you can specify in the WebViewer's FlashViewerToolbar property.

The following buttons are provided by default.

Heading Print Page Range
Search Zoom-out Zoom
Zoom-in Single Page Multiple pages
Continuous Page Previous Page Next Page
Page Number Backwards Forward

Drop down the sections below for code samples.

Note: This code is ignored if the ViewerType property of the WebViewer control is not set to FlashViewer.

To hide the toolbar

  1. In the Visual Studio Solution Explorer, right-click the ASPX file that contains your WebViewer and select View Designer.
  2. In the design view of your web form, double-click on the form below the WebViewer. This creates an event handling method for the Page Load event and takes you to the code view of the page.
  3. Use the following code to hide the toolbar.
    Visual Basic. NET. Paste INSIDE the Page Load event
    Copy Code
    WebViewer1.FlashViewerToolBar.Visible = False
    
    C#. Paste INSIDE the Page Load event
    Copy Code
    WebViewer1.FlashViewerToolBar.Visible = false;
    

To add a using or Imports directive

To reduce the amount of code needed for the rest of the customizations, add a using or Imports directive at the top of the ASPX code view.

Visual Basic. NET. Paste at the top of the ASPX code view
Copy Code
Imports GrapeCity.ActiveReports.Web.Controls
C#. Paste near the top of the ASPX code view
Copy Code
using GrapeCity.ActiveReports.Web.Controls;

To reorder buttons in the toolbar

  1. In the Visual Studio Solution Explorer, right-click the ASPX file that contains your WebViewer and select View Designer.
  2. In the design view of your web form, double-click on the form below the WebViewer. This creates an event handling method for the Page Load event and takes you to the code view of the page.
  3. Use the following code to create a new button and add it at the beginning of the toolbar.
    Visual Basic. NET. Paste INSIDE the Page Load event
    Copy Code
    'Get a default tool from the toolbar. (You can also specify the tool index.)
    Dim tool As ToolBase = WebViewer1.FlashViewerToolBar.Tools("PageRangeButton")
    'Remove the tool from the toolbar. 
    WebViewer1.FlashViewerToolBar.Tools.Remove(tool)
    'Insert the tool in a different position. 
    WebViewer1.FlashViewerToolBar.Tools.Insert(0, tool)
    
    C#. Paste INSIDE the Page Load event
    Copy Code
    //Get a default tool from the toolbar. (You can also specify the tool index.)
    ToolBase tool =  WebViewer1.FlashViewerToolBar.Tools["PageRangeButton"];
    //Remove the tool from the toolbar.
    WebViewer1.FlashViewerToolBar.Tools.Remove(tool);
    //Insert the tool in a different position. 
    WebViewer1.FlashViewerToolBar.Tools.Insert(0, tool);
    

To remove a button from the toolbar

  1. In the Visual Studio Solution Explorer, right-click the ASPX file that contains your WebViewer and select View Designer.
  2. In the design view of your web form, double-click on the form below the WebViewer. This creates an event handling method for the Page Load event and takes you to the code view of the page.
  3. Use the following code to remove a button from the toolbar.
    Visual Basic. NET. Paste INSIDE the Page Load event
    Copy Code
    'Get a default tool from the toolbar by name. (You can also specify the tool index.)
    Dim tool As ToolBase = WebViewer1.FlashViewerToolBar.Tools("PageRangeButton")
    ' Delete the tool from the toolbar. 
    WebViewer1.FlashViewerToolBar.Tools.Remove(tool)
    
    C#. Paste INSIDE the Page Load event
    Copy Code
    //Get a default tool from the toolbar by name. (You can also specify the tool index.)
    ToolBase tool =  WebViewer1.FlashViewerToolBar.Tools["PageRangeButton"];
    //Delete the tool from the toolbar.
    WebViewer1.FlashViewerToolBar.Tools.Remove(tool);
    

To create a custom button and add it to the toolbar

Tip: The ToolsCollection class in the Web.Controls namespace has the standard System.Collections.ObjectModel.Collection methods available, so if you want to just add a button to the end of the toolbar, you can use the Add method instead.
  1. In the Visual Studio Solution Explorer, right-click the ASPX file that contains your WebViewer and select View Designer.
  2. In the design view of your web form, double-click on the form below the WebViewer. This creates an event handling method for the Page Load event and takes you to the code view of the page.
  3. Use the following code to create a button and place it at the beginning of the toolbar.
    Visual Basic. NET. Paste INSIDE the Page Load event
    Copy Code
    Dim customButton As ToolButton = Tool.CreateButton("CustomButton")
    customButton.Caption = "Contanct Us"
    customButton.ToolTip = "ActiveReports Website"
    customButton.ClickNavigateTo = "http://activereports.grapecity.com/"
    'Add a button at the specified index.
    'An index value of 20 places it second to last, between the Forward and Backward buttons.
    'Set the index value to 0 to place it in the first position at the left.
    WebViewer1.FlashViewerToolBar.Tools.Insert(20, customButton)
    
    C#. Paste INSIDE the Page Load event
    Copy Code
    ToolButton customButton = Tool.CreateButton("CustomButton");
    customButton.Caption = "Contact Us";
    customButton.ToolTip = "ActiveReports Website";
    customButton.ClickNavigateTo = "http://activereports.grapecity.com/";
    //Add a button at the specified index. 
    //An index value of 20 places it second to last, between the Forward and Backward buttons.  
    //Set the index value to 0 to place it in the first position at the left.
    WebViewer1.FlashViewerToolBar.Tools.Insert(20, customButton);
    

To create a custom toolbar and add it to the viewer

  1. In the Visual Studio Solution Explorer, right-click the ASPX file that contains your WebViewer and select View Designer..
  2. In the design view of your web form, double-click on the form below the WebViewer. This creates an event handling method for the Page Load event and takes you to the code view of the page.
  3. Use the following code to create the custom toolbar and add it to viewer.
    Visual Basic. NET. Paste INSIDE the Page Load event
    Copy Code
    'Get the collection of buttons and separators used in the toolbar.
    Dim collection As ToolsCollection = WebViewer1.FlashViewerToolBar.Tools
    'Delete all of the buttons and separators from the toolbar.
    collection.Clear()
    'Add pre-defined buttons. 
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.ZoomOutButton))
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.ZoomBox))
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.ZoomInButton))
    ' Add a separator.
    collection.Add(Tool.CreateSeparator())
    'Add a pre-defined button.
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.SearchButton))
    'Add a separator.
    collection.Add(Tool.CreateSeparator())
    'Add custom buttons. 
    collection.Add(Tool.CreateButton("btn1"))
    collection.Add(Tool.CreateButton("btn2"))
    
    C#. Paste INSIDE the Page Load event
    Copy Code
    //Get the collection of buttons and separators used in the toolbar.
    ToolsCollection collection = WebViewer1.FlashViewerToolBar.Tools;
    //Delete all of the buttons and separators from the toolbar.
    collection.Clear();
    //Add pre-defined buttons.
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.ZoomOutButton));
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.ZoomBox));
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.ZoomInButton));
    //Add a separator.
    collection.Add(Tool.CreateSeparator());
    //Add a pre-defined button.
    collection.Add(Tool.Create(ToolsCollection.ToolCommands.SearchButton));
    //Add a separator.
    collection.Add(Tool.CreateSeparator());
    //Add custom buttons.
    collection.Add(Tool.CreateButton("btn1"));
    collection.Add(Tool.CreateButton("btn2"));