Вот проблема, с которой я сталкиваюсь:
У меня есть компонент в реагировать нативно под названием Header. Заголовок имеет 3 свойства - левый суффикс (например, для кнопки «назад»), правый суффикс (для дополнительных действий, иногда 1 кнопка, иногда 2 кнопки, иногда нет) и заголовок.
Правила размещения:
- Заголовок всегда должен быть в центре заголовка, независимо от наличия суффиксов Right или Left. Если правый суффикс присутствует, а левый суффикс отсутствует, заголовок по-прежнему должен центрироваться в середине заголовка.
- Правый и левый суффиксы всегда должны быть видны, если они объявлены. Это означает, что если у меня есть Right Suffix + Left Suffix + очень длинный заголовок, заголовок должен уменьшиться, чтобы освободить место для суффиксов.
Я приготовил закуску, чтобы продемонстрировать свою проблему: https://snack.expo.io/@anjayka/header-challenge
Как видите, большая часть макета работает нормально - если я добавлю правый суффикс, заголовок останется на месте, если я удалю левый суффикс - он все еще на месте. Проблема возникает после того, как заголовок очень длинный текст - он настолько расширяется, что полностью выталкивает суффиксы.
Любая помощь в решении этой головоломки приветствуется