Skip to content

动态适应布局,流式布局。支持自动换行,设置子View对齐方式、排列方式等功能

Notifications You must be signed in to change notification settings

stars2011/DynamicViewGroup

Repository files navigation

动态适应布局,流式布局,支持以下功能:

1、自动换行。
2、设置横向/竖向排列子View。
3、设置子View的双端对齐,居中对齐,左对齐,右对齐,顶对齐,底对齐。
4、设置每行/列最大个数。
5、设置横向、竖向间距。


使用方式:

在项目的build.gradle中添加:

allprojects {
	repositories {
		...
		maven { url 'https://jitpack.io' }
	}
}

在module的build.gradle中添加:

dependencies {
	compile 'com.github.stars2011:DynamicViewGroup:v1.0.1'
}

DynamicViewGroup

1、自动换行

横/竖向排列子View的时候,当前行/列满了的话自动创建新的行/列排列子View。

横向排列自动换行:

横向排列自动换行

竖向排列自动换列:

竖向排列自动换列

2、设置横向/竖向排列子View

可以通过代码设置子View的排列方向:

    mDynamicViewGroup.setOrientation(DynamicViewGroup.HORIZONTAL); // 横向模式
    mDynamicViewGroup.setOrientation(DynamicViewGroup.VERTICAL); // 竖向模式

也可以通过xml的方式设置排列方向:

    <com.stars2011.dynamicviewgroup.DynamicViewGroup
     android:id="@+id/dynamic_view_group"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:orientation="horizontal/vertical"  设置横向/竖向

排列方式(horizontal/vertical)切换gif效果如下:

排列方式(horizontal/vertical)切换


横向排列:

横向排列

竖向排列:

竖向排列

3、设置子View的对齐方式

支持的对齐方式:

  • 双端对齐 (横、竖向排列均可使用)
  • 居中对齐 (横、竖向排列均可使用)
  • 左对齐 (仅横向排列使用)
  • 右对齐 (仅横向排列使用)
  • 顶对齐 (仅竖向排列使用)
  • 底对齐 (仅竖向排列使用)

可以通过代码设置对齐方式:

    mDynamicViewGroup.setGravity(DynamicViewGroup.GRAVITY_BOTH); // 双端对齐
    mDynamicViewGroup.setGravity(DynamicViewGroup.GRAVITY_CENTER); // 居中对齐        
    mDynamicViewGroup.setGravity(DynamicViewGroup.GRAVITY_LEFT); // 左对齐
    mDynamicViewGroup.setGravity(DynamicViewGroup.GRAVITY_RIGHT); // 右对齐
    mDynamicViewGroup.setGravity(DynamicViewGroup.GRAVITY_TOP); // 顶对齐
    mDynamicViewGroup.setGravity(DynamicViewGroup.GRAVITY_BOTTOM); // 底对齐

也可以通过xml的方式设置对齐方式:

    <com.stars2011.dynamicviewgroup.DynamicViewGroup
     android:id="@+id/dynamic_view_group"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:gravity="gravity_left" 设置左对齐

横向模式对齐方式(gravity)切换gif效果:

横向模式对齐方式(gravity)切换

竖向模式对齐方式(gravity)切换gif效果:

竖向模式对齐方式(gravity)切换


双端对齐
(1)横向排列的双端对齐:

enter image description here

(2)竖向排列的双端对齐:

enter image description here

居中对齐
(1)横向排列的居中对齐:

enter image description here

(2)竖向排列的居中对齐:

enter image description here

左对齐

enter image description here

右对齐

enter image description here

顶对齐

enter image description here

底对齐

enter image description here

4、设置每行/列最大个数(当每行/列子View个数超过设置的数值则自动换行/列)

可以通过代码设置每行/列最大个数:

    // 最大行数,当每列子View个数超过则自动换列(用于 竖向排列模式 模式)
    mDynamicViewGroup.setMaxLineNum(3); 
    // 最大列数,当每行子View个数超过则自动换行(用于 横向排列 模式)
    mDynamicViewGroup.setMaxColumnNum(3);

也可以通过xml设置每行/列最大个数:

    <com.stars2011.dynamicviewgroup.DynamicViewGroup
     android:id="@+id/dynamic_view_group"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:max_line_num="3"   设置最大行数(用于 竖向排列模式 模式)
     app:max_column_num="3" 设置最大列数(用于 横向排列 模式)

设置每行最大的子View个数gif效果(到达最大行个数换行):

设置每行最大的子View个数

设置每列最大的子View个数gif效果(到达最大列个数换列):

设置每列最大的子View个数


5、设置横向、竖向间距

可以通过代码设置横向/竖向间距:

    mDynamicViewGroup.setHorizontalSpacing(6); // 设置横向间距
    mDynamicViewGroup.setVerticalSpacing(6); // 设置竖向间距

也可以通过xml设置横向/竖向间距:

    <com.stars2011.dynamicviewgroup.DynamicViewGroup
     android:id="@+id/dynamic_view_group"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:horizontal_spacing="10dp" 设置横向间距
     app:vertical_spacing="10dp" 设置竖向间距

设置横向和竖向间距gif效果:

设置横向和竖向间距


使用示例:

1、xml配置示例:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context="com.stars2011.dynamicviewgroupdemo.SampleActivity">

    <com.stars2011.dynamicviewgroup.DynamicViewGroup
        android:id="@+id/dynamic_view_group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:orientation="horizontal"         排列方式
        app:gravity="gravity_left"           对齐方式
        app:max_column_num="3"               每行最多有多少列
        app:horizontal_spacing="10dp"        横向间距
        app:vertical_spacing="10dp">         竖向间距
        
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/view_background"
            android:padding="10dp"
            android:text="内容" />
            
    </com.stars2011.dynamicviewgroup.DynamicViewGroup>
    
</LinearLayout>

可配置的参数:

  • orientation (可选值:horizontal 、vertical)
  • gravity(可选值:gravity_left、gravity_right、gravity_center、gravity_top、gravity_bottom、gravity_both)
  • horizontal_spacing
  • vertical_spacing
  • max_line_num
  • max_column_num
2、代码配置示例:
    mDynamicViewGroup.setOrientation(DynamicViewGroup.HORIZONTAL); // 排列方式
    mDynamicViewGroup.setGravity(DynamicViewGroup.GRAVITY_LEFT); // 对齐方式
    mDynamicViewGroup.setMaxColumnNum(3); // 每行最多有多少列
    mDynamicViewGroup.setHorizontalSpacing(20); // 横向间距
    mDynamicViewGroup.setVerticalSpacing(20);  // 竖向间距

About

动态适应布局,流式布局。支持自动换行,设置子View对齐方式、排列方式等功能

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages