混合布局的实现方法

有的时候在应用中，我们可能需要两种不同的布局，比如上面是GridView，下面是ListView的样式；

在上一篇的 RecyclerView:实现带header的grid中，提供了一种方法，但是这种方法并不够好用，非常之不建议使用。仅仅作为了解ViewType的用法。
今天介绍一种比较合理的方式来实现这个需求，需要用到的就是RecyclerView的header。

在RecyclerView添加Header的正确方式中，简单介绍了header的使用方式，遗憾的是里面header仅仅添加了一张图片。那么我们在此基础上对其进行扩展，让header添加一个gridView。

1.自定义GridView

首先我们需要自定义一个GridView，将它封装成一个布局，供我们使用：

CustomGridView.java

public class CustomGridView extends GridView implements AdapterView.OnItemClickListener {
    private Listener mListener;

    public CustomGridView(Context context) {
        super(context);
    }

    public CustomGridView(Context context, AttributeSet attrs) {
        super(context, attrs);
        setOnItemClickListener(this);
    }

    public CustomGridView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
        if (mListener != null) {
            mListener.onClick(i,adapterView);
        }
    }

    public void setListener(Listener l){
        mListener = l;
    }
    public interface Listener{
        void onClick(int position, AdapterView<?> adapterView);
    }
/*
 * 重写onMeasure()方法，解决<gridView>布局文件中layout_height="wrap_content"时，第二列显示不完全的情况
 */
    public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int expandSpec = MeasureSpec.makeMeasureSpec(
                Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
        super.onMeasure(widthMeasureSpec, expandSpec);
    }
}

扩展GridView并实现OnItemClickListener，以便我们可以在每个Item上进行点击;

 public class MyCustomGridView extends GridView implements OnItemClickListener

当我们在xml布局文件中使用View时，会在inflate布局时调用这个构造函数 。

public MyCustomGridView（Context context，AttributeSet attrs）{...}

创建一个监听器接口，供我们在其他类中使用

public interface Listener {void onClick（int position）; }

单击Item时将会调用的函数（implements OnItemClickListener）

public void onItemClick（AdapterView parent，View v，int position，long id）{

从使用我们的监听器接口的实例调用我们的onClick函数

if（mListener！= null）{mListener.onClick（position）; }

2.布局文件

我们用自定义View创建头布局文件，

head_grid_layout.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <com.example.administration.custom.CustomGridView
        android:id="@+id/customGrid"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:cacheColorHint="#00000000"
        android:listSelector="@android:color/transparent"
        android:gravity="center"
        android:numColumns="4"
        android:columnWidth="160px">
    </com.example.administration.custom.CustomGridView>

    <View
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="#000000"/>

</LinearLayout>

主界面布局文件，

activity_main.xml:

 <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
        </android.support.v7.widget.RecyclerView>

gridView中Item的布局：

grid_item.xml:

<ImageView
        android:id="@+id/icon_application_top"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="10dp"
        android:paddingBottom="5dp"
        android:gravity="center"
        android:includeFontPadding="false"
        android:layout_centerHorizontal="true"
        android:src="@mipmap/ic_launcher"
        />

    <TextView
        android:id="@+id/text_application_bottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:gravity="center"
        android:singleLine="true"
        android:includeFontPadding="false"
        android:ellipsize="none"
        android:text="超期"
        />

3.适配器

我们还需要一个adapter来为GridView填充数据。

ImageAdapter.java

public class ImageAdapter extends BaseAdapter {
    private LayoutInflater mInflater;
    private List<ApplicationModel> applicationModels;
    private Context mContext;

    public ImageAdapter(Context context, List<ApplicationModel> list) {
        this.mContext = context;
        this.applicationModels = list;
        // mInflater =(LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        mInflater = LayoutInflater.from(mContext);
    }

    @Override
    public int getCount() {
        return applicationModels.size();
    }

    @Override
    public Object getItem(int i) {
        return i;
    }

    @Override
    public long getItemId(int i) {
        return i;
    }

    @Override
    public View getView(int i, View view, ViewGroup viewGroup) {
        ViewHoler viewHolder;

        if (view == null) {
            viewHolder = new ViewHoler();
            view = mInflater.inflate(R.layout.grid_item, viewGroup, false);
            viewHolder.mImageView = (ImageView) view.findViewById(R.id.icon_application_top);
            viewHolder.mTextView = (TextView) view.findViewById(R.id.text_application_bottom);

            view.setLayoutParams(new GridView.LayoutParams(120,120));
            view.setPadding(5, 5, 5, 5);
            view.setTag(viewHolder);
        } else {
            viewHolder = (ViewHoler) view.getTag();
        }

        viewHolder.mTextView.setText(applicationModels.get(i).getName());
        viewHolder.mImageView.setImageResource(applicationModels.get(i).getDrawableResId());
        return view;
    }

    private class ViewHoler {
        private ImageView mImageView;
        private TextView mTextView;
    }
}

BaseRecyclerAdapter.java是上篇中所封装过的文件，就不贴出来了；

RecyclerView的监听器，

MyAdapter.java

 private class MyAdapter extends BaseRecycylerAdapter<String>{
        private Context mContext;
        private LayoutInflater mInflater;

        public MyAdapter(Context context) {
            this.mContext = context;
        }

        @Override
        public int getItems() {
            return list.size();
        }

        @Override
        public RecyclerView.ViewHolder onCreate(ViewGroup parent, int viewType) {
            View view = null;
            mInflater = LayoutInflater.from(parent.getContext());
            view = mInflater.inflate(R.layout.item,parent,false);
            return new MyHolder(view);
        }

        @Override
        public void bindViewHolder(RecyclerView.ViewHolder parent, String s, int position) {
            if(parent instanceof MyHolder){
                ((MyHolder) parent).mTextView.setText(s);
            }

        }


        private class MyHolder extends RecyclerView.ViewHolder {
            private TextView mTextView;
            public MyHolder(View view) {
                super(view);
                mTextView = (TextView) view.findViewById(R.id.text);
            }
        }

    }

4.MainActivity.java

public class MainActivity extends AppCompatActivity {
    private RecyclerView recyclerView;//列表
    private MyAdapter mAdapter;//适配器

    private ArrayList<String> list = new ArrayList<>();//recyceler列表
    private RecyclerView.LayoutManager mLayoutManager;//列表布局管理器

    private int[] images = new int[]{R.mipmap.app_icon_err,R.mipmap.ic_launcher,R.mipmap.app_icon_err,R.mipmap.ic_launcher};
    List<ApplicationModel> applicationModels = new ArrayList<>();//grid列表

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initData();

        mAdapter = new MyAdapter(this);
        mAdapter.addData(list);
        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
        mLayoutManager = getLayoutManager();
        recyclerView.setLayoutManager(mLayoutManager);
        recyclerView.setAdapter(mAdapter);
        setFooter(recyclerView);
        setHeader(recyclerView);

        mAdapter.setOnItemClickListener(new BaseRecycylerAdapter.OnItemClickListener() {
            @Override
            public void onItemClick(int position, Object data, RecyclerView.ViewHolder holder) {
                if(position==mAdapter.getItems()-1){
                    Toast.makeText(MainActivity.this, "last one",Toast.LENGTH_SHORT).show();
                }
                else if(position==0){
                    Toast.makeText(MainActivity.this, "first one",Toast.LENGTH_SHORT).show();
                }
                else{
                    Toast.makeText(MainActivity.this, (String) data,Toast.LENGTH_SHORT).show();
                }

            }
        });

    }

    private void setFooter(RecyclerView recyclerView) {
        View footer = LayoutInflater.from(this).inflate(R.layout.foot_layout, recyclerView, false);

        footer.findViewById(R.id.icon).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this, "footer click",Toast.LENGTH_SHORT).show();
            }
        });
        mAdapter.addFootView(footer);
    }

