前言: 最近项目中用到类似的功能,在这里记录一下,以免忘记重新书写,也希望大神们指点不足的地方
效果图
>
废话不多说 先上代码
主页面
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f5f5f5"
android:orientation="vertical"
tools:context="wynne.groupselect.MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#ffffff">
<FrameLayout
android:id="@+id/list"
android:layout_width="wrap_content"
android:layout_height="match_parent">
<ImageView
android:id="@+id/searchView"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center_vertical"
android:layout_marginStart="10dp"
android:src="@drawable/search"/>
<android.support.v7.widget.RecyclerView
android:layout_gravity="center_vertical"
android:id="@+id/ry_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</FrameLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginStart="5dp"
android:layout_toRightOf="@+id/list"
android:text="@string/search"
android:textColor="@color/black"
android:textSize="17sp"/>
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="@string/title"
android:textSize="16sp"/>
<ListView
android:id="@+id/lv_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="@color/line_color"
android:dividerHeight="0.5dp"
android:footerDividersEnabled="false"/>
</LinearLayout>
主要代码
public class MainActivity extends AppCompatActivity implements AdapterView.OnItemClickListener {
private RecyclerView mRecy;
private ListView mListView;
private List<SimulationData> mList;
private List<SimulationData> mRlist;
private SimulationData mData;
private Adapter mListAdapter;
private MyRecycleAdapter mAdapter;
private ImageView mImageView;
private LinearLayoutManager mLayoutManager;
private SimulationData[] date = {new SimulationData("狒狒", R.drawable.icon4),
new SimulationData("骚猪", R.drawable.icon1),
new SimulationData("蠢驴", R.drawable.icon2),
new SimulationData("油子", R.drawable.icon3),
new SimulationData("Android", R.drawable.android),
new SimulationData("IOS", R.drawable.ios),
new SimulationData("HTML", R.drawable.htlm),
new SimulationData("机器人1号", R.drawable.icon1),
new SimulationData("机器人2号", R.drawable.icon2),
new SimulationData("机器人3号", R.drawable.icon3),
new SimulationData("机器人4号", R.drawable.icon4),
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
initView();
}
private void initData() {
mList = getDate();
mRlist = new ArrayList<>();
mRecy = (RecyclerView) findViewById(R.id.ry_list);
mListView = (ListView) findViewById(R.id.lv_list);
mImageView = (ImageView) findViewById(R.id.searchView);
mLayoutManager = new LinearLayoutManager(this);
mAdapter = new MyRecycleAdapter(mRlist, this);
mListAdapter = new Adapter(mList, this);
}
private void initView() {
mLayoutManager.setOrientation(HORIZONTAL);
mRecy.setLayoutManager(mLayoutManager);
mRecy.setAdapter(mAdapter);
mListView.setAdapter(mListAdapter);
mListView.setOnItemClickListener(this);
}
public List<SimulationData> getDate() {
List<SimulationData> mlist = new ArrayList<>();
for (int i = 0; i < date.length; i++) {
mlist.add(date[i]);
}
return mlist;
}
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
if (!mRlist.contains(mList.get(position))) {
mRlist.add(mList.get(position));
mImageView.setVisibility(View.GONE);
mAdapter.notifyDataSetChanged();
} else {
mRlist.remove(mList.get(position));
mAdapter.notifyDataSetChanged();
}
if (mRlist.size() == 0) {
mImageView.setVisibility(View.VISIBLE);
}
}
}
实现原理:
其实从效果图就可以看出,就是2个列表,下面的列表点中,上面就增加一个,这里上面使用的是RecyclerView,下面使用的是Listview,因为RecyclerView相对Listview实现横向列表更简单,但是RecyclerView并没有提供item点击事件,要自己写回调接口,这里我嫌麻烦就使用了2个列表 (其实就是懒 QvQ)
上面代码最重要的方法就是点击事件,当点击下面的item时我们获取到点击的position 通过list.get(position)就能获取到实体类中存的图片和名字,然后 在添加到上面的列表的集合中,在刷新列表就可以实现功能