nex3z / flowlayout

A flow layout for Android with auto-spacing.

FlowLayout

A FlowLayout for Android, which allows child views flow to next row when there is no enough space. The spacing between child views can be calculated by the FlowLayout so that the views are evenly placed.

Gradle

AndroidX:

implementation 'com.nex3z:flow-layout:1.3.3'

AppCompact:

implementation 'com.nex3z:flow-layout:1.2.4'

Usage

<com.nex3z.flowlayout.FlowLayout
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:flChildSpacing="auto"
    app:flChildSpacingForLastRow="align"
    app:flRowSpacing="8dp">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="SUN"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MON"/>

    <!--...-->

</com.nex3z.flowlayout.FlowLayout>

Attributes

Attribute	Format	Description
flFlow	boolean	true to allow flow. false to restrict all child views in one row. The default is true.
flChildSpacing	auto/dimension	The horizontal spacing between child views. Either auto, or a fixed size. The default is 0dp.
flChildSpacingForLastRow	auto/align/ dimension	The horizontal spacing between child views of the last row. Either auto, align or a fixed size. If not set, childSpacing will be used instead.
flRowSpacing	auto/dimension	The vertical spacing between rows. Either auto, or a fixed size. The default is 0dp.
flRtl	boolean	true to layout child views from right to left. false to layout from left to right. The default is false.
flMaxRows	integer	The maximum height of FlowLayout in terms of number of rows.

auto means that the actual spacing is calculated as per the size of the FlowLayout and the number of child views (or rows), so that the child views (or rows) are placed evenly.

align in childSpacingForLastRow means that the horizontal spacing of the child views in the last row keeps the same with the spacing used in the row above. If there is only one row in FlowLayout and the childSpacingForLastRow is set to align, this value is ignored and the actual spacing is calculated using childSpacing.

Licence

Copyright 2016 nex3z

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

flowlayout's Issues

Horizontal scroll view with Flow Layout

Hi, is it possible to add horizontal scroll view to flow layout with two rows?
Because right now, If you add Horizontal Scroll View for flow layout, there will be only one row and scroll. Is it possible to make two rows?

change flChildSpacing progamatically

Hi, how to change params programmatically. like flChildSpacing

How is this different from FlexBoxLayout?

flChildSpacing and flRowSpacing fix value can not preview but run ok

Flow layout has very nice!
the preview about spacing fix value may be better!

thanks to author

流式标签

flChildSpacing child spacing seems not to work

<com.nex3z.flowlayout.FlowLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:flChildSpacing="auto"
app:flChildSpacingForLastRow="align"
app:flRowSpacing="8dp"
>

I set up like this but when I set the flChildSpacing to a certain value, it seems to just then cram the view all together

Adding views programmatically?

Hello, I want to add multiple text views to flow layout progmmatically. How to do so? I am unable to add views using addView() method. Please help.

Showing JavaCompile Error while building app

WARNING: API 'variant.getJavaCompile()' is obsolete and has been replaced with 'variant.getJavaCompileProvider()'.
It will be removed at the end of 2019.
For more information, see https://d.android.com/r/tools/task-configuration-avoidance.
To determine what is calling variant.getJavaCompile(), use -Pandroid.debug.obsoleteApi=true on the command line to display a stack trace.
Affected Modules: flowlayout

There are many items.

Hello
How are you doing?
I added many items so it doesn't show something.
I need scroll till the end of items.
Please fix this problem.
Best Regards.

当我滑动很长的Flowlayout时，上方view底部会有重影

onlayout在存在隐藏的子元素的时候计算错误

不能再for循环后直接i++，因为如果遇到隐藏的子元素了，就跳过了，如果i++了，就这一行也会少显示一个元素，这是不对的，应该在最后成功了才i++
for (int i = 0; i < childNumInRow; ) {
View child = getChildAt(childIdx++);
if (child.getVisibility() == GONE) {
continue;
}
XXXXXX
XXXXXX
//可以显示的才算这一行的元素，成功以后才i++
i++;
}

RTL Programmatically

Why is not there setRtl true or false setter programatically? I want to set it according to language, but cannot set it. Is there any way?

RTL cutting layout

I did flowLayout.isRtl = true and I got 1.png attached layout

Then I gave margin to flowlayout and used the below mentioned code
flowLayout.isRtl = true val layoutParams = flowLayout.layoutParams as ViewGroup.MarginLayoutParams layoutParams.marginStart = CommonMethods.dpToPx(context!!, 40) flowLayout.layoutParams = layoutParams
and the output I got 2.png attached layout

It is cutting from the right side

在RecyclerView中 不能显示

自己写了个Demo，可以正常显示的，在RecyclerView的adapter中动态添加TextView 不能显示，将FlowLayout更换为LinearLayout，TextView能够显示。

Add maxline

It's nice,but my requirement is to show only two lines and than add show more button.so is there is a way to get number of lines.

Don't layout and render cut off items in single row

Currently with a single row and e.g. 10 children, it's possible to have just 4 items visible, fifth item visible partially and the rest hidden. One obvious use case for this behavior is with a scroll view, but I'd like to only show the fully visible items, and just drop the rest.

Is it possible that such behavior is added to the library (I can try to contribute) or maybe it's possible with the existing API? I'd like to avoid measuring the items myself (since then they'd be measured twice, by me and by the flow layout) is possible

flMinChildSpacing问题

flMinChildSpacing现在只支持xml形式的设置,没有直接用java代码设置的地方,不是很方便,希望能够增加set方法,谢谢

Publish to mavenCentral

Bintray is getting shut down in 3 months, and right now FlowLayout is only available on jcenter.

See https://jfrog.com/blog/into-the-sunset-bintray-jcenter-gocenter-and-chartcenter/ for details

flChildSpacing为auto时左右间距为0的问题

问题:
如果flChildSpacing设置为auto时,一行内的标签刚好和总宽度相等话,这时每个标签之间的间距就是0,看起来很不雅观.
建议:
建议在auto的情况下允许设置minSpace,这样不管任何情况两个tag之间都有一个设置的最小间距.
谢谢作者的劳动

FlowLayout children overdraw themselves

Version 1.3.2 introducs a bug when FlowLayout is being reused i.e. on Recycleview.

On first layout it properly draws its children:

but when the screen is scrolled and the container is reused its starts drawing over its children (or draws children that shouldn't be drawn?):

That is how the view looks like without app:flMaxRows="1":

FlowLayout setup:

<com.nex3z.flowlayout.FlowLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:flChildSpacing="4dp"
    app:flMaxRows="1"
    app:flRowSpacing="4dp"
    ><!-- children --> </com.nex3z.flowlayout.FlowLayout>

Is it possible to use as a Radio Group?

I am using this layout for checkboxes. But I also want to use it as a radio group. Since the built in radio group can only be used as horizontally and vertically, so using this layout as a radio group would solve many issues I guess

setMaxRows and gravity don't seem to be working

When I setMaxRows to 5 (or anything else) in onCreate, the layout simply ignores it and keeps adding views. Also when I set gravity to center, it instead treats it like center_vertical.

The weird part is the first 3 to 4 times I used it, it worked perfectly fine but now all of a sudden I keep on encountering these weird issues.

app_name overwrites default app name value

Thanks for creating this library! It's very useful. I have one minor quarrel with it, however.

Using the "app_name" field for your library is somewhat dangerous. If other apps include your library and use "app_name" for their own strings, the string from this library might collide. This results in seeing "FlowLayout" on the launcher screen, which is not desired.

I'd strongly suggest either renaming the "app_name" string to something else, and consider prefixing your resources. (See https://medium.com/@maxirosson/how-to-improve-your-android-library-2e8b9fd6c090 for some additional context here)

Can we have the option to center all bubbles horizontal?

We can see all bubbles are left-aligned. Is there any option we can let all bubbles center or right-aligned? Thanks.

Missing scrollview when flMaxRows is set (improvement)

When I set the flMaxRows property (EG 2), doesn't display all items on the FlowLayout, you could add an horizontal/vertical scroll as improvement

excellent work!

Is it possible to have the last item fill the rest of the row?

Hi, im working on chips view with edittext, and I want the last view (edit text) to have always width of the remaning space in the row (+ obviously if content is bigger than put it on next row)

Is this possible?

Drag and Sort feature request

Hi, Could you add drag and sort feature to the library, please? It would really help me with a project. I need to use flow layout and sort thing when user long press one of the items.
Thank you very much!

how could i know if i'd stop calling addView() when flMaxRows is set?

hi,

we'd not know how many children could be displayed in the layout if flMaxRows is set.

so how could i know if i'd stop calling addView()?

many thanks.

How to center align the views inside

getRowCount

Hi, i need a function to get the rows count,
i added it by customizing your class in my project, but i think its better to add it on this repo,
also i can send a merge request to add it if you haven't enough time.

Is there a way to set layout's gravity?

The question is in the title pretty much. I would like to set vertical gravity to center, but I am not sure if that's possible.

feature request with multiple tags selected

flChildSpacingForLastRow is useless

The tag flChildSpacingForLastRow="align" is useless when there only one line and app:flChildSpacing="auto".

Overflow items?

Hi,
If there are more items after second row, is there a easy to indicate that there are more items to list (just like ellipsize)?

..

确保RecyclerView水平加入item

请问如何确保RecyclerView水平加入Itemview

Get row count

It's nice lib.but I want to know there is a way to show only two row with show more.
For this i need row count but i am always getting row count 1.

Not able to center align elements if 2 rows have different number of views.

I am trying to center align the elements in each row but always getting left or right alignment.

I have 5 rows with 14 elements, First row seems fine but issues are with the other rows in the layout.

Either the elements of bottom rows are aligned such that left and right items are at extreme left and right places simultaneously (if child spacing is "auto").
Or all the elements of particular row are shifted to the left (or right) aligned sequence (if child spacing is defined: lets say 10dp).

I need these items to be placed in center when I define the child spacing.

Please give a solution on this.

Not be able to set Vertical Orientation for this Flow Layout

@nex3z

I am using your flow layout to display content in my app. However it is working as intended but what i want is right now the flow is by default in Horizontal orientation displayed.

What if i want it in Vertical Orientation i am not be able to identify how can i do it ?

Any help will be appreciated.

Update lib

Please update lib version to latest commit, so i can add it my project as gradle implementation and no a module.

Children still laid out even when outside flMaxRows

With the following setup:

<com.nex3z.flowlayout.FlowLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:flChildSpacing="4dp"
    app:flMaxRows="1"
    app:flRowSpacing="4dp"
    ><!-- children --> </com.nex3z.flowlayout.FlowLayout>

when the children would normally extend to second and further rows, then even though only the first row is drawn, the second row is still laid out and extends outside the FlowLayout. That is, FlowLayout's height is only big enough to fit the first row, but the second row items still appear in the hierarchy outside of that area. This is usually not an issue, unless the parent layout declares clipChildren="false" somwhere, in which case the second row will start rendering and probably overlapping some other views.

Here with the above setup I have the FlowLayout bounds highlighted:

as you can see, some children are laid out outside of it:

Main Layout view disappears

When Iam add the Flowlayout into my layout then the preview in the split or the design mode disapears

Iam adding this way

<com.nex3z.flowlayout.FlowLayout
android:id="@+id/flowLaySKUs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
app:flChildSpacing="2dp"
app:flRowSpacing="2dp" />

Gradle sysnc errors

my develoption environment is “Android Studio：3.0 ；Gradle：4.1” ,when i import this project ,it displays this problem ,as follows:
"Error:Unable to load class 'org.gradle.api.internal.component.Usage'.
Possible causes for this unexpected error include:

• Gradle's dependency cache may be corrupt (this sometimes occurs after a network connection timeout.)
  Re-download dependencies and sync project (requires network)
• The state of a Gradle build process (daemon) may be corrupt. Stopping all Gradle daemons may solve this problem.
  Stop Gradle build processes (requires restart)
• Your project may be using a third-party plugin which is not compatible with the other plugins in the project or the version of Gradle requested by the project.

In the case of corrupt Gradle processes, you can also try closing the IDE and then killing all Java processes."