Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/lrh1993/autoflowlayout
自定义ViewGroup,实现多功能流式布局与网格布局
https://github.com/lrh1993/autoflowlayout
autolayout flowlayout gridlayout
Last synced: 5 days ago
JSON representation
自定义ViewGroup,实现多功能流式布局与网格布局
- Host: GitHub
- URL: https://github.com/lrh1993/autoflowlayout
- Owner: LRH1993
- Created: 2017-07-27T09:58:11.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2017-08-08T01:24:54.000Z (over 7 years ago)
- Last Synced: 2025-02-09T13:07:03.097Z (12 days ago)
- Topics: autolayout, flowlayout, gridlayout
- Language: Java
- Homepage: http://lruheng.com/2017/08/05/AutoFlowLayout-%E5%A4%9A%E5%8A%9F%E8%83%BD%E6%B5%81%E5%BC%8F%E5%B8%83%E5%B1%80%E4%B8%8E%E7%BD%91%E6%A0%BC%E5%B8%83%E5%B1%80%E6%8E%A7%E4%BB%B6/
- Size: 344 KB
- Stars: 667
- Watchers: 12
- Forks: 108
- Open Issues: 23
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# AutoFlowLayout
### 一、AutoFlowLayout应用场景
流式布局,在很多标签类的场景中可以用的;而网格布局在分类中以及自拍九宫格等场景很常见。如下所示:

如此使用频繁而又实现简单的控件,怎能不自己撸一个呢?控件,还是定制的好啊。
### 二、AutoFlowLayout实现效果
先介绍下自己撸的这个控件的功能及效果。
#### 1.功能
**流式布局**
- 自动换行
- 行数自定:单行/多行
- 支持单选/多选
- 支持行居中/靠左显示
- 支持添加/删除子View
- 支持子View点击/长按事件**网格布局**
- 行数/列数自定
- 支持单选/多选
- 支持添加/删除子View
- 支持子View点击/长按事件
- 支持添加多样式分割线及横竖间隔
#### 2.效果
下面以gif图的形式展现下实现的效果,样式简单了些,不过依然能展示出这个简单控件的多功能实用性。**流式布局**

**网格布局**

最后一个是带间隔以及分割线的,由于录屏原因,只在跳过去的一瞬间显示了粉红色的一条线。真实如下图所示,可以定义横竖间距的大小,以及分割线的颜色,宽度。

### 三、AutoFlowLayout使用
#### 1.添加依赖
①.在项目的 build.gradle 文件中添加
```
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
```
②.在 module 的 build.gradle 文件中添加依赖
```
dependencies {
compile 'com.github.LRH1993:AutoFlowLayout:1.0.5'
}
```
#### 2.属性说明
下表是自定义的属性说明,可在xml中声明,同时有对应的get/set方法,可在代码中动态添加。

#### 3.使用示例
**布局**
```
```
**代码设置数据**
```
mFlowLayout.setAdapter(new FlowAdapter(Arrays.asList(mData)) {
@Override
public View getView(int position) {
View item = mLayoutInflater.inflate(R.layout.special_item, null);
TextView tvAttrTag = (TextView) item.findViewById(R.id.tv_attr_tag);
tvAttrTag.setText(mData[position]);
return item;
}
});
```
与ListView,GridView使用方式一样,实现FlowAdapter即可。