先po一张效果图

PS:原谅题主的懒惰吧..

看着是不是很酷炫,那是因为5.0的动画做得好,代码其实没有多少,搞清楚这个布局的层次关系很重要。

废话不多说了,先来看布局文件

最外层是一个DrawerLayout,它里面可以嵌套(一个?)container和多个drawer

在这个demo中DrawerLayout包含了一个CoordinatorLayout , ListView , NavigationView

CoordinatorLayout  作为 container的根布局

listView和navigationview作为DarwerLayout中的darwer

在container中用CoordinatorLayout目的是为了我们在滑动recyclerview时,让顶部的appbarlayout中的组件产生响应

appbarlayout中的CollapsingToolbarLayout是用来控制toolbar和banner图片的响应效果

特别注意:为了使得Toolbar可以滑动,我们必须还得有个条件,就是CoordinatorLayout布局下包裹一个可以滑动的布局,比如 RecyclerView,NestedScrollView(经过测试,ListView,ScrollView不支持)具有滑动效果的组件。

下面的就是drawerLayout的使用注意事项了:

按情理来说,一个drawerLayout添加一个drawer就够了,可是脑洞一开,想着多加一个会怎样,尝试之后发现很好玩,以后可以各种乱入drawer了,哈哈哈。

因为做毕设的时候用的DrawerLayout还不是这样方便的,那会使用这个布局,设置起来麻烦很多,而现在的实现这个布局,布局文件设置好之后,只用三句话就搞定了,简单的可怕。

下面贴上源码,各位看官就自行分析吧:

主布局文件:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. xmlns:app="http://schemas.android.com/apk/res-auto"
  4. android:id="@+id/drawer_layout"
  5. android:layout_width="match_parent"
  6. android:layout_height="match_parent"
  7. android:orientation="vertical">
  8.  
  9. <android.support.design.widget.CoordinatorLayout
  10. android:id="@+id/main_content"
  11. android:layout_width="match_parent"
  12. android:layout_height="match_parent">
  13.  
  14. <android.support.design.widget.AppBarLayout
  15. android:id="@+id/app_bar_layout"
  16. android:layout_width="match_parent"
  17. android:layout_height="wrap_content"
  18. android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
  19.  
  20. <android.support.design.widget.CollapsingToolbarLayout
  21. android:id="@+id/collapsing_toolbar_layout"
  22. android:layout_width="match_parent"
  23. android:layout_height="match_parent"
  24. app:contentScrim="@android:color/transparent"
  25. app:layout_scrollFlags="scroll|exitUntilCollapsed">
  26.  
  27. <ImageView
  28. android:id="@+id/banner"
  29. android:layout_width="match_parent"
  30. android:layout_height="match_parent"
  31. android:contentDescription="banner"
  32. android:scaleType="fitXY"
  33. android:src="@mipmap/banner"
  34. app:layout_collapseMode="parallax"
  35. app:layout_collapseParallaxMultiplier="0.5" />
  36.  
  37. <android.support.v7.widget.Toolbar
  38. android:id="@+id/tool_bar"
  39. android:layout_width="match_parent"
  40. android:layout_height="?attr/actionBarSize"
  41. android:background="@android:color/transparent"
  42. app:layout_collapseMode="pin" />
  43. </android.support.design.widget.CollapsingToolbarLayout>
  44. </android.support.design.widget.AppBarLayout>
  45.  
  46. <android.support.v7.widget.RecyclerView
  47. android:id="@+id/recycler_view"
  48. android:layout_width="match_parent"
  49. android:layout_height="wrap_content"
  50. app:layout_behavior="@string/appbar_scrolling_view_behavior" />
  51.  
  52. <android.support.design.widget.FloatingActionButton
  53. android:id="@+id/fab"
  54. android:layout_width="wrap_content"
  55. android:layout_height="wrap_content"
  56. android:layout_margin="@dimen/activity_vertical_margin"
  57. android:src="@mipmap/ic_action_web_site"
  58. app:borderWidth="0dp"
  59. app:elevation="@dimen/fab_elevation"
  60. app:layout_anchor="@id/app_bar_layout"
  61. app:layout_anchorGravity="end|bottom"
  62. app:layout_collapseMode="parallax"
  63. app:layout_collapseParallaxMultiplier="0.7"
  64. app:pressedTranslationZ="@dimen/fab_translation_z_pressed"
  65. app:rippleColor="?attr/colorPrimary" />
  66. </android.support.design.widget.CoordinatorLayout>
  67.  
  68. <ListView
  69. android:id="@+id/id_lv_left_menu"
  70. android:layout_width="match_parent"
  71. android:layout_height="match_parent"
  72. android:layout_gravity="end"
  73. android:paddingTop="0dp"
  74. android:background="#ffffffff"
  75. android:clipToPadding="false"
  76. android:divider="@null"
  77. android:listSelector="?attr/selectableItemBackground"
  78. />
  79.  
  80. <!--<include-->
  81. <!--android:layout_width="match_parent"-->
  82. <!--android:layout_height="match_parent"-->
  83. <!--android:layout_gravity="start"-->
  84. <!--android:paddingTop="0dp"-->
  85. <!--android:background="#ffffffff"-->
  86. <!--android:clipToPadding="false"-->
  87. <!--android:id="@+id/custom_drawer"-->
  88. <!--layout="@layout/layout_listview_drawer" />-->
  89.  
  90. <android.support.design.widget.NavigationView
  91. android:id="@+id/navigation_view"
  92. android:layout_width="wrap_content"
  93. android:layout_height="match_parent"
  94. android:layout_gravity="start"
  95. app:headerLayout="@layout/drawer_header"
  96. app:menu="@menu/menu_navigation_items" />
  97.  
  98. </android.support.v4.widget.DrawerLayout>

