Incorrect navigation bar height in Xamarin Android

I am trying to remove the hamburger icon on MasterDetailPage by creating a Base Page like below:

[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class BasePage : ContentPage
{
    public IList<View> BasePageContent => BaseContentGrid.Children;

    public BasePage()
    {
        InitializeComponent();
    }

    protected override void OnAppearing()
    {
        base.OnAppearing();

        //Fix top page margin requirement depending on the current device running the app
        StatusRowDef.Height = DependencyService.Get<IDeviceInfo>().StatusBarHeight;
        NavigationBarDef.Height = DependencyService.Get<IDeviceInfo>().NavigationBarHeight;

        //Hide the Xamarin Forms built in navigation header
        NavigationPage.SetHasNavigationBar(this, false);
    }
}

then this is how I get the navigation height

public class DeviceInfo : IDeviceInfo
{
    public float StatusBarHeight => 0;
    public float NavigationBarHeight => GetNavigationBarSize();

    internal static Func<Context> GetContext { get; set; }

    private static float GetNavigationBarSize()
    {
        float heightInPx = 0;
        var res = GetContext().Resources;
        int resourceId = res.GetIdentifier("navigation_bar_height", "dimen", "android");
        if (resourceId > 0)
        {
            heightInPx = res.GetDimensionPixelSize(resourceId);
        }
        return heightInPx;
    }

}

now the result of this is I think in Pixel (example result = 144).

using the result which is 144px makes my custom page shows bigger navigation bar as shown below

enter image description here

What am I doing wrong on this part? Do i need to convert it into something?