Split View

[BioPharma] [Research+]

Split View allows multiple images to be opened simultaneously in the Viewer. Each image is confined to a dedicated panel within the viewing area and retains all the usual capabilities that are available when viewing a single image (e.g., annotating, panning, and zooming). Various layout options, such as side-by-side, vertical stacks, and 2-D grids, are available to aid the comparisons, as well as a range of functionality for image synchronization and panel management.

Viewing Multiple Images

Split View can be activated from various areas in the application; in general, wherever it is possible to select multiple images. Any tables that support right-click context menus will provide options for launching the Viewer with multiple images simultaneously. For instance, the Folder Listing table in the Repository, the Search Results table, and the Viewer's Browse Folder Panel can be used to select and view multiple images.

Activating Split View from outside the Viewer will result in a 2-D grid layout with the most compact square dimensions for the number of images selected (e.g., 1x1, 2x2, 3x3, etc.). To have more control over image layout, activate Split View from the Viewer's Browse Folder Panel.

To display the context menu on a mobile device, tap and hold on an item.
To launch Split View from the Repository
  1. Navigate to any folder in the Repository (click on the Folder Repository button from the Navigation Menu then navigate to a folder)

  2. Select one or more images by holding the Ctrl key (on Windows) or / Command key (on macOS) key and clicking on them

  3. Bring up the context menu for the item (or items)

  4. Click on View Images

To launch Split View from Search
  1. Perform a search (click on the Search Search button from the Navigation Menu then execute a basic query or advanced query)

  2. Select one or more images by holding the Ctrl key (on Windows) or / Command key (on macOS) key and clicking on them

  3. Bring up the context menu for the item (or items)

  4. Click on View Images

To activate Split View from within the Viewer (by adding new images)
  1. If the left sidebar is not displayed, toggle it by clicking on the Menu > button at the bottom left of the Viewer

  2. Hover or click on the Folder button in the left sidebar

  3. Select one or more images by holding the Ctrl key (on Windows) or / Command key (on macOS) key and clicking on them

  4. Bring up the context menu for the item (or items)

  5. Hover over Add to View in the dropdown menu to expand that menu

  6. In the expanded menu, select the method for insertion into the existing layout

    • Append as Row inserts selection as a new row at the bottom of the layout
    • Append to Bottom inserts selection as new row(s) at the bottom of the layout, wrapping as required to maintain the grid width
    • Append as Column inserts selection as a new column at the right side of the layout
    • Append to Right inserts selection as new column(s) at the right side of the layout, wrapping as required to maintain the grid height
Consider the Replace View option in step 5 if the selected images should replace the existing image(s) in the Viewer.
To activate Split View from within the Viewer (by replacing existing images)
  1. If the left sidebar is not displayed, toggle it by clicking on the Menu > button at the bottom left of the Viewer

  2. Hover or click on the Folder button in the left sidebar

  3. Select one or more images by holding the Ctrl key (on Windows) or / Command key (on macOS) key and clicking on them

  4. Right-click on any of the selected images

  5. Hover over Replace View in the dropdown menu to expand that menu

  6. (Optional) Enable the Randomize toggle to add the images in a random order. Otherwise they are added in the order in which they were selected

  7. In the expanded menu, select the desired method of replacing the images

    • Grid will arrange the images in the smallest possible square grid (e.g., 1x1, 2x2, 3x3, etc.)
    • Side-by-side will create a single row of images
    • Stacked will create a single column of images

Panel Layout

When viewing multiple images, the Viewer is divided into a 2-D grid with rows and columns. By default, the grid is regular and each panel (or cell) has the same size. The grid layout can be customized to create an irregular grid, where a panel can span multiple rows and/or columns. There are convenient options for creating three types of regular grids: side-by-side, vertically stacked, and 2-D grid.

To change the number of rows or columns
  1. Click on the Layout button in the Viewer top bar to display the Layout dialog

  2. From the Rows field, increase the number to append new rows to the bottom of the layout or decrease the number to remove empty rows from the layout

  3. From the Columns field, increase the number to append new columns to the right of the layout or decrease the number to remove empty columns from the layout

  4. (Optional) You can change the Cell Aspect Ratio between Fit, 16:9, 4:3, and 1:1

  5. (Optional) You can adjust the Grid Gap slider to add more separation between the images

To add an empty row
  1. Hover or click on any image adjacent to where you want to add the row, to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the More menu

  4. From the dropdown menu, select Insert Row Above to add an empty row above the current image, or Insert Row Below to add an empty row below it

