Смена темы на лету с native-base - PullRequest
Новая
       6

Смена темы на лету с native-base

1 голос
/ 01 июля 2019

Я пытаюсь реализовать темную тему в приложении. В настоящее время мне говорят использовать native-base для реализации этого. Я могу успешно переключать темы, но для этого требуется перезагрузка приложения.

Моя логика смены темы находится на уровне приложения, поэтому

<StyleProvider style={ getTheme(this.state.theme === 'light' ? platform : darkplatform) }>

С темой, изменяемой в состоянии уровня модуля при повторном рендеринге, вот так 

    console.log(`darkTheme enabled? ${isDarkThemeEnabled}`);
    if (isDarkThemeEnabled && this.state.theme === 'light') {
      this.setState(() => ({
        theme: 'dark',
      }));
    } else if (!isDarkThemeEnabled && this.state.theme === 'dark') {
      this.setState(() => ({
        theme: 'light',
      }));
    }
  };

Я знаю, что это не идеальная логика, но в соответствии с журналами консоли, которые я поместил в метод рендеринга app.js, он перерисовывается, и тема включается и переключается в поставщике стилей. Остальные компоненты в приложении успешно реализуют собственную базу, они используют текущую тему, но переключаются только после обновления приложения. Я также позаботился о том, чтобы они все перерисовывали при изменении состояния, но тема осталась прежней

Обновление: НЕКОТОРЫЕ компоненты меняются на лету, но не все. Есть причина для этого? Это кажется случайным, некоторые из моих тегов представления меняются, но не все, даже не все из них в одном компоненте

Редактировать: я использую избыточность, все мои компоненты перерисовываются при изменении состояния, но, что любопытно, меняются только некоторые темы

1 Ответ

0 голосов
/ 08 июля 2019

Как я в конце концов исправил это (вроде):

Запустил npm i - сохранить git + https://github.com/GeekyAnts/theme

Пришлось сделать это, так как в версии темы npm нет clearThemeCache ();

В моем app.js

Добавлены import { clearThemeCache } from 'native-base-shoutem-theme';

и clearThemeCache(); в метод, который обновлял состояние компонента при смене темной темы

После этого мне пришлось повторно визуализировать КАЖДЫЙ компонент во всем приложении при переключении темной темы, поскольку некоторые компоненты nativebase не отображались при смене темной темы

...