inheriting Theme from app

[amirharati]

Hi, I wonder if there is a way to inherent the general them like background color, navbar and app bar themes from the main app?

[hm21]

Currently, there is no direct method to inherit the general theme. To apply the general theme in the editor, you will need to manually add it to the editor's theme, as shown below.

var theme = Theme.of(context);
return ProImageEditor.asset(
  ExampleConstants.of(context)!.demoAssetPath,
  key: editorKey,
  configs: ProImageEditorConfigs(
    imageEditorTheme: ImageEditorTheme(
        background: theme.scaffoldBackgroundColor,
        appBarBackgroundColor:
            theme.appBarTheme.backgroundColor ?? const Color(0xFF000000)),
         /// more...
  ),
);

[amirharati]

thanks so I assume there is no way (without hacking the source code) from API level to set detailed themes like bottomnavbar (it is not one of the parameters) , or thememode (light/dark)?

[hm21]

If no parameter is set to modify the bottom-navbar, the editor will default to the standard theme. Additionally, you can apply a custom theme to the editor directly, as shown below:

configs: ProImageEditorConfigs(
      theme: ThemeData.dark(),
)

If you want to modify an entire widget, such as replacing the full app-bar, you can refer to this example, which demonstrates how to replace most widgets.

[amirharati]

great thanks. The example helped also theme: ThemeData.dark(), seems to not have any effect in my version at least (4.3.0).

[hm21]

ThemeData.dark() closely mirrors the default theme used by the editor, which is why you might not notice any differences. Additionally, the theme parameter only allows you to modify parameters that are not already set in imageEditorTheme. To see the effects, you can test it by setting unique parameters, like the ones shown below, that are not used by imageEditorTheme.

theme: ThemeData(
  iconTheme: const IconThemeData(
    opacity: 0.5,
  ),
),