To add an empty column
  1. Hover or click on any image adjacent to where you want to add the column, to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the More menu

  4. From the dropdown menu, select Insert Column Before to add an empty column to the left of the current image, or Insert Column After to add an empty column to the right

To remove any row or column from the layout
  1. Hover or click on any image from the row/column to be deleted, to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the More menu

  4. Select Remove Row or Remove Column from the dropdown menu

To move an image panel
  1. Hover or click on the image you want to move

  2. Click on the Move handle at the top right corner of the image and drag it to the new location

To create an irregular grid (by changing the span of panels)
  1. Hover or click on the image you want to span across multiple panels

  2. Click on the Resize handle at the bottom right corner of the image and drag it to expand into panel(s) to the right and/or below the current panel

Panel Aspect Ratio

The aspect of the ratio of the panels can be customized to any of the following values: 16:9, 4:3 and 1:1.

To change the aspect ratio of panels
  1. Click on the Layout button in the Viewer top bar to display the Layout dialog

  2. Click on the dropdown menu next to Cell Aspect Ratio

  3. In the dropdown menu, select the desired aspect ratio

    • Fit will adapt the panels' size to attempt to fit all of them on the screen
    • 16:9 will enforce a 16:9 aspect ratio for the panels, even if scrolling is required to see all rows and/or columns
    • 4:3 will enforce a 4:3 aspect ratio for the panels, even if scrolling is required to see all rows and/or columns
    • 1:1 will force panels to remain square
  4. (Optional) Enable the Maximize Panels toggle to expand all panels horizontally to fill the screen, rather than fitting the largest number of panels on screen at a time. This option is only available when aspect ratio is set to a value other than Fit

Panel maximization can be used to control the width of panels. When Maximize Panels is enabled, panel widths are maximized such that the available width on the screen is fully utilized. As a result of the panel aspect ratio setting, panel maximization may reduce the number of panels that are visible on the screen at one time. When Maximize Panels is disabled, the width of panels are reduced (to a minimum size) to ensure the most number of panels are displayed on the screen at one time (without the need to scroll).

Panel Spacing

The spacing between each panel (i.e., the separation between panels) can be customized.

To change the spacing between panels
  1. Click on the Layout button in the Viewer top bar to display the Layout dialog

  2. Adjust the Grid Gap slider to add space separating the panels

Panel Controls

Split View divides the available on-screen space for the image Viewer into one or more panels, depending on the number of images that have been chosen. While each panel can be independently controlled, only one panel can be controlled at any given point in time.

The selected (controllable) image is denoted with a blue border around its panel and a blue dot adjacent to the file in the Browse Folder Panel of the Viewer. Images that appear in other panels are denoted with a gray dot in the Browse Folder panel.
To select an image for navigation
  1. Click into any panel to activate it. Note the blue border that appears around the active panel

  2. Use the standard Basic Controls to navigate the image

To view the slide label for a panel
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Hover over the Info icon in the toolbar to see the slide label for that image

To enable the rotation tool for the selected panel
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the Rotate button in the toolbar to show or hide the rotation tool

To add an image to an empty panel
  1. Click on the Add an image button in the center of an empty panel

  2. In the Select Cell Image dialog that pops up, use either the Repository browser or Search to find the desired image

  3. Click on the image to add it to the panel

Color Management

For RGB images, the color correction profile of an image in a panel can be adjusted. The capabilities that are available in the Viewer are also available in Split View panels. See Color Management for more details.

To change the color management profile for the selected panel
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the Palette button in the toolbar to reveal the color management dialog

  4. Select one of the available ICC color profiles

Panel Contents

To remove an image from a panel
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the More menu

  4. Select Remove Image from the dropdown menu. This will leave an empty panel in its place

To replace the image within a panel
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the More menu

  4. Select Change Image from the dropdown menu

  5. In the Select Cell Image dialog that pops up, use either the Repository browser or Search to find the desired image

  6. Click on the image to add it to the panel

Single Panel Mode

Activating Split View reduces the screen area available for each image in the panel. If more screen area is required, it's possible to temporarily expand one panel to return to a single image configuration or to open any of any of panels in a new tab (in single panel mode).

To reset the Viewer to single image mode
  1. If the left sidebar is not displayed, toggle it by clicking on the Menu > button at the bottom left of the Viewer

  2. Hover or click on the Folder button in the left sidebar

  3. Right-click on any image in the Browse Folder panel

  4. Click on Replace View in the dropdown menu