//    private void setHeader(RecyclerView recyclerView) {
//        View header = LayoutInflater.from(this).inflate(R.layout.head_layout, recyclerView, false);
//
//
//        header.findViewById(R.id.image).setOnClickListener(new View.OnClickListener() {
//            @Override
//            public void onClick(View view) {
//                Toast.makeText(MainActivity.this, "header click",Toast.LENGTH_SHORT).show();
//            }
//        });
//        mAdapter.addHeadView(header);
//    }


//添加头布局
    private void setHeader(RecyclerView recyclerView) {
        View header = LayoutInflater.from(this).inflate(R.layout.head_grid_layout,recyclerView,false);
        CustomGridView customGridView = (CustomGridView) header.findViewById(R.id.customGrid);
       customGridView.setListener(new ItemListener());
        customGridView.setAdapter(new ImageAdapter(this,applicationModels));

        mAdapter.addHeadView(header);
    }

    private RecyclerView.LayoutManager getLayoutManager() {
        //GridLayoutManager manager = new GridLayoutManager(this,4);
        LinearLayoutManager manager = new LinearLayoutManager(this);
        return manager;
    }

    private void initData() {
        for(int i=0;i<97;i++){
            list.add("#name "+i);
        }

        ApplicationModel model1 = new ApplicationModel(R.mipmap.application_business_btn,"商机");
        applicationModels.add(model1);
        ApplicationModel model2 = new ApplicationModel(R.mipmap.application_calendar_btn,"日程");
        applicationModels.add(model2);
        ApplicationModel model3 = new ApplicationModel(R.mipmap.application_customer_btn,"客户");
        applicationModels.add(model3);
        ApplicationModel model4 = new ApplicationModel(R.mipmap.application_business_btn,"商机");
        applicationModels.add(model4);
        ApplicationModel model5 = new ApplicationModel(R.mipmap.application_calendar_btn,"日程");
        applicationModels.add(model5);
        ApplicationModel model6 = new ApplicationModel(R.mipmap.application_customer_btn,"客户");
        applicationModels.add(model6);
        ApplicationModel model7 = new ApplicationModel(R.mipmap.application_business_btn,"商机");
        applicationModels.add(model7);
        ApplicationModel model8 = new ApplicationModel(R.mipmap.application_calendar_btn,"日程");
        applicationModels.add(model8);
    }

private class ItemListener implements CustomGridView.Listener{

        @Override
        public void onClick(int position, AdapterView<?> adapterView) {
            if(position==adapterView.getCount()-1){
                Toast.makeText(MainActivity.this,"last one",Toast.LENGTH_SHORT).show();
            }
            Toast.makeText(MainActivity.this,"application",Toast.LENGTH_SHORT).show();
        }
    }

}

在这里我们得到CustomGridView，

MyCustomGridView mGrid =（MyCustomGridView）findViewById（R.id.my_custom_grid_view）;

创建一个使用MyCustomGridView中创建的侦听器接口的类

private class ItemListener implements MyCustomGridView.Listener{ ... }

设置ItemListener类的一个实例

mGrid.setListener（new ItemListener（））;

到这里就实现了我们的效果。如下图：