Skip to main content

Flutter

На данный момент, можно кастомизировать эти параметры:

  • Яркость (Brightness)
  • Цвета (background, foreground, accent)
  • Радиус элементов (BorderRadius)
  • Стили текста

Для кастомизации интерфейса используется класс IokaTheme. По умолчанию используются заводские темы (IokaTheme.defaultLight и IokaTheme.defaultDark). По желанию, можно кастомизировать интерфейс следующими способами:

Глобально

При вызове Ioka.setup() опционально можно передать theme и darkTheme:

final customTheme = IokaTheme.defaultLight.copyWith(...);
final customDarkTheme = IokaTheme.defaultDark.copyWith(...);

Ioka.setup(
'<PUBLIC_KEY>',
// Передаём тему глобально
theme: customTheme,
darkTheme: customDarkTheme,
);

При вызове методов, в зависимости от значения Theme.of(context).brightness или CupertinoTheme.brightnessOf(context) в переданном context будет автоматически использоваться светлая или тёмная тема.

Локально

В каждый метод в Ioka.instance можно передать тему, которая будет использоваться для этого метода. Если её не передавать, то будет использоваться тема, заданная глобально.

final customTheme = IokaTheme.defaultLight.copyWith(...);

Ioka.instance.startCheckoutFlow(
context: context,
orderAccessToken: '<ORDER_ACCESS_TOKEN>',
theme: customTheme, // Передаём тему локально
);

Также можно передать яркость:

Ioka.instance.startCheckoutFlow(
context: context,
orderAccessToken: '<ORDER_ACCESS_TOKEN>',
brightness: Brightness.dark, // Эта страница будет отображаться с тёмной темой
);

Простая настройка темы

В классе IokaTheme есть конструктор IokaTheme.simple(), которым можно легко сконфигурировать тему под своё приложение:

final lightTheme = IokaTheme.simpleLight(primaryColor: Colors.blue);
final darkTheme = IokaTheme.simpleDark(primaryColor: Colors.blue);

Автоматическая генерация темы

Внимание: функционал все ещё в разработке и считается экспериментальным.

В SDK есть возможность сгенерировать объект IokaTheme из material.Theme или cupertino.CupertinoTheme. Для этого можно передать флаг automaticallyGenerateTheme в конфигурации SDK:

Ioka.setup(
'<PUBLIC_KEY>',
configuration: IokaConfiguration(
automaticallyGenerateTheme: true,
),
);

Аналогично, можно сгенерировать тему используя IokaCupertinoThemeGenerator или IokaMaterialThemeGenerator:

// Генерация из material.Theme
final materialTheme = ThemeData(...);
final generatedIokaTheme = IokaMaterialThemeGenerator().toIokaTheme(materialTheme);

// Генерация из cupertino.CupertinoTheme
final cupertinoTheme = CupertinoThemeData(...);
final generatedIokaTheme = IokaCupertinoThemeGenerator().toIokaTheme(cupertinoTheme);