android 主页布局和仿美团gridview轮播
作为一个老程序员,来说这个问题特别简单,估计也有好几种主页布局方式
今天有个美女实习生问我怎么写类似与美团首页的那个gridview轮播
犹豫是美女问问题,我当然的写个啦,所谓我就在晚上花了2个小时的时间做了个,
大家不要以为我那个啦,我们作为老程序员应该多多照顾一些新人,这样我们也能够学到很多东西,才能够共同进步。
首先先看图,到底是个什么样子,其实很简单
是不是很简单,下面就给大家实现的原理
1、使用的库为:
compile 'com.jakewharton:butterknife:7.0.1' compile 'com.afollestad.material-dialogs:core:0.9.0.2' compile 'com.afollestad.material-dialogs:commons:0.9.0.2'注解库和dialog库
主页 在此我使用的是注解的方式,至于为什么,大家应该都知道,节省时间吗
package com.wz.stat.demo; import android.app.FragmentManager; import android.app.FragmentTransaction; import android.graphics.drawable.Drawable; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.widget.FrameLayout; import android.widget.TextView; import com.wz.stat.demo.fragment.IndexFragment; import com.wz.stat.demo.fragment.MyFragment; import butterknife.Bind; import butterknife.ButterKnife; import butterknife.OnClick; /************************************************ * author: 火中燕. * email: wangzhong0116@foxmail.com. * version: 1.0.1. * date: 2016/12/9 20:17. * description: 主页 ***********************************************/ public class MainActivity extends AppCompatActivity{ //自定义标题栏 @Bind(R.id.txt_topbar) TextView txt_topbar; //底部选项卡按钮 @Bind(R.id.txt_home) TextView txt_home; @Bind(R.id.txt_my) TextView txt_my; //中央可切换视图 @Bind(R.id.ly_content) FrameLayout ly_content; //中央可切换视图 private IndexFragment indexFragment; private MyFragment myFragment; private FragmentManager fManager; private FragmentTransaction fTransaction; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ButterKnife.bind(this); fManager = getFragmentManager(); bindViews(); txt_home.performClick(); } //UI组件初始化与事件绑定 private void bindViews() { Drawable d_home = getResources().getDrawable(R.drawable.tab_menu_home); d_home.setBounds(0, 0, d_home.getMinimumWidth() - 10, d_home.getMinimumHeight() - 10); txt_home.setCompoundDrawables(null, d_home, null, null); Drawable d_my = getResources().getDrawable(R.drawable.tab_menu_my); d_my.setBounds(0, 0, d_my.getMinimumWidth() - 10, d_my.getMinimumHeight() - 10); txt_my.setCompoundDrawables(null, d_my, null, null); } //重置所有文本的选中状态 private void setSelected() { txt_home.setSelected(false); txt_my.setSelected(false); } //隐藏所有Fragment private void hideAllFragment(FragmentTransaction fragmentTransaction) { if (indexFragment != null) fragmentTransaction.hide(indexFragment); if (myFragment != null) fragmentTransaction.hide(myFragment); } @OnClick({R.id.txt_home, R.id.txt_my}) public void onClick(View v) { fTransaction = fManager.beginTransaction(); hideAllFragment(fTransaction); switch (v.getId()) { case R.id.txt_home: setSelected(); txt_home.setSelected(true); if (indexFragment == null) { indexFragment = new IndexFragment(); fTransaction.add(R.id.ly_content, indexFragment); } else { fTransaction.show(indexFragment); txt_topbar.setText("首页"); } break; case R.id.txt_my: setSelected(); txt_my.setSelected(true); if (myFragment == null) { myFragment = new MyFragment(); fTransaction.add(R.id.ly_content, myFragment); txt_topbar.setText("个人中心"); } else { fTransaction.show(myFragment); txt_topbar.setText("个人中心"); } break; } fTransaction.commit(); } }
3、当然了最主要的还是gridview轮播
其实很简单,主要是判断有几页,每页显示的数量,把他们展示到viewpager上
代码我就不一一贴了,我写了一个demo注释写的挺详细,为了给新人看吗,当然得写详细点
如果大家需要的话,直接去下载就行了
优快云下载地址: http://download.youkuaiyun.com/detail/mingzhnglei/9707088
github下载地址: https://github.com/rocky0116/my_station/tree/master
如果有什么问题大家也可以给我留言,请各位大神勿喷。