Karol Lewandowski d8e83b57ea
UI Guidelines (#1308)
* Add UI Guidelines to  SDK docs

* Add UI Guidelines to  SDK docs

* Fixing build errors

* optimize PNGs

* add UI guidelines landing page placeholder

* IJ SDK Docs <-> UI guidelines crosslinks updated

* split_button.md: remove reference to removed setting

* use <ui-path>

* use MD instead of <note>

* use %gh-ic% links

* drop_down.md: fix <control>

* code samples: fix most obvious issues

* remove obsolete `_defaults.md`

* ijs.tree: UI cleanup

* Delete "under construction" pages

* Fix headers

* Add link-summary

* Remove invalid links

* Delete unused files

* Remove ''@2x' from image file names

* Use Markdown syntax for some images and tables

* Rename non-unique files to unique

* Remove alpha in images where content is unreadable

* align quotation marks

* Controls: cleanup/fixes, add code links, edit

* tooltip.md: fix HTML

* misc fixes

* typography.md: fix table contents

* typography.md: fix table header

* UI guidelines landing page + TOC fixes

* remove unused icons_list.md

* Normalize image paths

* validation_errors.md: Fix broken tab

* "correct"/"incorrect" labels styling

* Resize images to 50%

* button.topic: fixes

* grammar, spelling, minor edits

* remove '&nbsp;'

* fix 99px

* cleanup

* UI_kit.md: minor

* Fix "MRK058: Large image in paragraph rendered as a block element by default."

* button.topic: Add img[alt]

* mnemonics.md: Update "Contact Us" link to the IJSDK YouTrack

* split_button.md: Use ui-path

* UI landing: add feedback snippet

* Improve code snippets formatting and naming

* Fix code samples

* Fix code samples

* Add Kotlin variants for code samples

* Add icons_list.md

* crosslinks

* Change external link to https://intellij-icons.jetbrains.design/

* icons list -> https://intellij-icons.jetbrains.design

* Hide info about reducing split button to simple action button (now it is available through the registry only)

* reformat

* icons_style.md: Images in new line

---------

Co-authored-by: marianna.kononenko <marianna.kononenko@jetbrains.com>
Co-authored-by: Yann Cébron <yann.cebron@jetbrains.com>
2024-05-16 13:51:56 +02:00

110 lines
5.3 KiB
Markdown

<!-- Copyright 2000-2024 JetBrains s.r.o. and contributors. Use of this source code is governed by the Apache 2.0 license. -->
<link-summary>Creating, showing, and getting the input provided by users in dialogs.</link-summary>
# Dialogs
<tldr>
**UI Guidelines:** [](layout.md), [](validation_errors.md)
</tldr>
## `DialogWrapper`
The [`DialogWrapper`](%gh-ic%/platform/platform-api/src/com/intellij/openapi/ui/DialogWrapper.java) is the base class which is supposed to be used for all modal dialogs (and some non-modal dialogs) shown in IntelliJ Platform.
It provides the following features:
* Button layout (platform-specific order of <control>OK</control>/<control>Cancel</control> buttons, macOS-specific <control>Help</control> button)
* Context help
* Remembering the size of the dialog
* Non-modal validation (displaying an error message text when the data entered into the dialog is not valid)
* Keyboard shortcuts:
* <shortcut>Esc</shortcut> for closing the dialog
* <shortcut>Left/Right</shortcut> for switching between buttons
* <shortcut>Y</shortcut>/<shortcut>N</shortcut> for <control>Yes</control>/<control>No</control> actions if they exist in the dialog
* Optional <control>Do not ask again</control> checkbox
> There's also a DSL-like API via [`DialogBuilder`](%gh-ic%/platform/platform-api/src/com/intellij/openapi/ui/DialogBuilder.java).
### Usage
When using the [`DialogWrapper`](%gh-ic%/platform/platform-api/src/com/intellij/openapi/ui/DialogWrapper.java) class for a dialog, follow these required steps:
* Call the base class constructor and provide either a `Project` in the frame of which the dialog will be displayed, or a parent component for the dialog.
* Call the `setTitle()` method to set the title for the dialog
* Call the `init()` method from the constructor of the dialog class
* Implement the `createCenterPanel()` method to return the component comprising the main contents of the dialog.
Optionally:
* Override the `getPreferredFocusedComponent()` method and return the component that should be focused when the dialog is first displayed.
* Override the `getDimensionServiceKey()` method to return the identifier which will be used for persisting the dialog dimensions.
* Override the `getHelpId()` method to return the context help topic associated with the dialog (see [Context Help](ide_infrastructure.md#context-help)).
The `DialogWrapper` class is often used together with [GUI Designer forms](https://www.jetbrains.com/help/idea/gui-designer-basics.html).
In this case, bind a GUI Designer form to the class extending `DialogWrapper`, bind the top-level panel of the form to a field and return that field from the `createCenterPanel()` method.
When using Kotlin, use [Kotlin UI DSL](kotlin_ui_dsl_version_2.md) to provide the dialog's contents.
> See [](layout.md) topic in UI Guidelines for recommendations on arranging UI controls in dialogs.
>
> Existing dialogs can be inspected at runtime using [UI Inspector](internal_ui_inspector.md), e.g., to locate the underlying implementation of UI components.
>
To display the dialog, call the `show()` method and then use the `getExitCode()` method to check how the dialog was closed (see `DialogWrapper#OK_EXIT_CODE|CANCEL_EXIT_CODE|CLOSE_EXIT_CODE`).
The `showAndGet()` method can be used to combine these two calls.
To customize the buttons displayed in the dialog (replacing the standard <control>OK</control>/<control>Cancel</control>/<control>Help</control> set of buttons), override either the `createActions()` or `createLeftActions()` methods.
Both of these methods return an array of Swing Action objects.
If a button closes the dialog, use [`DialogWrapperExitAction`](%gh-ic%/platform/platform-api/src/com/intellij/openapi/ui/DialogWrapper.java) as the base class for the action.
Use `action.putValue(DialogWrapper.DEFAULT_ACTION, true)` to set the default button.
### Input Validation
Please see also [](validation_errors.md) topic in UI Guidelines.
To validate the data entered into the dialog, override the `doValidate()` method.
The method will be called automatically by timer.
If the currently entered data is valid, return `null`.
Otherwise, return a [`ValidationInfo`](%gh-ic%/platform/ide-core/src/com/intellij/openapi/ui/ValidationInfo.java) object which encapsulates an error message, and an optional component associated with the invalid data.
When specifying a component, an error icon will be displayed next to it, and it will be focused when the user tries to invoke the <control>OK</control> action.
## Example
Simple definition of a [`DialogWrapper`](%gh-ic%/platform/platform-api/src/com/intellij/openapi/ui/DialogWrapper.java):
```java
public class SampleDialogWrapper extends DialogWrapper {
public SampleDialogWrapper() {
super(true); // use current window as parent
setTitle("Test DialogWrapper");
init();
}
@Nullable
@Override
protected JComponent createCenterPanel() {
JPanel dialogPanel = new JPanel(new BorderLayout());
JLabel label = new JLabel("Testing");
label.setPreferredSize(new Dimension(100, 100));
dialogPanel.add(label, BorderLayout.CENTER);
return dialogPanel;
}
}
```
Show `SampleDialogWrapper` dialog when user clicks on button:
```java
JButton testButton = new JButton();
testButton.addActionListener(actionEvent -> {
if (new SampleDialogWrapper().showAndGet()) {
// user pressed OK
}
});
```