Activity文件:

  1. package com.anhry.hcol.support.design.activity;
  2.  
  3. import android.os.Bundle;
  4. import android.support.design.widget.AppBarLayout;
  5. import android.support.design.widget.CollapsingToolbarLayout;
  6. import android.support.design.widget.CoordinatorLayout;
  7. import android.support.design.widget.FloatingActionButton;
  8. import android.support.design.widget.NavigationView;
  9. import android.support.design.widget.Snackbar;
  10. import android.support.v4.view.GravityCompat;
  11. import android.support.v4.widget.DrawerLayout;
  12. import android.support.v7.app.AppCompatActivity;
  13. import android.support.v7.widget.LinearLayoutManager;
  14. import android.support.v7.widget.RecyclerView;
  15. import android.support.v7.widget.Toolbar;
  16. import android.view.Gravity;
  17. import android.view.LayoutInflater;
  18. import android.view.MenuItem;
  19. import android.view.View;
  20. import android.widget.AdapterView;
  21. import android.widget.ImageButton;
  22. import android.widget.ImageView;
  23. import android.widget.ListView;
  24.  
  25. import com.anhry.hcol.support.design.adapter.LeftMenuListAdapter;
  26. import com.anhry.hcol.support.design.adapter.MenuItemAdapter;
  27. import com.anhry.hcol.support.design.module.LvMenuItem;
  28. import com.yanbober.support_library_demo.R;
  29. import com.yanbober.support_library_demo.RecyclerViewAdapter;
  30.  
  31. import java.util.ArrayList;
  32. import java.util.Arrays;
  33. import java.util.List;
  34.  
  35. /**
  36. * @author HCol
  37. * @email 282386589@qq.com
  38. * @create 2015/8/25
  39. * @modify 2015年8月29日17:29:04
  40. */
  41. public class DesignDemoActivity extends AppCompatActivity {
  42.  
  43. /**
  44. * views
  45. */
  46. private DrawerLayout mDrawerLayout;
  47. private CoordinatorLayout mCoordinatorLayout;
  48. private AppBarLayout mAppBarLayout;
  49. private CollapsingToolbarLayout mCollapsingToolbarLayout;
  50. private ImageView mImageView;
  51. private Toolbar mToolbar;
  52. private RecyclerView mRecyclerView;
  53. private NavigationView mNavigationView;
  54. private FloatingActionButton mFloatingActionButton;
  55. private ImageView mRightNavigationBtn;
  56.  
  57. private CoordinatorLayout mCustomDrawer;
  58. private RecyclerView leftMenuList;
  59.  
  60. private ListView mLvLeftMenu;
  61. /**
  62. * members
  63. */
  64. private RecyclerViewAdapter mAdapter;
  65. private LinearLayoutManager mRecyclerLayoutManager;
  66. private LeftMenuListAdapter mLeftMenuListAdapter;
  67. private List<LvMenuItem> dataSource;
  68. private static final String BTN_RIGHT_MENU_TAG = "tag";
  69.  
  70. @Override
  71. protected void onCreate(Bundle savedInstanceState) {
  72. super.onCreate(savedInstanceState);
  73.  
  74. initViews();
  75. }
  76.  
  77. /**
  78. * init views
  79. */
  80. private void initViews() {
  81. setContentView(R.layout.activity_my_design);
  82. /* 抽屉形式界面的的两个布局控件
  83. *
  84. * DrawerLayout 做根布局使用
  85. * 因为要显示的内容界面和抽屉视图(NavigationView)是包含在此layout之下的
  86. *
  87. * NavigationView 抽屉布局中的抽屉视图,有源码分析他的实现其实就是一个ListView
  88. * 而这里用的是原生的组件,所以在Menu目录下配置好要显示的条目,引用即可,非常方便.
  89. *
  90. * ref:http://blog.csdn.net/lmj623565791/article/details/46405409
  91. *
  92. * */
  93. // 原生DrawerLayout
  94. mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
  95.  
  96. // 利用ListView仿制的Drawer
  97. mLvLeftMenu = (ListView) findViewById(R.id.id_lv_left_menu);
  98. setUpDrawer();
  99.  
  100. // 不用在意这一块
  101. // mCustomDrawer = (CoordinatorLayout) findViewById(R.id.custom_drawer);
  102. // leftMenuList = (RecyclerView) findViewById(R.id.rv_left_menu);
  103. // dataSource = new ArrayList<>(
  104. // Arrays.asList(
  105. // new LvMenuItem(R.mipmap.ic_action_web_site, "Home"),
  106. // new LvMenuItem(R.mipmap.ic_action_web_site, "Messages"),
  107. // new LvMenuItem(R.mipmap.ic_action_web_site, "Friends"),
  108. // new LvMenuItem(R.mipmap.ic_action_web_site, "Discussion"),
  109. // new LvMenuItem(R.mipmap.ic_action_web_site, "Discussion"),
  110. // new LvMenuItem(R.mipmap.ic_action_web_site, "Discussion"),
  111. // new LvMenuItem(R.mipmap.ic_action_web_site, "Discussion"),
  112. // new LvMenuItem(R.mipmap.ic_action_web_site, "Discussion"),
  113. // new LvMenuItem(),
  114. // new LvMenuItem("Sub Items"),
  115. // new LvMenuItem(R.mipmap.ic_action_web_site, "Sub Item 1"),
  116. // new LvMenuItem(R.mipmap.ic_action_web_site, "Sub Item 2")
  117. // ));
  118. // mLeftMenuListAdapter = new LeftMenuListAdapter(this, dataSource);
  119. // mRecyclerLayoutManager = new LinearLayoutManager(this);
  120. // leftMenuList.setAdapter(mLeftMenuListAdapter);
  121. // leftMenuList.setLayoutManager(mRecyclerLayoutManager);
  122.  
  123. mNavigationView = (NavigationView) findViewById(R.id.navigation_view);
  124. mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
  125. @Override
  126. public boolean onNavigationItemSelected(MenuItem menuItem) {
  127. mDrawerLayout.closeDrawers();
  128. return true;
  129. }
  130. });
  131. /* 下面就是抽屉布局中[内容布局]的重点了
  132. *
  133. * CoordinatorLayout 协调者布局
  134. * AppBarLayout 导航栏布局
  135. * CollapsingToolbarLayout ToolBar的可坍塌布局
  136. *
  137. * 首先,这三个布局有什么用呢?
  138. *
  139. * CoordinatorLayout
  140. * 官方文档介绍说是一个增强版的FrameLayout
  141. * 有两种主要的用途:
  142. * 1. 作为一个顶层布局文件来使用
  143. * 2. 作为一个有[多个互动视图]的容器
  144. * 就是当某一视图有特殊行为动作时,其他子视图会进行相应的动作反应。INTERACTION
  145. *
  146. * AppBarLayout
  147. * 一个模块化的布局文件,可以用来装载一切属于AppBar的组件
  148. *
  149. * CollapsingToolbarLayout
  150. *
  151. * CollapsingToolbarLayout is a wrapper for Toolbar which implements a collapsing app bar.
  152. * It is designed to be used as a direct child of a AppBarLayout.
  153. *
  154. * 官方说,它的诞生主要是用来为toolbar锦上添花用的
  155. * 被设计来作为AppBarLayout的亲儿子来使用
  156. *
  157. * */
  158. mCoordinatorLayout = (CoordinatorLayout) findViewById(R.id.main_content);
  159. mAppBarLayout = (AppBarLayout) findViewById(R.id.app_bar_layout);
  160. mCollapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout);
  161. mImageView = (ImageView) findViewById(R.id.banner);
  162. mToolbar = (Toolbar) findViewById(R.id.tool_bar);
  163.  
  164. // 创建右边导航按钮
  165. ensureRightButtonView();
  166. mToolbar.setNavigationIcon(R.mipmap.ic_drawer);
  167. mToolbar.addView(mRightNavigationBtn);
  168. mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
  169. @Override
  170. public void onClick(View v) {
  171. mDrawerLayout.openDrawer(GravityCompat.START);
  172. }
  173. });
  174. mCollapsingToolbarLayout.setTitle("CollapsingTitle");
  175. /* init RecyclerView */
  176. mRecyclerView = (RecyclerView) findViewById(R.id.recycler_view);
  177. mAdapter = new RecyclerViewAdapter(this);
  178. mRecyclerView.setAdapter(mAdapter);
  179. mRecyclerLayoutManager = new LinearLayoutManager(this);
  180. mRecyclerView.setLayoutManager(mRecyclerLayoutManager);
  181.  
  182. mFloatingActionButton = (FloatingActionButton)findViewById(R.id.fab);
  183. mFloatingActionButton.setOnClickListener(new View.OnClickListener() {
  184. @Override
  185. public void onClick(View v) {
  186. Snackbar.make(mRecyclerView , "papa i'm here" , Snackbar.LENGTH_LONG).show();
  187. }
  188. });
  189. }
  190.  
  191. private void setUpDrawer() {
  192. LayoutInflater inflater = LayoutInflater.from(this);
  193. mLvLeftMenu.addHeaderView(inflater.inflate(R.layout.drawer_header, mLvLeftMenu, false));
  194. mLvLeftMenu.setAdapter(new MenuItemAdapter(this));
  195. mLvLeftMenu.setOnItemClickListener(new AdapterView.OnItemClickListener() {
  196. @Override
  197. public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
  198. mDrawerLayout.closeDrawers();
  199. }
  200. });
  201. }
  202.  
  203. private void ensureRightButtonView() {
  204. if (mRightNavigationBtn == null) {
  205. mRightNavigationBtn = new ImageButton(this, null,
  206. android.support.v7.appcompat.R.attr.toolbarNavigationButtonStyle);
  207. final Toolbar.LayoutParams lp = generateDefaultLayoutParams();
  208. lp.gravity = GravityCompat.END | (Gravity.TOP & Gravity.VERTICAL_GRAVITY_MASK);
  209. mRightNavigationBtn.setImageResource(R.mipmap.ic_drawer);
  210. mRightNavigationBtn.setLayoutParams(lp);
  211. mRightNavigationBtn.setTag(BTN_RIGHT_MENU_TAG);
  212. mRightNavigationBtn.setOnClickListener(new View.OnClickListener() {
  213. @Override
  214. public void onClick(View v) {
  215. mDrawerLayout.openDrawer(GravityCompat.END);
  216. }
  217. });
  218. }
  219. }
  220.  
  221. private Toolbar.LayoutParams generateDefaultLayoutParams() {
  222. return new Toolbar.LayoutParams(Toolbar.LayoutParams.WRAP_CONTENT, Toolbar.LayoutParams.WRAP_CONTENT);
  223. }
  224. }

