Как правильно расположить элементы на устройствах в React Native? - PullRequest
0 голосов
/ 12 февраля 2020

Я создаю приложение, которое включает в себя функции, аналогичные тегам изображений в Instagram. Пользователи могут нажать на изображение и выбрать тег из списка. Затем я сохраняю тег и местоположение в Firebase.

Вот основной код, который создает и размещает эти теги:

// Get the location of a tap

handlePress(evt) {
  this.top = (evt.nativeEvent.locationY * 100) / SCREEN_HEIGHT;
  this.left = (evt.nativeEvent.locationX * 100) / SCREEN_WIDTH;
}

// Create a new View component using the location

tagItem(item) {
    const newView = {
      locationX: this.left,
      locationY: this.top,
      item,
  };

// Add the new tag to a list of tags

    this.setState({
      tagList: this.state.tagList.concat([newView]),
  });

};

Используются SCREEN_HEIGHT и SCREEN_WIDTH - полученные из Dimensions в React Native - лучший способ позиционирования элементов?

У меня это нормально работает в симуляторе и на реальном устройстве такого же размера. Тем не менее, я хочу убедиться, что это работает для разных размеров устройств.

Спасибо!

1 Ответ

0 голосов
/ 13 февраля 2020

Поскольку представление изображения имеет одинаковое соотношение сторон на каждом устройстве, это должно быть надежным, поскольку вы по существу сохраняете верхнее и левое значения в процентах от высоты / ширины.

...