程序猿学习优秀案例Android

FlowLayout流式布局实现标签、类似热门搜索这种效果

2016-09-25  本文已影响8368人  八怪不姓丑

本文所使用的FlowLayout来自于鸿洋大神的框架。
正好现在在做项目需要用到。自己试着用了下,具体可以看效果图
鸿洋的github:https://github.com/hongyangAndroid/FlowLayout

gif.gif

android Studio中注入依赖:

compile 'com.zhy:flowlayout-lib:1.0.3'

布局文件:
zhy:max_select=设置可选中的tag数量。
zhy:max_select="-1" 不限制。
zhy:max_select="5"限制可选中5个标签。适合文章发布选择标签开发。
auto_select_effect="true | false"设置点击效果,默认显示


<com.zhy.view.flowlayout.TagFlowLayout
            android:layout_marginTop="@dimen/dp_15"
            android:id="@+id/search_page_flowlayout"
            zhy:max_select="-1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

标签TextView及风格的设置:

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/flowlayout_tv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:background="@drawable/flowlayout_shap"
    android:text="Helloworld"
    android:textColor="@color/black">
</TextView>

这里TextView用到了shap风格:
color 选中标签颜色
blackground | drawable 已选中背景。这里我引用了一个shape风格
state_checked 是否显示选中状态效果。
blackground | drawable 未选中背景。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/theme"
        android:drawable="@drawable/button_shape"
        android:state_checked="true"></item>
    <item android:drawable="@drawable/bg_black_shape"></item>
</selector>

数据源:

 final LayoutInflater mInflater = LayoutInflater.from(SearchPageActivity.this);
        search_page_flowlayout.setAdapter(new TagAdapter<String>(mVals)
        {
            @Override
            public View getView(FlowLayout parent, int position, String s)
            {
                TextView tv = (TextView) mInflater.inflate(R.layout.search_page_flowlayout_tv,
                        search_page_flowlayout, false);
                tv.setText(s);
                return tv;
            }
        });

监听标签点击事件:

  search_page_flowlayout.setOnTagClickListener(new TagFlowLayout.OnTagClickListener()
        {
            @Override
            public boolean onTagClick(View view, int position, FlowLayout parent)
            {
                Toast.makeText(SearchPageActivity.this, mVals[position], Toast.LENGTH_SHORT).show();
                //view.setVisibility(View.GONE);
                return true;
            }
        });

设置监听事件的回调:

search_page_flowlayout.setOnSelectListener(new TagFlowLayout.OnSelectListener()
        {
            @Override
            public void onSelected(Set<Integer> selectPosSet)
            {
                SearchPageActivity.this.setTitle("choose:" + selectPosSet.toString());
            }
        });

新手上路!欢迎指导!
以后经常会在简书,csdn更新自己开发过程中遇到的问题,和一些好用的框架。
包括一些互联网的经验分享,欢迎同行交流
源码:https://github.com/wapchief/android-CollectionDemo

上一篇下一篇

猜你喜欢

热点阅读