Skip to content

Instantly share code, notes, and snippets.

@ericjames
Last active April 5, 2019 18:24
Show Gist options
  • Save ericjames/630725e43859466656bf2193ac30335a to your computer and use it in GitHub Desktop.
Save ericjames/630725e43859466656bf2193ac30335a to your computer and use it in GitHub Desktop.
React Native attempt to reposition a View ("Card") in the scrollview if it goes out of bounds
//Adjust the scroll if we think the card content is going out of viewable bounds
fitCardInView = () => {
this.props.setAnimatingMap(true);
if (!this.cardView || !this.cardView.measureInWindow) {
return false;
}
this.cardView.measureInWindow((x, y, width, height) => {
// console.log(this.layout.height, y);
// const expandedCardHeight = this.layout.height + maps.height;
// const allowances = this.props.viewport.topMargin + maps.height;
var newPosition = false;
// If card is above view, move it down
if (y < 0) {
newPosition = this.layout.y - Math.abs(y);
}
// If a card is near the bottom...
if (y > (this.props.viewport.height / 2)) {
// If the expanded card is below view, move it up
if (y + maps.height > this.props.viewport.height) {
newPosition = this.layout.y - (maps.height - 100); // 100 gives us at least the 1 row
}
}
// console.log("We scroll?", newPosition);
if (newPosition) {
this.props.scrollListTo(newPosition);
}
this.props.setAnimatingMap(false);
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment