添加
android:flexbox的依赖
dependencies {
compile 'com.google.android:flexbox:0.3.2'
//引入RecyclerView
compile 'com.android.support:appcompat-v7:26.+'
compile 'com.android.support:design:26.+'
compile 'com.android.support:support-v4:26.+'
}
配置里面搭配main_activity.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler"
android:divider="#FFFF0000"
android:dividerHeight="10dp"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout >
image_item
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/image"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@mipmap/ic_launcher"
android:scaleType="centerCrop"/>
MainActivity
package yaoyao.flexboxdemo;
import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.RecyclerView;
import com.google.android.flexbox.AlignItems;
import com.google.android.flexbox.FlexDirection;
import com.google.android.flexbox.FlexWrap;
import com.google.android.flexbox.FlexboxLayoutManager;
import java.util.List;
import java.util.concurrent.CopyOnWriteArrayList;
public class MainActivity extends Activity {
private RecyclerView mRecyclerview;
private FlexboxLayoutManager manager;
private List<Integer> list = new CopyOnWriteArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
initView();
}
private void initData() {
// for (int i = 0; i < 255; i++) {
// list.add("https://unsplash.it/200/200?random&" + i);
// }
for (int i = 0; i < 5; i++) {
list.add(R.mipmap.timg);
list.add(R.mipmap.cat1);
list.add(R.mipmap.cat2);
list.add(R.mipmap.cat2);
list.add(R.mipmap.cat5);
list.add(R.mipmap.cat4);
list.add(R.mipmap.cat6);
list.add(R.mipmap.cat1);
list.add(R.mipmap.cat3);
list.add(R.mipmap.cat4);
list.add(R.mipmap.cat5);
list.add(R.mipmap.cat6);
list.add(R.mipmap.cat7);
list.add(R.mipmap.cat8);
list.add(R.mipmap.cat3);
list.add(R.mipmap.cat11);
list.add(R.mipmap.cat12);
list.add(R.mipmap.cat6);
list.add(R.mipmap.cat7);
list.add(R.mipmap.cat8);
list.add(R.mipmap.cat11);
list.add(R.mipmap.cat4);
list.add(R.mipmap.cat5);
list.add(R.mipmap.cat6);
list.add(R.mipmap.cat7);
list.add(R.mipmap.cat8);
list.add(R.mipmap.cat11);
list.add(R.mipmap.cat4);
list.add(R.mipmap.cat5);
list.add(R.mipmap.cat6);
list.add(R.mipmap.cat7);
list.add(R.mipmap.cat12);
}
}
private void initView() {
mRecyclerview = (RecyclerView) findViewById(R.id.recycler);
manager = new FlexboxLayoutManager(this);
//设置主轴排列方式
manager.setFlexDirection(FlexDirection.ROW);
//是否换行
manager.setFlexWrap(FlexWrap.WRAP);
//对齐方式
manager.setAlignItems(AlignItems.STRETCH);
mRecyclerview.setLayoutManager(manager);
mRecyclerview.setAdapter(new HomeAdapter(this, list));
}
}
HomeAdapter
package yaoyao.flexboxdemo;
import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import com.google.android.flexbox.FlexboxLayoutManager;
import java.util.List;
public class HomeAdapter extends RecyclerView.Adapter<HomeAdapter.ViewHolder> {
private Context mContext;
private List<Integer> mList;
private OnItemClickListener onItemClickListener;
public HomeAdapter(Context mContext, List<Integer> list) {
this.mContext = mContext;
this.mList = list;
}
public interface OnItemClickListener {
//点击轮播图
void OnSliderClick(int postion);
}
public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
this.onItemClickListener = onItemClickListener;
}
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(mContext).inflate(R.layout.image_item, parent, false);
return new ViewHolder(view);
}
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.mImage.setImageResource(mList.get(position));
ViewGroup.LayoutParams lp = holder.mImage.getLayoutParams();
if (lp instanceof FlexboxLayoutManager.LayoutParams) {
FlexboxLayoutManager.LayoutParams flexboxLp =
(FlexboxLayoutManager.LayoutParams) holder.mImage.getLayoutParams();
flexboxLp.setFlexGrow(1.0f);
}
}
@Override
public int getItemCount() {
return mList.size();
}
class ViewHolder extends RecyclerView.ViewHolder {
View view;
ImageView mImage;
ViewHolder(View view) {
super(view);
this.view = view;
this.mImage = (ImageView) view.findViewById(R.id.image);
}
}
}
主要注意
mRecyclerview = (RecyclerView) findViewById(R.id.recycler);
manager = new FlexboxLayoutManager(this);
//设置主轴排列方式
manager.setFlexDirection(FlexDirection.ROW);
//是否换行
manager.setFlexWrap(FlexWrap.WRAP);
//对齐方式
manager.setAlignItems(AlignItems.STRETCH);
mRecyclerview.setLayoutManager(manager);
mRecyclerview.setAdapter(new HomeAdapter(this, list));
holder.mImage.setImageResource(mList.get(position));
ViewGroup.LayoutParams lp = holder.mImage.getLayoutParams();
if (lp instanceof FlexboxLayoutManager.LayoutParams) {
FlexboxLayoutManager.LayoutParams flexboxLp =
(FlexboxLayoutManager.LayoutParams) holder.mImage.getLayoutParams();
flexboxLp.setFlexGrow(1.0f);
}
flexboxLp.setFlexGrow(1.0f); 弹性适配页面宽度
这两个地方就ok 可以用的
效果图