Как я могу переопределить AmplifyTheme в моем собственном приложении - PullRequest
0 голосов
/ 06 декабря 2018

Я создаю приложение, использующее аутентификацию Amazon Cognito, с помощью функции добавления и повышения аутентификации.Я впервые его использую, поэтому я решил не слишком настраивать пользовательский интерфейс, но я пытаюсь переопределить стили AmplifyTheme, перечисленные здесь , как указано в документации здесь .

Вот моя попытка переопределить AmplifyTheme:

const MyButton = Object.assign({}, AmplifyTheme.button, { 
backgroundColor: '#A7B1B2' });

const myNavBar = Object.assign({}, AmplifyTheme.navBar, { marginTop: 
35, padding: 15, flexDirection: 'row', justifyContent: 'space-between', 
alignItems: 'center'});

const myTheme = Object.assign({}, AmplifyTheme, { button: MyButton, 
navBar: myNavBar });

В нижней части моего файла App.js, согласно документации Amplify Authentication, у меня есть следующее:

export default withAuthenticator(App,
  includeGreetings = true,
  authenticatorComponents = [],
  federated = null,
  theme = {myTheme});

Однако стиль приветствия не изменился!Кто-нибудь знает, как переопределить AmplifyTheme ??

1 Ответ

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

Видимо, вы можете добавить отдельный файл с пользовательской темой.export этот файл темы в вашем withAuthenticator/Authenticator

//Custom theme
const theme = {
  ...AmplifyTheme,
  container: {
    flex: 1,
    flexDirection: 'column',
    alignItems: 'center',
    justifyContent: 'space-around',
    paddingTop: 10,
    width: '100%',
    marginTop: 30
  },
  button: {
    alignItems: 'center',
    padding: 16,
  }
}

просто отошлите этот пост пользовательский модуль

...