AdwAboutDialog

A dialog showing information about the application.

<picture> <source srcset="about-dialog-dark.png" media="(prefers-color-scheme: dark)"> <img src="about-dialog.png" alt="about-dialog"> </picture>

an about dialog is typically opened when the user activates the About … item in the application's primary menu. All parts of the dialog are optional.

Main page

adw.about_dialog.AboutDialog prominently displays the application's icon, name, developer name and version. They can be set with the property@AboutDialog:application-icon, property@AboutDialog:application-name, property@AboutDialog:developer-name and property@AboutDialog:version respectively.

What's New

adw.about_dialog.AboutDialog provides a way for applications to display their release notes, set with the property@AboutDialog:release-notes property.

Release notes are formatted the same way as AppStream descriptions.

The supported formatting options are:

• Paragraph (<p>)
• Ordered list (<ol>), with list items (<li>)
• Unordered list (<ul>), with list items (<li>)

Within paragraphs and list items, emphasis (<em>) and inline code (<code>) text styles are supported. The emphasis is rendered in italic, while inline code is shown in a monospaced font.

Any text outside paragraphs or list items is ignored.

Nested lists are not supported.

Only one version can be shown at a time. By default, the displayed version number matches property@AboutDialog:version. Use property@AboutDialog:release-notes-version to override it.

Details

The Details page displays the application comments and links.

The comments can be set with the property@AboutDialog:comments property. Unlike gtk.about_dialog.AboutDialog.utf8, this string can be long and detailed. It can also contain links and Pango markup.

To set the application website, use property@AboutDialog:website. To add extra links below the website, use adw.about_dialog.AboutDialog.addLink.

If the Details page doesn't have any other content besides website, the website will be displayed on the main page instead.

Troubleshooting

adw.about_dialog.AboutDialog displays the following two links on the main page:

• Support Questions, set with the property@AboutDialog:support-url property,
• Report an Issue, set with the property@AboutDialog:issue-url property.

Additionally, applications can provide debugging information. It will be shown separately on the Troubleshooting page. Use the property@AboutDialog:debug-info property to specify it.

It's intended to be attached to issue reports when reporting issues against the application. As such, it cannot contain markup or links.

adw.about_dialog.AboutDialog provides a quick way to save debug information to a file. When saving, property@AboutDialog:debug-info-filename would be used as the suggested filename.

Credits and Acknowledgements

The Credits page has the following default sections:

• Developers, set with the property@AboutDialog:developers property,
• Designers, set with the property@AboutDialog:designers property,
• Artists, set with the property@AboutDialog:artists property,
• Documenters, set with the property@AboutDialog:documenters property,
• Translators, set with the property@AboutDialog:translator-credits property.

When setting translator credits, use the strings "translator-credits" or "translator_credits" and mark them as translatable.

The default sections that don't contain any names won't be displayed.

The Credits page can also contain an arbitrary number of extra sections below the default ones. Use adw.about_dialog.AboutDialog.addCreditSection to add them.

The Acknowledgements page can be used to acknowledge additional people and organizations for their non-development contributions. Use adw.about_dialog.AboutDialog.addAcknowledgementSection to add sections to it. For example, it can be used to list backers in a crowdfunded project or to give special thanks.

Each of the people or organizations can have an email address or a website specified. To add a email address, use a string like Edgar Allan Poe <edgar@poe.com>. To specify a website with a title, use a string like The GNOME Project https://www.gnome.org:

<picture> <source srcset="about-dialog-credits-dark.png" media="(prefers-color-scheme: dark)"> <img src="about-dialog-credits.png" alt="about-dialog-credits"> </picture>

Legal

The Legal page displays the copyright and licensing information for the application and other modules.

The copyright string is set with the property@AboutDialog:copyright property and should be a short string of one or two lines, for example: © 2022 Example.

Licensing information can be quickly set from a list of known licenses with the property@AboutDialog:license-type property. If the application's license is not in the list, property@AboutDialog:license can be used instead.

To add information about other modules, such as application dependencies or data, use adw.about_dialog.AboutDialog.addLegalSection.

Constructing

To make constructing an adw.about_dialog.AboutDialog as convenient as possible, you can use the function func@show_about_dialog which constructs and shows a dialog.

static void
show_about (GtkApplication *app)
{
  const char *developers[] = {
    "Angela Avery",
    NULL
  };

  const char *designers[] = {
    "GNOME Design Team",
    NULL
  };

  adw_show_about_dialog (GTK_WIDGET (gtk_application_get_active_window (app)),
                         "application-name", _("Example"),
                         "application-icon", "org.example.App",
                         "version", "1.2.3",
                         "copyright", "© 2022 Angela Avery",
                         "issue-url", "https://gitlab.gnome.org/example/example/-/issues/new",
                         "license-type", GTK_LICENSE_GPL_3_0,
                         "developers", developers,
                         "designers", designers,
                         "translator-credits", _("translator-credits"),
                         NULL);
}

CSS nodes

adw.about_dialog.AboutDialog has a main CSS node with the name dialog and the style class .about.