User interface

ZSolution displays Get Started screen when no project/solution is opened. When you run ZStudio for the first time, the recent list will be empty. Each time you start it with a logged-in state after that, ZStudio opens up in the same state it was in when you last closed it. The project, layout, and opened files are preserved.

Basic layout

ZStudio is composed of lightweight modular widgets that provide a solid foundation for flexible layout. The default user interface of ZStudio looks as follows:

Menu Bar: Located at the top, it provides users with function entrances, and clicks to display the menu options.

Toolbar: Located below the menu bar. The toolbar contains default commands and can be dynamically adapted by users based on their personal preference. For more details see the Dynamic toolbar section.

Activity Bar : It located on the far two side. Activity Bar lets you switch between views and gives you additional context-specific indicators, like the number of outgoing changes when Git is enabled.

Side Panel : Located besides the activity bar, It shows different views like the Solution Explorer and contains interactive buttons to assist you while working on your project. Most of the views are displayed on the left-hand side panel by default.

Editor: The main area to edit your files. You can open as many editors as you like side by side vertically and horizontally. The editor has a navigation bar called Breadcrumbs. It shows the current location and lets you to quickly navigate between folders nd files.

Bottom Panel: An additional space for views below the editor region. By default, it houses output, debug information, errors and warnings, and an integrated terminal.

Status Bar: Located at the bottom, this shows information about the opened project and the files you edit.

Change layout

A widget is a part displaying content within the ZStudio workbench, such as a view or editor. All widgets in ZStudio can be docked to user-specified layouts by dragging.

The widgets show in Editor and Bottom Panel is under control by Title Tabs. You can drag and drop editor or panel on the workbench, move individual Tabs or close it by clicking the × button.

The views show in Side Bar is under control by the view icon. On activity bar, select Performances > File Icon Theme to show icon of all files in ZStudio. you can change views position by dragging and dropping its icon or remove it (right-click the icon and select Close). you can also rearrange the order of views within a widget for operational convenience, or tile views side by-side to enable comparisons.

To reopen desired views, select it from the view's popup menu. To reset the default layout, search and select View: Reset Workbench Layout in drop-down menu in command palette.

Dynamic toolbar

ZStudio provides a dynamic toolbar allowing easy access to commonly used commands. The toolbar contains default commands and can be dynamically adapted by users based on their personal preference.

You can control the default visibility of the toolbar pressing Alt+T or via select View > Toggle Toolbar from menu bar.

The toolbar show some default commands: Undo, Redo, Split Editor and Open Command Palette and you can add or remove command. To add a new command to the toolbar:

1. Right click toolbar and select Add Command to Toolbar.

2. This will open a wizard that first allows you to select the command you want to add.

3. In the next step, you can specify the icon that is used to display the new command in the toolbar.

4. Finally you select the column the new command will be placed in.

Further, you can change their position in the toolbar. To change the position of an existing command, simply drag it around. The toolbar supports three columns to visually structure command (Left, Center and Right).

To remove an existing command, right click the icon in the toolbar and select Remove Command From Toolbar.

To restore the default commands on the toolbar, right click and select Restore Toolbar Defaults. Please note that this will delete all custom commands you might have added.

Command palette

The shortcut Ctrl+Shift+P can brings up the Command Palette. From here, you have access to the functionality of ZStudio, including look up to keyboard shortcuts and open files.

• Type ? to view commands suggestions.

• Type command and space to get drop-down menu. For example, type view and press space to get view's drop-down menu for quickly open specific views.

• You can execute editor commands, open files, search for symbols, and see a quick outline of a file, all using the same interactive window. Here are a few shortcut tips:

  • Press Control+P will let you navigate to and open any file by typing its name

  • Press Control+Shift+O to navigate to a specific symbol in a file

  • Press Control+G will let you navigate to a specific line in a file

Compare files

ZStudio supports viewing of diffs, which allows two files to be compared in the same editor. You can diff any two files in Project Navigator or File Navigator by:

1. Right click the first file and Select for Compare.
2. Right click on the second file and Compare with Selected.

you can also CTRL-select both files, right click on one, and select Compare with Each Other to achieve the same thing:

You should see the diff panel appear once you've completed these steps. There is a symbol next to the line number, "-" represents the code before modification, and "+" represents the code after modification. If user adds code in one file, there will be grid lines in the other comparison area to indicate the range of the adding.

Compare git file versions

If you would like to compare your local file changes with the latest git version of a file, click the git icon in the activity bar, then select the file that you would like to compare.