Implementing a NavigationDrawer Extendable Menu Using DrawerLayout Using Custom Layout
The other day for one of the applications being developed by our team, the customer made a change to the design, which required the development of a pull-out menu with a rather non-standard arrangement of view components. Although at the moment there are various types of implementation of this task, they were either too voluminous or did not provide the implementation of the necessary functionality.
After thinking about this task for some time, I decided to implement this menu on the basis of the standard component DrawerLayout, which was based on 2 root elements - RelativeLayout for the main layout of the window, as well as another RelativeLayout as a container for the side menu. I would like to add that exactly 2 root elements should be inside DrawerLayout, more details about this container can be found in the official Google documentation.
The markup of the main activity is ready, now let's write a class that will execute the main logic. Create a class that inherits RelativeLayout. This class implements all the logic of our menu, including sets the markup and defines all view.
The constructor should be passed context and parent.
parent - RelativeLayout, which was declared in the markup for the main activity ()
Next, the function initView (final Context context, RelativeLayout parent) - inflates the main markup, which will be placed in the pull-out menu, and also define here all view components and their listeners.
In R.layout.view_drawer_layout for example, I declared just one button.
At this stage, the main part is ready, it remains only to add our NavigationLayout using addView to the main parent container.
Create a class that inherits AppCompactActivity
This class overrides the standard setContentView method, adding to it a function call that 'initializes' the popup menu. Here we also create an object of the class we previously wrote NavigationLayout and add it using left_drawer.addView (navigationLayout) to the parent, which is the container of the side menu.
The only thing left is to make everything work, you just need to create a screen (activity) and inherit the ParentNavigationActivity that we just created.
Thus, when we inherit ParentNavigationActivity and call the setContentView function, a ready menu appears in our activity.
I would like to add that the 2 containers underlying DrawerLayout do not have to be RelativeLayout. Instead, you can use constraintlayout, framelayout, linearlayout, and others.
This method is quite simple to implement, as well as flexible in terms of adding menus to any activity. I hope this article will help android developers simplify the creation of a side menu for their applications.
After thinking about this task for some time, I decided to implement this menu on the basis of the standard component DrawerLayout, which was based on 2 root elements - RelativeLayout for the main layout of the window, as well as another RelativeLayout as a container for the side menu. I would like to add that exactly 2 root elements should be inside DrawerLayout, more details about this container can be found in the official Google documentation.
Implementation
Xml markup file for core activity
The markup of the main activity is ready, now let's write a class that will execute the main logic. Create a class that inherits RelativeLayout. This class implements all the logic of our menu, including sets the markup and defines all view.
public class NavigationLayout extends RelativeLayout
{
Button ok;
public NavigationLayout(Context context,RelativeLayout parent)
{
super(context);
initView(context,parent);
}
public void initView(final Context context,RelativeLayout parent)
{
// надуваем любой xml файл разметки
View view= LayoutInflater.from(context).inflate(R.layout.view_drawer_layout,parent,true);
ok=(Button)view.findViewById(R.id.ok);
ok.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(context,"Ok",Toast.LENGTH_SHORT).show();
}
});
}
}
The constructor should be passed context and parent.
parent - RelativeLayout, which was declared in the markup for the main activity ()
Next, the function initView (final Context context, RelativeLayout parent) - inflates the main markup, which will be placed in the pull-out menu, and also define here all view components and their listeners.
In R.layout.view_drawer_layout for example, I declared just one button.
At this stage, the main part is ready, it remains only to add our NavigationLayout using addView to the main parent container.
Create a class that inherits AppCompactActivity
public class ParentNavigationActivity extends AppCompatActivity {
NavigationLayout navigationLayout;
RelativeLayout left_drawer;
@Override
public void setContentView(@LayoutRes int layoutResID) {
super.setContentView(layoutResID);
setupMenu();
}
public void setupMenu()
{
left_drawer=(RelativeLayout) findViewById(R.id.left_drawer);
navigationLayout=new NavigationLayout(getApplicationContext(),left_drawer);
left_drawer.addView(navigationLayout);
}
}This class overrides the standard setContentView method, adding to it a function call that 'initializes' the popup menu. Here we also create an object of the class we previously wrote NavigationLayout and add it using left_drawer.addView (navigationLayout) to the parent, which is the container of the side menu.
The only thing left is to make everything work, you just need to create a screen (activity) and inherit the ParentNavigationActivity that we just created.
public class MainActivity extends ParentNavigationActivity {
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
}
}Thus, when we inherit ParentNavigationActivity and call the setContentView function, a ready menu appears in our activity.
I would like to add that the 2 containers underlying DrawerLayout do not have to be RelativeLayout. Instead, you can use constraintlayout, framelayout, linearlayout, and others.
At this stage, the development of the pull-out menu is completed!
This method is quite simple to implement, as well as flexible in terms of adding menus to any activity. I hope this article will help android developers simplify the creation of a side menu for their applications.