drawer head:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="match_parent"
  4. android:layout_height="wrap_content"
  5. android:background="#000000"
  6. android:gravity="center_horizontal"
  7. android:orientation="vertical"
  8. android:padding="13dp">
  9.  
  10. <ImageView
  11. android:layout_width="wrap_content"
  12. android:layout_height="wrap_content"
  13. android:src="@drawable/icon_people" />
  14.  
  15. <TextView
  16. android:layout_width="wrap_content"
  17. android:layout_height="wrap_content"
  18. android:layout_marginTop="15dp"
  19. android:text="UserName"
  20. android:textColor="?attr/colorAccent"
  21. android:textSize="24sp" />
  22. </LinearLayout>

ListViewAdapter:

  1. public class MenuItemAdapter extends BaseAdapter {
  2. private final int mIconSize;
  3. private LayoutInflater mInflater;
  4. private Context mContext;
  5.  
  6. public MenuItemAdapter(Context context) {
  7. mInflater = LayoutInflater.from(context);
  8. mContext = context;
  9.  
  10. mIconSize = context.getResources().getDimensionPixelSize(R.dimen.abc_dialog_padding_material);//24dp
  11. }
  12.  
  13. private List<LvMenuItem> mItems = new ArrayList<LvMenuItem>(
  14. Arrays.asList(
  15. new LvMenuItem(R.mipmap.ic_action_web_site, "Home"),
  16. new LvMenuItem(R.mipmap.ic_action_web_site, "Messages"),
  17. new LvMenuItem(R.mipmap.ic_action_web_site, "Friends"),
  18. new LvMenuItem(R.mipmap.ic_action_web_site, "Discussion"),
  19. new LvMenuItem(),
  20. new LvMenuItem("Sub Items"),
  21. new LvMenuItem(R.mipmap.ic_action_web_site, "Sub Item 1"),
  22. new LvMenuItem(R.mipmap.ic_action_web_site, "Sub Item 2")
  23. ));
  24.  
  25. @Override
  26. public int getCount() {
  27. return mItems.size();
  28. }
  29.  
  30. @Override
  31. public Object getItem(int position) {
  32. return mItems.get(position);
  33. }
  34.  
  35. @Override
  36. public long getItemId(int position) {
  37. return position;
  38. }
  39.  
  40. @Override
  41. public int getViewTypeCount() {
  42. return 3;
  43. }
  44.  
  45. @Override
  46. public int getItemViewType(int position) {
  47. return mItems.get(position).type;
  48. }
  49.  
  50. @Override
  51. public View getView(int position, View convertView, ViewGroup parent) {
  52. LvMenuItem item = mItems.get(position);
  53. switch (item.type) {
  54. case LvMenuItem.TYPE_NORMAL:
  55. if (convertView == null) {
  56. convertView = mInflater.inflate(R.layout.design_drawer_item, parent,
  57. false);
  58. }
  59. TextView itemView = (TextView) convertView;
  60. itemView.setText(item.name);
  61. Drawable icon = mContext.getResources().getDrawable(item.icon);
  62. setIconColor(icon);
  63. if (icon != null) {
  64. icon.setBounds(0, 0, mIconSize, mIconSize);
  65. TextViewCompat.setCompoundDrawablesRelative(itemView, icon, null, null, null);
  66. }
  67.  
  68. break;
  69. case LvMenuItem.TYPE_NO_ICON:
  70. if (convertView == null) {
  71. convertView = mInflater.inflate(R.layout.design_drawer_item_subheader,
  72. parent, false);
  73. }
  74. TextView subHeader = (TextView) convertView;
  75. subHeader.setText(item.name);
  76. break;
  77. case LvMenuItem.TYPE_SEPARATOR:
  78. if (convertView == null) {
  79. convertView = mInflater.inflate(R.layout.design_drawer_item_separator,
  80. parent, false);
  81. }
  82. break;
  83. }
  84.  
  85. return convertView;
  86. }
  87.  
  88. public void setIconColor(Drawable icon) {
  89. int textColorSecondary = android.R.attr.textColorSecondary;
  90. TypedValue value = new TypedValue();
  91. if (!mContext.getTheme().resolveAttribute(textColorSecondary, value, true)) {
  92. return;
  93. }
  94. int baseColor = mContext.getResources().getColor(value.resourceId);
  95. icon.setColorFilter(baseColor, PorterDuff.Mode.MULTIPLY);
  96. }
  97. }

