Unplanned
Last Updated: 10 Jun 2024 13:43 by ADMIN
David
Created on: 26 May 2023 07:26
Category: SideDrawer
Type: Feature Request
12
SideDrawer: [iOS] Provide an option to remove header and footer area in the Drawer content
Provide an option to remove the area that looks like header and footer in the Drawer content. 
2 comments
ADMIN
Didi
Posted on: 10 Jun 2024 13:43

Hi all,

I tested several scenarios and reviewed the native iOS TKSideDrawer control in details and found a solution on native level in order to remove the header and footer for the drawer.

1. Subscribe to the SideDrawer.HandlerChanged 

<telerik:RadSideDrawer x:Name="drawer" HandlerChanged="drawer_HandlerChanged"
                       DrawerLength="200">
        <telerik:RadSideDrawer.MainContent>
            <Grid>
                <Label Text="Main content" />
            </Grid>
        </telerik:RadSideDrawer.MainContent>
        <telerik:RadSideDrawer.DrawerContent>
            <VerticalStackLayout Spacing="10"
                             Padding="10, 10, 0, 0">
                <Button Text="Mail" />
                <Button Text="Calendar"/>
                <Button Text="People" />
                <Button Text="Tasks" />
            </VerticalStackLayout>
        </telerik:RadSideDrawer.DrawerContent>
    </telerik:RadSideDrawer>

 

2. Set the header and footer height of the native iOS TKSideDrawer to 0:
public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
    }

    private void drawer_HandlerChanged(object sender, EventArgs e)
    {
        this.UpdateDrawer();
    }

    private void UpdateDrawer()
    {
        var platformView = this.drawer.Handler.PlatformView;

# if IOS || MACCATALYST
        var platformSideDrawer = (TelerikUI.TKSideDrawerView)platformView;
        var drawer = platformSideDrawer.SideDrawers[0];
        drawer.Style.HeaderHeight = 0;
        drawer.Style.FooterHeight = 0;
#endif
    }
}

Regards,
Didi
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Aleksandra
Posted on: 30 Jun 2023 10:10

I agree with the author and look for the property - on Android SideDrawer looks oki. The issue is on iOS only....