react-native-modal-dropdown
react-native-modal-dropdown copied to clipboard
adjustFrame returning top property as NaN when parent View justifyContent is set.
I use adjustFrame to move my option dropdown a bit lower by adding a few pixels to the adjustFrame style object. As soon as I set the parent View style to justifyContent: center
, the dropdown started rendering at the top of the screen instead of the calculated top I had set. Soon I found out the top property was returning NaN.
Has this happened to anyone else?
Problem:
Regular behavior:
I just found out what the problem was. I was setting the dropdown height to 'auto' which messed up the position calculation.
const positionStyle = {
height: dropdownHeight,
top: showInBottom ? this._buttonFrame.y + this._buttonFrame.h : Math.max(0,
this._buttonFrame.y - dropdownHeight),
};
console.log(showInBottom) // Returns NaN because dropdownHeight is set to 'auto' instead of an actual number
I don't know if this is something that could be fixed but for now I'll set up a fixed height.
I had exactly the same problem. Your comment saved my day. Thanks.
I just found out what the problem was. I was setting the dropdown height to 'auto' which messed up the position calculation.
const positionStyle = { height: dropdownHeight, top: showInBottom ? this._buttonFrame.y + this._buttonFrame.h : Math.max(0, this._buttonFrame.y - dropdownHeight), }; console.log(showInBottom) // Returns NaN because dropdownHeight is set to 'auto' instead of an actual number
I don't know if this is something that could be fixed but for now I'll set up a fixed height.
You saved my night too