To open one image in a new tab (in single image mode)
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the More menu

  4. Select Open in Viewer from the dropdown menu

Any work performed in the new tab (e.g., new annotations created) will not be reflected in the original tab until a refresh (keyboard shortcut F5) is performed.
To expand a single image panel
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the Fill View button

To minimize an expanded panel (to return to Split View mode)
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Expand Toolbar button to expand the toolbar if necessary

  3. Click on the Shrink View button

To replace an image in the view with an image from the Browse Folder panel
  1. If the left sidebar is not displayed, toggle it by clicking on the Menu > button at the bottom left of the Viewer

  2. Hover or click on the Folder button in the left sidebar

  3. Click and drag the desired image onto the panel containing the image to be replaced

  4. In the Replace Image dialog that pops up, click on the Yes button

Synchronization

Images can be synchronized so that panning and magnification actions are performed simultaneously on all images in the Viewer which have been marked as "synchronized".

To synchronize specific images
  1. Hover or click on the image to reveal the toolbar at the top left of the panel

  2. Click on the Lock button

  3. Repeat steps 1 and 2 for each image to synchronize

To synchronize a row or column of images
  1. Hover or click on any image from the row/column to be synchronized, to reveal the toolbar at the top left of the panel

  2. Click on the Down Arrow button next to the Lock button

  3. Select Synchronize Row or Synchronize Column from the dropdown menu

To synchronize all images in the Viewer
  1. Click on the Lock button in the Viewer top bar to display the synchronize menu

  2. Select Synchronize All from the dropdown menu

Magnification

The magnification of the currently selected image can be applied to all synchronized images or to all images in the Viewer.

If you zoom an image that is part of a synchronized set, the change in magnification is also applied to other images in the set. When an image is pushed past its native resolution, the Viewer applies a digital zoom.

When the digital zoom is applied as a result of zooming another image in the synchronized set, there is no restriction enforced. In this manner it is possible to attain a digital zoom greater than the 400% limit for a single image.
To apply the current magnification to all images in the Viewer
  1. Click on the current image magnification in the Viewer top bar

  2. Select Apply to All Slides from the dropdown menu

To apply the current magnification to synchronized images
  1. Click on the current image magnification in the Viewer top bar

  2. Select Apply to Synchronized Slides from the dropdown menu

Drag and Drop

For convenience, images in the Browse Folder Panel can be dragged on to the Viewer, to either replace the images on display or to add new images to the Viewer.

To replace a single image in Viewer using drag and drop
  1. If the left sidebar is not displayed, toggle it by clicking on the Menu > button at the bottom left of the Viewer

  2. Hover or click on the Folder button in the left sidebar

  3. Click and drag a single image onto the panel containing the image to be replaced

  4. In the Replace Image dialog that pops up, click on the Yes button

To add multiple images to the Viewer using drag and drop
  1. If the left sidebar is not displayed, toggle it by clicking on the Menu > button at the bottom left of the Viewer

  2. Hover or click on the Folder button in the left sidebar

  3. Select one or more images by holding the Ctrl key (on Windows) or / Command key (on macOS) key and clicking on them

  4. Click and drag the images onto the panel containing the image to be replaced

  5. In the Placement dialog that pops up, select Add to View

  6. Select the method for insertion from the Append dropdown menu

    • as Row inserts selection as a new row at the bottom of the layout
    • as Column inserts selection as a new column at the right side of the layout
    • to Bottom inserts selection as new row(s) at the bottom of the layout, wrapping as required to maintain the grid width
    • to Right inserts selection as new column(s) at the right side of the layout, wrapping as required to maintain the grid height
  7. (Optional) Enable the Randomize toggle to add the images in a random order. Otherwise they are added in the order in which they were selected

  8. Click on the Add Images button

To replace the Viewer content with multiple images using drag and drop
  1. If the left sidebar is not displayed, toggle it by clicking on the Menu > button at the bottom left of the Viewer

  2. Hover or click on the Folder button in the left sidebar

  3. Select one or more images by holding the Ctrl key (on Windows) or / Command key (on macOS) key and clicking on them

  4. Click and drag the images onto the Viewer

  5. In the Placement dialog that pops up, select Replace View

  6. Select the desired layout from the dropdown menu

    • Grid will arrange the images in the smallest possible square grid (e.g., 1x1, 2x2, 3x3, etc.)
    • Side-by-side will create a single row of images
    • Stacked will create a single column of images
  7. (Optional) Enable the Randomize toggle to add the images in a random order. Otherwise they are added in the order in which they were selected

  8. Click on the Add Images button