How To Create Slide Menu Like Google Map Android App?

Could Someone Explain,

How to implement slide menu component like google map slide menu.
Is there any kind of built-in functionality inside ionic for these kind of slide menu?



1 Like

There’s the Android drawer, but there isn’t much documentation around it yet:

1 Like

@brandyshea Thanks for answer. :blush:
I have implemented the ionic drawer in these Codepen.

How change the background color as above display image?

I think if you want to achieve the content becoming darker you have to modify the directive itself.

You would need to apply a opacity transform, whenever the drawer is moved (lines: and
Then you need a child-element of the drawer, that covers the entire screen size and is usually set to display: none. When the .menu-open class is applied, set the display-Attribute to block.
From the directive you could set the opacity using $element.children(), or maybe write another directive, that has require: '^drawerCtrl'. That way you could expose that elements $element to the drawerCtrl.