In the previous article, I introduced it to youAndroid Development Developer Headlines (I) Startup Page Implementation, interested friends can refer to it.
title: Take you to implement the developer headlines (II) and implement the left-slide menu
tags: left-slide menu, android comes with side-slide, DrawerLayout
grammar_cjkRuby: true
Today I started to imitate the side slide menu of the developer's headlines. It is the second article in this series. I believe you have seen many apps using this side slide. Today I will teach you how to implement it using the DrawerLayout control with Android.
DrawerLayout is a control in the SupportLibrary package that implements the side-sliding menu effect. It can be said that DrawerLayout is a product that Google borrows from after the emergence of third-party controls such as MenuDrawer. DrawerLayout is divided into two parts: side menu and main content area. The side menu can be expanded and hidden according to gestures (DrawerLayout's own characteristics). The content of the main content area can change with the click of the menu (this requires the user to implement it himself).
1. Let me show you the renderings first:
2. Code implementation
In fact, it is a layout control, which is the same as LinearLayout and other controls, but drawerLayout has a sliding function. As long as you write the layout according to the layout method specified by drawerLayout, you will have a slippage effect. I've put the contents of the side slide menu in a layout file.
<. xmlns:andro android: android:layout_width="match_parent" android:layout_height="match_parent" > <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:clipToPadding="true" android:fitsSystemWindows="true" > <include android: layout="@layout/layout_main_title" /> <!-- The main content view --> <FrameLayout android: android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/rl_title" android:background="@color/white_normal" > </FrameLayout> </RelativeLayout> <!-- The navigation view --> <FrameLayout android: android:layout_width="280dp" android:layout_height="match_parent" android:layout_gravity="start" > <!-- Left menu --> <include layout="@layout/layout_main_left" /> </FrameLayout> </.>
Things to note
The layout code of the main content area should be placed in front of the side-sliding menu layout, which can help DrawerLayout determine who is the side-sliding menu and who is the main content area
The layout of the side-sliding menu (here is ListView) can set the layout_gravity property, which indicates whether the side-sliding menu is on the left or right.
Inheriting FragmentActivity
1). Set content Fragment and set status bar
2). Process the click event on the left, set the selected background in the click event, and close the left side slide menu.
public class MainActivity extends FragmentActivity{
private DrawerLayout mDrawerLayout;
private RelativeLayout rlHome, rlGift, rlShare;
private int currentSelectItem = .rl_home;// Default homepageprivate ContentFragment contentFragment;
@Override
protected void onCreate(Bundle savedInstanceState) {
(savedInstanceState);
setContentView(.activity_main);
mDrawerLayout = (DrawerLayout) findViewById(.drawer_layout);
findViewById(.iv_menu).setOnClickListener(clickListener);
initLeftMenu();//Initialize the left menucontentFragment=new ContentFragment();
getSupportFragmentManager().beginTransaction().add(.content_frame,contentFragment).commit();
setWindowStatus();
}
private void initLeftMenu() {
rlHome = (RelativeLayout) findViewById(.rl_home);
rlGift = (RelativeLayout) findViewById(.rl_gift);
rlShare = (RelativeLayout) findViewById(.rl_share);
(onLeftMenuClickListener);
(onLeftMenuClickListener);
(onLeftMenuClickListener);
(true);
}
private OnClickListener onLeftMenuClickListener = new OnClickListener() {
@Override
public void onClick(View v) {
if (currentSelectItem != ()) {//Prevent repeated clickscurrentSelectItem=();
noItemSelect();
switch (()) {
case .rl_home:
(true);
("This is the homepage");
break;
case .rl_gift:
(true);
("This is a gift redemption");
break;
case .rl_share:
(true);
("This is my sharing");
break;
}
();
}
}
};
private void noItemSelect(){
(false);
(false);
(false);
}
private OnClickListener clickListener = new OnClickListener() {
@Override
public void onClick(View v) {
switch (()) {
case .iv_menu:// Open the drawer on the left();
break;
}
}
};
// Set the status barprivate void setWindowStatus() {
if (.SDK_INT >= Build.VERSION_CODES.KITKAT) {
// Transparent status bargetWindow().addFlags(.FLAG_TRANSLUCENT_STATUS);
// Transparent navigation bargetWindow().addFlags(.FLAG_TRANSLUCENT_NAVIGATION);
// Set the status bar colorgetWindow().setBackgroundDrawableResource(.main_color);
}
}
}
3. Select the layout file for the background in the menu item on the left.
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:andro> <item android:drawable="@color/menu_left_item_select" android:state_selected="true"/> <item android:drawable="@color/white_normal"/> </selector>
Fragment of display content Here I have added a method to set content, which is to click on the left to switch the display.
public class ContentFragment extends Fragment{
private TextView tvContent;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState){
View rootView=(getActivity()).inflate(.fragment_content, null);
tvContent=(TextView) (.tv_content);
return rootView;
}
public void setContent(String content){
(content);
}
}
What is the relationship with Fragment?
We see that many codes using drawerLayout use Fragment at the same time, which will cause misunderstanding. I think that using drawerLayout must use Fragment. In fact, this is wrong. The use of Fragment is because when the side-sliding menu is clicked, if the content of the main content area is relatively complicated, it will be easier to use Fragment to fill it. If your main content area is just a simple string and just want to update the content of the string when clicking on different menus, I don’t think it is necessary to use Fragment. What I did with Fragment here is that it is as simple as updating the string content.
The above content is a full introduction to the developer headlines (II) for Android development, which I hope will be helpful to everyone!