Item:

  1. public class LvMenuItem {
  2.  
  3. public LvMenuItem(int icon, String name) {
  4. this.icon = icon;
  5. this.name = name;
  6.  
  7. if (icon == NO_ICON && TextUtils.isEmpty(name)) {
  8. type = TYPE_SEPARATOR;
  9. } else if (icon == NO_ICON) {
  10. type = TYPE_NO_ICON;
  11. } else {
  12. type = TYPE_NORMAL;
  13. }
  14.  
  15. if (type != TYPE_SEPARATOR && TextUtils.isEmpty(name)) {
  16. throw new IllegalArgumentException("you need set a name for a non-SEPARATOR item");
  17. }
  18. }
  19.  
  20. public LvMenuItem(String name) {
  21. this(NO_ICON, name);
  22. }
  23.  
  24. public LvMenuItem() {
  25. this(null);
  26. }
  27.  
  28. public static final int NO_ICON = 0;
  29. public static final int TYPE_NORMAL = 0;
  30. public static final int TYPE_NO_ICON = 1;
  31. public static final int TYPE_SEPARATOR = 2;
  32.  
  33. public int type;
  34. public String name;
  35. public int icon;
  36. }

Item的资源文件:

design_drawer_item_separator:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="match_parent"
  4. android:layout_height="wrap_content">
  5.  
  6. <View android:layout_width="match_parent"
  7. android:layout_height="1dp"
  8. android:background="?android:attr/listDivider"/>
  9.  
  10. </FrameLayout>

