Lightning introduction to the napari GUI

Before we start working with python, image processing and creating a workflow, let’s take a moment to familiarize with the napari graphical user interface (GUI).

Run the first script to start a quick tour of the GUI:

00_lightning_gui_intro.py

from pathlib import Path

import napari
import numpy as np

viewer = napari.Viewer()

labels = viewer.add_points(
    data=np.array(
        [
            [0, 20, 70],
            [1, 50, 45],
            [2, 55, 15],
            [3, 35, 15],
            [4, 10, 15],
            [5, 5, 50],
            [6, 50, 70],
            [0, 0, 100],
        ]
    ),
    size=2,
    face_color='transparent',
    border_width=0,
    text={
        'values': [
            'napari\nfundamentals',
            'dims sliders',
            'viewer buttons',
            'new layer buttons\nand layerlist',
            'layer controls',
            'menus',
            'Ctrl+Shift+p:\ncommand palette',
            '',
        ],
        'anchor': 'lower_left',
        'size': 2,
        'color': 'white',
        'scaling': True,
    },
    units='m',
)

arrows = viewer.add_vectors(
    data=np.array(
        [
            [[1, 55, 55], [0, 8, 0]],
            [[2, 60, 14], [0, 5, -8]],
            [[3, 38, 14], [0, 4, -8]],
            [[4, 13, 14], [0, 0, -8]],
            [[5, 5, 49], [0, -8, -10]],
        ]
    ),
    edge_color='white',
    edge_width=1,
    vector_style='arrow',
    units='m',
)

data_dir = next(p for p in [Path('../_resources'), Path('_resources')] if p.exists())
logo = viewer.open(
    Path(data_dir / 'logo-dark.png'),
    scale=[0.015, 0.015],
    translate=[7, 75],
    interpolation2d='spline36',
    units='m',
)

viewer.dims.axis_labels = 'slides', 'y', 'x'
viewer.dims.point = (0, 0, 0)
viewer.reset_view()

from napari.utils import nbscreenshot

viewer.dims.thickness = (10, 0, 0)
viewer.dims.point = (3, 0, 0)
nbscreenshot(viewer)

viewer.close()

Key elements of the GUI:

1. Dims sliders:

   • allows scrolling through nondisplayed dimensions (in this case the “slides” dimension)

   • you can use arrow keys or ctrl+scroll to move the slider

   • right click on the slider handle to adjust slicing thickness (lets you see across multiple slices)

2. Viewer buttons:

   • general controls that are used often

   • ipython console (2-way interactivity between code and viewer)

   • 3d/2d toggle (try it, and see how this presentation is just a 3D image!)

   • dimension order controls

   • grid mode (useful for side-by-side when multiple layers are present)

   • home button (reset view)

3. New layer buttons and layerlist:

   • create new layers based on existing layers for annotation

   • points / shapes / labels

   • select, reorder and enable layers via the layerlist

4. Layer controls:

   • show current layer controls, depending on the selected layer

   • simple common things like opacity

   • more complex things like modes and layer-specific parameters (e.g: image colormap)

   • the rest they can play with afterwards

5. Menus:

   • many options (some are empty, extensible by plugins)

   • some typically used are scale bar and axes (in View, tried them out!)

6. Command palette:

   • many actions (present in menus or not) can be accessed easily with this

Play around!¶

To better familiarize yourself with all the GUI components above, try opening some sample data (e.g: File -> Open Sample -> napari builtins -> Cells (3D+2Ch), or by searching it through the command palette via Ctrl+Shift+p). Take some time to play around!