DrawerPage.DrawerPosition Property

Gets or sets the screen edge to which the drawer is anchored.

Namespace: DevExpress.XamarinForms.Navigation

Assembly: DevExpress.XamarinForms.Navigation.dll

Declaration

public Position DrawerPosition { get; set; }

Property Value

Type Description
Position

The screen edge to which the drawer is anchored.

Remarks

The DrawerPage supports the following drawer positions:

Value

Sample Image

Description

Left

The drawer is anchored to the left edge of the screen.

Top

The drawer is anchored to the top of the screen.

Bottom

The drawer is anchored to the bottom of the screen.

Right

The drawer is anchored to the right edge of the screen.

Examples

This example demonstrates how to adjust the DrawerPage's basic settings. DrawerPage Example

<dxn:DrawerPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:dxn="clr-namespace:DevExpress.XamarinForms.Navigation;assembly=DevExpress.XamarinForms.Navigation"
            xmlns:local="clr-namespace:DrawerPageExample"
            xmlns:viewmodel="clr-namespace:DrawerPageExample.ViewModels"
            xmlns:view="clr-namespace:DrawerPageExample.Views"
            x:Class="DrawerPageExample.MainPage"
            DrawerPosition="Left"
            DrawerBehavior="SlideOnTop"
            DrawerWidth="180"
            IsScrimEnabled="false"
            IsDrawerShadowVisible="true"
            DrawerShadowHeight="5"
            DrawerShadowRadius="10"
            DrawerShadowColor="#808080">
    <dxn:DrawerPage.BindingContext>
        <viewmodel:MainViewModel/>
    </dxn:DrawerPage.BindingContext>
    <dxn:DrawerView.DrawerHeaderContent>
        <view:DrawerHeader/>
    </dxn:DrawerView.DrawerHeaderContent>
    <dxn:DrawerView.DrawerFooterContent>
        <view:DrawerFooter/>
    </dxn:DrawerView.DrawerFooterContent>
    <dxn:DrawerPage.DrawerContent>
        <ListView x:Name="categoryList" 
                    ItemsSource="{Binding VehiclesByMake}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding GroupKey}" />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </dxn:DrawerPage.DrawerContent>
    <dxn:DrawerPage.MainContent>
        <ContentPage>
            <ListView BindingContext="{x:Reference categoryList}"
                        ItemsSource="{Binding SelectedItem.Vehicles}">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <TextCell Text="{Binding FullName}"/>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </ContentPage>
    </dxn:DrawerPage.MainContent>
</dxn:DrawerPage>

The following table lists the DrawerPage object's properties used in this example to configure the drawer panel and content area:

Property

Description

Drawer Content

DrawerContent

Gets or sets a view the DrawerPage displays as the drawer content.

DrawerHeaderContent

Gets or sets a view the DrawerPage displays as the drawer header.

DrawerFooterContent

Gets or sets a view the DrawerPage displays as the drawer footer.

Drawer Position and Behavior

DrawerPosition

Gets or sets the screen edge to which the drawer is anchored.

DrawerBehavior

Gets or sets how the drawer behaves on opening / closing.

Drawer Size

DrawerWidth

Gets or sets the width of the drawer when DrawerPosition is set to Left or Right.

Drawer Shadow

IsDrawerShadowVisible

Gets or sets whether the drawer casts a shadow.

DrawerShadowColor

Gets or sets the color of the drawer shadow.

DrawerShadowHeight

Gets or sets the height of the shadow the drawer casts.

DrawerShadowRadius

Gets or sets the blur radius of the shadow the drawer casts.

Content Area and Scrim

MainContent

Gets or sets a page that the DrawerPage displays in the content area.

IsScrimEnabled

Gets or sets whether the scrim is shown when the drawer is opened.

See Also