design_drawer_item_subheader:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <TextView xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="match_parent"
  4. android:layout_height="?attr/listPreferredItemHeightSmall"
  5. android:gravity="center_vertical|start"
  6. android:maxLines="1"
  7. android:paddingLeft="?attr/listPreferredItemPaddingLeft"
  8. android:paddingRight="?attr/listPreferredItemPaddingRight"
  9. android:textAppearance="?attr/textAppearanceListItem"
  10. android:textColor="?android:textColorSecondary"/>

design_drawer_item:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <TextView
  3. xmlns:android="http://schemas.android.com/apk/res/android"
  4. android:layout_width="match_parent"
  5. android:layout_height="?attr/listPreferredItemHeightSmall"
  6. android:paddingLeft="?attr/listPreferredItemPaddingLeft"
  7. android:paddingRight="?attr/listPreferredItemPaddingRight"
  8. android:drawablePadding="32dp"
  9. android:gravity="center_vertical|start"
  10. android:maxLines="1"
  11. android:textAppearance="?attr/textAppearanceListItem"
  12. android:textColor="?android:attr/textColorPrimary"/>

参考资料:

http://www.2cto.com/kf/201506/409067.html

http://www.open-open.com/lib/view/open1433385856119.html#_label8

http://blog.csdn.net/lmj623565791/article/details/46405409

