Coding Phase - Week 2 Report

GSoC Projects Table Layout
, ,
1

Past Week

This week, I finished writing and testing the getResponsiveValue function. I used this function to set a sideMenuWidth state. I also used the react-native Dimensions api to check when a device's width changes and update the sideMenuWidth state using getResponsiveValue. I set the openMenuOffset prop on the react-native-side-menu to the sideMenuWidth state, and I was able to get the side menu to display nicely on mobile and tablet devices. I tested the side menu on an android emulator using mobile and a tablet screen sizes, as well as on a physical android device and the side menu displays nicely.

However, I noticed a bug. When the mobile app starts in landscape mode as opposed to portrait mode, the side menu rendered has a smaller width compared to when the app is started in potrait mode, with the same openMenuOffset value set.

Screenshots

When app is launched in potrait mode

Screenshot_1656088036
Screenshot_16560880361440×2560 101 KB

Screenshot_1656088053
Screenshot_16560880532560×1440 103 KB

When app is launched in landcape mode

Screenshot_1656087975
Screenshot_16560879751440×2560 104 KB

Screenshot_1656087933
Screenshot_16560879332560×1440 102 KB

(sideMenuWidth value is the same)

I'm thinking of fixing this by locking the device's orientation to portrait before it's rendered and then unlocking it immediately after, so that the side menu can always display consistently.

Any thoughts on this?

This Week

I plan to fix the bug I encountered in the previous week and test what I've done so far.

3 Likes
2

I've updated this to include screenshots of the bug I mentioned

2 Likes
3

Thanks for the update. If something is ready for review, please create a pull request (ideally only one change per pull request).

4

Okay. I'll create a pull request now.

1 Like
5

I just created a pull request for review. Thank you.

2 Likes