Наше приложение включает в себя экран, где на заднем плане находится большой круг, который меняет положение.В основном это абсолютное позиционирование с использованием такого стиля.Круг изменяется в соответствии с правильным стилем и анимируется в новую позицию под текстом учебника.
const { height, width } = Dimensions.get('screen')
const circleRadius = isIphoneX() ? height * 0.55 : height * 0.60
export const styles = StyleSheet.create({
circleMassiveLeft: {
position: 'absolute',
backgroundColor: primary,
width: circleRadius * 2,
height: circleRadius * 2,
borderRadius: circleRadius,
left: -circleRadius + width - 50,
top: -circleRadius + height / 2
},
circleMassiveRight: {
position: 'absolute',
backgroundColor: primary,
width: circleRadius * 2,
height: circleRadius * 2,
borderRadius: circleRadius,
left: -circleRadius + 50,
top: -circleRadius + height / 2
}
})
Это прекрасно работает для отображения круга в правильном положении на нескольких размерах дисплея.Поскольку его необходимо точно позиционировать, использование абсолютного позиционирования представляется лучшим решением, чем сгибание в этом случае. Наша проблема заключается в том, что при изменении системных настроек в Android для отображения небольшого размера круг становится меньше. Конечно, это имеет смысл в некотором смысле, но этот конкретный элемент выглядит довольно ужасно из-за компоновкиостальная часть экрана, когда его размер уменьшен.Элементы, которые раньше были над ним, теперь высовываются!Можно ли сделать так, чтобы этот элемент отображался одинакового размера независимо от настроек размера экрана системы Android?Пошаривая по документам, похоже, что для этого нет базовых настроек.