PS:为什么放多个drawer,而drawerLayout打开drawer的时候不会混乱呢?

没事就看看源码,反正又不要钱..

DrawerLayout、CoordinatorLayout、CollapsingToolbarLayout的使用--AndroidSupportDesign练手的更多相关文章

  1. Python学习路径及练手项目合集

    Python学习路径及练手项目合集 https://zhuanlan.zhihu.com/p/23561159

  2. Cocos2d-Lua (练手) 微信打飞机

    学习下lua,目前入门级,使用版本为 v3.3 Final For Win,空闲时间不足,只能断断续续写点东西.   一.子弹效果          子弹只做了一种,扇形发射,可以增加扇形大小,子弹的 ...

  3. web前端学习部落22群分享给需要前端练手项目

    前端学习还是很有趣的,可以较快的上手然后自己开发一些好玩的项目来练手,网上也可以一抓一大把关于前端开发的小项目,可是还是有新手在学习的时候不知道可以做什么,以及怎么做,因此,就整理了一些前端项目教程, ...

  4. webpack练手项目之easySlide(三):commonChunks(转)

    Hello,大家好. 在之前两篇文章中: webpack练手项目之easySlide(一):初探webpack webpack练手项目之easySlide(二):代码分割 与大家分享了webpack的 ...

  5. webpack练手项目之easySlide(二):代码分割(转)

    在上一篇 webpack练手项目之easySlide(一):初探webpack  中我们一起为大家介绍了webpack的基本用法,使用webpack对前端代码进行模块化打包. 但是乍一看webpack ...

  6. webpack练手项目之easySlide(一):初探webpack (转)

    最近在学习webpack,正好拿了之前做的一个小组件,图片轮播来做了下练手,让我们一起来初步感受下webpack的神奇魅力.     webpack是一个前端的打包管理工具,大家可以前往:http:/ ...

  7. JAVA大数类练手

    今天突然看到了OJ上的大数类题目,由于学习了一点大数类的知识.果断水了6道题......都是非常基础的.就当的练手的吧. 学到的只是一些大数类的基本操作.以后多做点这样的题,争取熟练运用水大数题... ...

  8. Python之路【第二十四篇】:Python学习路径及练手项目合集

      Python学习路径及练手项目合集 Wayne Shi· 2 个月前 参照:https://zhuanlan.zhihu.com/p/23561159 更多文章欢迎关注专栏:学习编程. 本系列Py ...

  9. node论坛练手

    当时学node,自己写了个论坛练手,现在看还是有很多问题,有时间好好改改 https://github.com/hitbs228/countdown

