Space above bottom navigation bar

[keytronic]

I always have a space between the BottomNavigationBar and the ContentPage.

With a Pixel C (Android 7) the space is small (see screen 1) but with an old little samsung tablet the space is important... (see screen 2)

Screen 1:

Screen 2:

[andreinitescu]

I think the issue comes from this line

https://github.com/thrive-now/BottomNavigationBarXF/blob/master/BottomBar.Droid/Renderers/BottomBarPageRenderer.cs#L187

That line computes the area where the child pages are put.

[Korayem]

Changing that line mentioned by @andreinitescu to the following fixes my problem:
_pageController.ContainerArea = new Rectangle(0, 0, context.FromPixels(width), context.FromPixels(height - 115));

[ice-j]

So basically, changing it to another magic number won't fix the bug. You got it fixed because your device's display is HD, so the number is 115, on FHD is 168, and the generic solution to this problem is the following:

int ninePercentsOfHeight = (int)Math.Ceiling((height * 0.909));
                _pageController.ContainerArea = new Rectangle(0, 0, context.FromPixels(width), context.FromPixels(ninePercentsOfHeight));

With "nine" percents of the height, well not exactly 9 but the value above, you get the correct container area on any device (tested with QHD, HD, FHD). Should I do a PR with this?

[keytronic]

@ice-j I will try your fix but à PR would be great

[sschmidt]

Merged the PR - thanks guys! Can you verify that it's working in master? Looks good to me. I'll publish a new nuget version once we have that verified.

[DominicFrei]

@JordanGout @sschmidt @andreinitescu @Korayem @ice-j Are we done here? Does it work to your satisfaction so that I can close this issue?

[Korayem]

Ok
On Mon, Oct 24, 2016 at 4:20 PM Dominic Frei notifications@github.com
wrote:

@JordanGout https://github.com/JordanGout @sschmidt
https://github.com/sschmidt @andreinitescu
https://github.com/andreinitescu @Korayem https://github.com/Korayem
@ice-j https://github.com/ice-j Are we done here? Does it work to your
satisfaction so that I can close this issue?

—
You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub
#6 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAMGvMeSN-biaUG6pksw3c1r-1b1-3scks5q3L64gaJpZM4JYGcU
.

[DominicFrei]

Going to close this for now. If something re-arises, feel free to reopen this issue with new information.

[ice-j]

Looks like it was not fully working, and I didn't like that magic number calculation, so I think that now will be working better, and can say that this bug is fixed with #21

[gjeromeb]

@ice-j @DominicFrei The problem has not dissappeared entirely. I still get the extra bar when first launching the app in the simulator, as well as when changing between landscape and portrait mode.

Once I then click on another tab, the bar dissappears, until I either reopen the app or change between landscape and portrait.

[ice-j]

@jbucka I think that there's no new nuget yet with my changes. Are you using the nuget package or you built one yourself one locally?

[gjeromeb]

@ice-j I built the project myself locally after your push request was accepted.

[gjeromeb]

@DominicFrei can we please reopen this? Issue isnt fully fixed. I have tried to play around with the source but not managed to get to the bottom of it. Can someone else confirm that they can reproduce the issue?

[DominicFrei]

@jbucka Can you provide an example project or something like this so that the others can understand the problem?

[gjeromeb]

@DominicFrei @ice-j Apologies for the delay, sample code is at:

https://github.com/jbucka/App1

[hardcodet]

Possibly related:

• Start the sample in portrait mode.
• Turn phone to landscape mode.
• Switch back to portrait mode - layout is not probably refreshed.

[ice-j]

We should add Rotation listener to properly handle layout after rotation. I'm sorry but I'm very busy this week, I'll do it during the weekend if somebody else can't find the time before that.

[gjeromeb]

@ice-j Thanks for your help, I will happily wait for the weekend, if you can make it work.

I managed to add an eventHandler to the BottomBarPage and react to that eventHandler in the Renderer, but then I am at a total loss what I would need to do to reset the layout. Basically I am messing with code I don't fully understand, so not getting anywhere.

I look forward to seeing your solution.

[lengluo]

I have the same issue, when reload the bar, a space will appear above. But when I select the tab, it will disappear. Wait for a solution.

[gjeromeb]

@ice-j Do you think you might be able to take a look at this soon? Otherwise any hints how I would rerender everything once the rotation event triggers.

[ice-j]

I can't right now. But my try would be to implement ISensorListener in the custom renderer, which then let's you override 2 methods, OnAccuracyChanged and OnSensorChanged which looks like this:

public void OnAccuracyChanged([GeneratedEnum] SensorType sensor, [GeneratedEnum] SensorStatus accuracy)
{
     throw new NotImplementedException();
}

public void OnSensorChanged([GeneratedEnum] SensorType sensor, float[] values)
{
     if(sensor == SensorType.Orientation)
     {

     }
}

And in the if block, measure the views again or redraw them, I'd first try to call _bottomBar.SelectTabAtPosition() in there, or SwitchContent()

It'd be awesome if you could try this and come back here with results.

[gcadmes]

ice-j,

Some good news...I was able to get it working, but not with the ISensorListener.
The ISensorListener didn't work, prob because of being deprecated. Also couldn't get the ISensorEventListener working.

Instead, I override the OnSizeChanged and detected the orientation changes that way (w > h). When the orientation changes to vertical, I invoke the _bottomBar.SelectTabAtPosition(), which then re-draws the UI correctly.

I would have rather implemented a well-known interface for detecting orientation changes, but decided to use the Xamarin hack instead.

[lengluo]

@gcadmes I don't think it's just occurred in orientation change, you'll get this issue if click the backbutton of NavigationPage, another way of saying, just return from NavigationPage, the empty space will happens again.

[ice-j]

@gcadmes thank you, it'd be awesome if you could do a PR, if not I'll do it this weekend.
@lengluo I'm using a navigation page currently, and have no problem as yours, can you please do a sample that reproduces your problem?

[lengluo]

@ice-j Thank you for your reply. I don't know why it happens in my case. And I have resolved this issue by a dirty way:
define a staitic variable "_frameLayoutHeiht " in renderer, and do it in OnLayout Event as below:
if (_frameLayout.Height >= 0 && _frameLayoutHeiht == 0) { _frameLayoutHeiht = _frameLayout.Height; } var currHeight = _frameLayoutHeiht; if (_frameLayoutHeiht != _frameLayout.Height && _frameLayoutHeiht < _frameLayout.Height + 100) currHeight = _frameLayoutHeiht + 50; _pageController.ContainerArea = new Rectangle(0, 0, context.FromPixels(width), context.FromPixels(currHeight));
and it seems work fine in my phones with different resolution as well as in genymotion. And I still want to know the reason why this happens.

[Tany3450]

Still not available on nuget i guess. If you navigate to a page with a NavigationBar and go back to a page without a NavigationBar problem still occurs. I am looking for a solution to this.

[Ironthighs]

I pulled the source and tried the demo. It's still having an issue with a space above the bar on initial load. It's also not respecting my carousel page size because my page controls are rendering behind the bar instead of above it. Pages that are instantiated during runtime display properly though. For instance: The first and second pages of my carousel render behind the bar (incorrect), but the third page renders above the bar (correct). Swipe back to the first page and now it renders above the bar correctly.

[ice-j]

@Ironthighs I've not tested that scenario with a carousel page, it would be great if you could publish the test project so I can look into it.

[Ironthighs]

@ice-j The project as it is now has this space on the first page. Tap a new tab and it's gone. I just created a pull request fixing this issue. Please have a look.