Jak uzyskać pozycję aktualnie aktywnego wejścia?

Question

Potrzebuję znać położenie aktualnie skupionego wejścia, aby wykonać pewne obliczenia. Na koniec chcę zadzwonić pod numer .measure().

Co mam:

import { TextInput } from 'react-native'; 

const { State: TextInputState } = TextInput; 
var currentlyFocussedField  = TextInputState.currentlyFocusedField(); 

console.log('currentlyFocussedField', currentlyFocussedField); 

Ale to tylko zwraca identyfikator w polu tekstowym (np 394, a następnego pole jest 395). Jak mogę uzyskać dostęp do prawdziwego elementu/obiektu lub jak uzyskać jego pozycję na ekranie?

Answer 1

Nie wiem, w jaki sposób można uzyskać dostęp do React składnika z numerycznym reactTag w JavaScript, ale można użyć tego samego UIManager.measure(reactTag, callback) funkcję RN używa wewnętrznie, aby .measure() pracy.

Nie jest to udokumentowane, ale można znaleźć źródło here dla systemu iOS i here dla systemu Android.

Możesz użyć tego, aby uzyskać wszystkie wartości rozmiaru widoku natywnego. Na przykład, korzystając z powyższego przykładu:

import { UIManager, TextInput } from 'react-native'; 

const { State: TextInputState } = TextInput; 
const currentlyFocusedField = TextInputState.currentlyFocusedField(); 

UIManager.measure(currentlyFocusedField, (originX, originY, width, height, pageX, pageY) => { 
    console.log(originX, originY, width, height, pageX, pageY); 
});