随机推荐

  1. jquery 学习笔记二 隐藏与显示

    css找到元素后是添加样式,而jquery找到元素后是添加形为. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...

  2. 关于webapp中的文字单位的一些捣腾

    前言 文字是网页内容的一枚大将,我们无时无刻都在看着它,只要是你盯屏幕上的任何一个地方都会有文字.地铁上无时无刻都在盯着屏幕上的人对于文字更为敏感,太大不行,太小TN又看不清上面到底在说什么,有时候车 ...

  3. Android 通知栏系列....

    转:http://blog.csdn.net/vipzjyno1/article/details/25248021 在android的应用层中,涉及到很多应用框架,例如:Service框架,Activ ...

  4. [原创]linux简单之美(三)

    原文链接:linux简单之美(三) 在linux简单之美(二)中我们尝试使用了C库的函数完成功能,那么能不能用syscall方式来搞呢?显然可以! section .data ft db sectio ...

  5. J2SE知识点摘记-数据库(一)

    一.          数据库连接 在JDBC的操作过程中,进行数据库连接的主要步骤如下: 通过Class.forName()加载数据库的驱动程序.首先需要利用来自Class类中的静态方法forNam ...

  6. C语言入门(2)——安装VS2013开发环境并编写第一个C语言程序

    在C语言入门系列中,我们使用Visual studio 2013 Professional作为开发工具.本篇详细介绍如何安装Visualstudio 2013 Professional并写出我们第一个 ...

  7. Android getReadableDatabase() 和 getWritableDatabase()

    Android使用getWritableDatabase()和getReadableDatabase()方法都可以获取一个用于操作数据库的SQLiteDatabase实例.(getReadableDa ...

  8. js快排与namespace

    function quickSort(arr){ if(arr.length<=1){ return arr; } var num = Math.floor(arr.length/2); var ...

  9. HTML系列(六):划分文档结构

    常见的网页结构布局是酱紫的,真是美美哒^O^: 一.添加基本标题h1~h6(没什么好说的): 二.标题分组hgroup <hgroup>用来将标题和子标题进行分组.如果一篇文章articl ...

  10. Dearmweaver CS6 如何添加emmet 插件

     一.关于emmet插件 已经接触前端工具的小伙伴们早听说过这个插件的鼎鼎大名了吧,emmet可以说是前端工程师的利器,就连老牌dreamweaver 都可以支持,我们怎么好意思拒绝这个好东西呢? 有 ...