现在各种app中经常有兴趣爱好关注的效果,先贴张图看看效果:
咱一看到图就想到了强大的RecyclerView
1.用RecyclerView的多布局实现如图效果:就得根据position判断条目加载不同的布局,这有点麻烦
2在RecyclerView的单布局在Item中就将布局都不好 今天就记录下这种实现方法
详细代码如下:
1.MainActivity中
public class MainActivity extends AppCompatActivity {
private RecyclerView recy;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
recy = (RecyclerView) findViewById(R.id.recy);
recy.setLayoutManager(new LinearLayoutManager(this));
FragmentManager supportFragmentManager = getSupportFragmentManager();
List<String> nia = new ArrayList<>();//添加数据
nia.add("初一");
nia.add("初二");
nia.add("n年纪");
MyAdapter adapter = new MyAdapter(nia, this, supportFragmentManager);
recy.setAdapter(adapter);
}
}
MainActivity.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
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/recy"
android:layout_width="match_parent"
android:layout_height="match_parent"></android.support.v7.widget.RecyclerView>
</RelativeLayout>
2.MainActivity的适配器 MyAdapter
public class MyAdapter extends RecyclerView.Adapter<MyAdapter.Holder> {
private List<String> list;
private Context context;
FragmentManager supportFragmentManager;
public MyAdapter(List<String> list, Context context, FragmentManager supportFragmentManager) {
this.list = list;
this.context = context;
this.supportFragmentManager = supportFragmentManager;
}
@NonNull
@Override
public Holder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
return new Holder(LayoutInflater.from(context).inflate(R.layout.item, null));
}
@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN_MR1)
@Override
public void onBindViewHolder(@NonNull Holder holder, int position) {
holder.niaji.setText(list.get(position));
List<Fragment> fragments=new ArrayList<>();
fragments.add(new ONeFragment());
fragments.add(new ONeFragment());
fragments.add(new ONeFragment());
fragments.add(new ONeFragment());
List<String> title=new ArrayList<>();
title.add("1班");
title.add("2班");
title.add("3班");
title.add("4班");
holder.viewpager.setId(View.generateViewId());//获取动态id
// holder.viewpager.setId(position+1);//获取id
holder.tab.setupWithViewPager(holder.viewpager);
holder.viewpager.setAdapter(new VpAdapter(supportFragmentManager,fragments,title));
}
@Override
public int getItemCount() {
return list.size();
}
class Holder extends RecyclerView.ViewHolder {
public TextView niaji;
public TabLayout tab;
public ViewPager viewpager;
public Holder(View itemView) {
super(itemView);
niaji = (TextView) itemView.findViewById(R.id.niaji);
tab = (TabLayout) itemView.findViewById(R.id.tab);
viewpager = (ViewPager) itemView.findViewById(R.id.viewpager);
}
}
}
适配器 MyAdapter的xml布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_marginTop="5dp"
android:id="@+id/niaji"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="初一"></TextView>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tab"
android:layout_toRightOf="@+id/niaji"
></android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:layout_marginLeft="40dp"
android:layout_width="match_parent"
android:layout_height="400dp"
android:id="@+id/viewpager"
android:layout_below="@+id/tab"
></android.support.v4.view.ViewPager>
</RelativeLayout>
3.OneFragment
public class ONeFragment extends Fragment {
// TODO: Rename parameter arguments, choose names that match
// the fragment initialization parameters, e.g. ARG_ITEM_NUMBER
private static final String ARG_PARAM1 = "param1";
private static final String ARG_PARAM2 = "param2";
// TODO: Rename and change types of parameters
private String mParam1;
private String mParam2;
private RecyclerView fragment_recy;
public ONeFragment() {
// Required empty public constructor
}
/**
* Use this factory method to create a new instance of
* this fragment using the provided parameters.
*
* @param param1 Parameter 1.
* @param param2 Parameter 2.
* @return A new instance of fragment ONeFragment.
*/
// TODO: Rename and change types and number of parameters
public static ONeFragment newInstance(String param1, String param2) {
ONeFragment fragment = new ONeFragment();
Bundle args = new Bundle();
args.putString(ARG_PARAM1, param1);
args.putString(ARG_PARAM2, param2);
fragment.setArguments(args);
return fragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (getArguments() != null) {
mParam1 = getArguments().getString(ARG_PARAM1);
mParam2 = getArguments().getString(ARG_PARAM2);
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View inflate = inflater.inflate(R.layout.fragment_one, container, false);
initView(inflate);
initData();
return inflate;
}
private void initData() {
final List<Bean> list = new ArrayList<>();
for (int i = 0; i < 10; i++) {
list.add(new Bean("天王盖地虎,小鸡炖蘑菇" + i));
}
final MyAdapter1 adapter1 = new MyAdapter1(list);
fragment_recy.setAdapter(adapter1);
adapter1.setOnItemClickListener(new BaseQuickAdapter.OnItemClickListener() {
@Override
public void onItemClick(BaseQuickAdapter adapter, View view, int position) {
Bean bean = list.get(position);
bean.setSelect(!bean.isSelect());
adapter1.notifyDataSetChanged();
}
});
}
private void initView(View inflate) {
fragment_recy = (RecyclerView) inflate.findViewById(R.id.fragment_recy);
fragment_recy.setLayoutManager(new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL));
}
}
onefragment的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=".ONeFragment">
<android.support.v7.widget.RecyclerView
android:id="@+id/fragment_recy"
android:layout_width="match_parent"
android:layout_height="wrap_content"></android.support.v7.widget.RecyclerView>
</RelativeLayout>
4.onefragment中recyclerview的适配器(此处用的万能适配器)
package com.example.chooseclassdemo;
import android.support.annotation.Nullable;
import android.widget.RelativeLayout;
import com.chad.library.adapter.base.BaseQuickAdapter;
import com.chad.library.adapter.base.BaseViewHolder;
import java.util.List;
public class MyAdapter1 extends BaseQuickAdapter<Bean,BaseViewHolder> {
public MyAdapter1( @Nullable List<Bean> data) {
super(R.layout.item1, data);
}
@Override
protected void convert(BaseViewHolder helper, Bean item) {
helper.setText(R.id.textView,item.getName());
RelativeLayout item_rela = helper.getView(R.id.item_rela);
if (item.isSelect()){
item_rela.setBackgroundResource(R.drawable.shapes2);
}else {
item_rela.setBackgroundResource(R.drawable.shape);
}
}
}
万能适配的xml布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="@+id/item_rela"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp">
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_centerVertical="true"
android:layout_marginLeft="@dimen/dp_10"
android:layout_marginTop="@dimen/dp_10"
android:text="TextView" />
</RelativeLayout>
5.接下就Bean对象
package com.example.chooseclassdemo;
public class Bean {
private String name;
public Bean(String name, boolean isSelect) {
this.name = name;
this.isSelect = false;
}
private boolean isSelect;
public boolean isSelect() {
return isSelect;
}
public void setSelect(boolean select) {
isSelect = select;
}
public Bean() {
}
public Bean(String name) {
this.name = name;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
6.Viewpager+Tablayout的适配器
public class VpAdapter extends FragmentStatePagerAdapter {
private List<Fragment> fragments;
private List<String> title;
public VpAdapter(FragmentManager fm, List<Fragment> fragments, List<String> title) {
super(fm);
this.fragments = fragments;
this.title = title;
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public int getCount() {
return fragments.size();
}
@Nullable
@Override
public CharSequence getPageTitle(int position) {
return title.get(position);
}
}
7.选中和未选中的xml
shape.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp"></corners>
<stroke
android:width="1dp"
android:color="#ea00ff99"></stroke>
</shape>
shapes2.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp"></corners>
<stroke android:color="#ea6dae94" android:width="2dp"></stroke>
<solid android:color="#ea6dae94"></solid>
</shape>
就此上图效果就完成了