Navigation drawers provide access to destinations in your app. Drawer is a slide-out panel from the edge of the screen. The Drawer is mainly used to organize navigation between top-level sections of our application.
If you have more than 4 top-level sections, then Drawer is the perfect solution to navigate inside your app. You can also combine it with Menu component and get fast ready to use.
Basic usage
The component consists from 3 parts:
FGX.DrawerLayout.TfgDrawerLayout
- special container, which controlls pulling drawer.FGX.DrawerLayout.TfgDrawer
- sliding container.FGX.DrawerLayout.TfgMainContent
- The main content of the screen, on top of which the drawer slides.
When you put TfgDrawerLayout
it automatically creates nested TfgDrawer
and TfgMainContent
.
Automatically Open/Close with button
TfgDrawerLayout
supports automatic opening and closing by other control. You can bind TfgDrawerLayout
to other control via ToggleControl
.
For example if you specify TfgNavigationBar
as ToggleControl
, when user tap at the Navigation icon on the TfgNavigationBar
it will automatically toggles drawer.
Open/Close
You can use methods Open
and Close
for manual opening and closing drawer panel in time, when you needed..
Disabling
If you don't want to allow user to pull drawer, you can disable it via Enabled
.
Tracking a drawer sliding
TfgDrawerLayout
provides a lot of different kinds events, which allow you to control all stages of drawer sliding:
- Controlling of end stages:
OnBeginOpen
,OnOpened
,OnBeginClose
,OnClosed
,OnStateChanged
- The tracking process of the panel shift:
OnSlideChanged