FlexboxLayout使用指南
16lz
2021-01-23
添加
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"?>
image_item
<?xml version="1.0" encoding="utf-8"?>
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 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 { private Context mContext; private List mList; private OnItemClickListener onItemClickListener; public HomeAdapter(Context mContext, List 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 可以用的
效果图
更多相关文章
- CollapsingToolbarLayout标准使用方式
- Android 退出程序方式——再按一次退出
- android 使用post方式上传文件
- android 判断耳机是否插入的几种方式
- Android之ShortCut[setResult方式]
- Android共有五种布局方式
- Android中使用PULL方式解析XML文件深入介绍