How to customize the ViewGroup multi-row and multi-column effect by Android
This article mainly introduces "Android how to customize ViewGroup multi-row and multi-column effect". In daily operation, I believe that many people have doubts about how to customize ViewGroup multi-row and multi-column effect in Android. Xiaobian consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful for you to answer the question of "Android how to customize ViewGroup multi-row and multi-column effect". Next, please follow the editor to study!
Take a look at the effect picture first.
Two children per row
One child per line
Realization idea
Custom viewGroup to achieve measurement and layout, make controls adapt to business scenarios.
Measure
Each child is equally allocated a fixed width according to the width of the parent control. Height is the number of rows multiplied by the height of a child, plus the height of the gap.
Count rows according to the number of children
Val rows = if (childCount% perLineChild = = 0) {childCount / perLineChild} else {childCount / perLineChild + 1}
Code example
Override fun onMeasure (widthMeasureSpec: Int, heightMeasureSpec: Int) {val width = MeasureSpec.getSize (widthMeasureSpec) for (I in 0 until childCount) {val child: View = getChildAt (I) if (child.visibility! = GONE) {val lp = child.layoutParams val childWidthMeasureSpec = getChildMeasureSpec (widthMeasureSpec, 0 (width-(perLineChild-1) * space) / perLineChild) val childHeightMeasureSpec = getChildMeasureSpec (heightMeasureSpec, 0, lp.height) child.measure (childWidthMeasureSpec ChildHeightMeasureSpec)} val rows = if (childCount% perLineChild = = 0) {childCount / perLineChild} else {childCount / perLineChild + 1} if (childCount > 0) {setMeasuredDimension (width) GetChildAt (0) .measuredHeight * rows + (rows-1) * space)}}
Overall Arrangement
It is necessary to pay attention to the order and position of placement, with a fixed number per row, and a new line to continue placement after reaching the number.
Code example
Override fun onLayout (changed: Boolean, l: Int, t: Int, r: Int, b: Int) {var left = l var top = t children.forEachIndexed {index View-> if (index% perLineChild = = 0) {left = 0 if (index! = 0) {top+= view.measuredHeight top+=space} view.layout (left, top, view.measuredWidth + left, top+ view.measuredHeight)} else {view.layout (left, top) View.measuredWidth + left, top + view.measuredHeight)} left + = view.measuredWidth left + = space}}
Complete code
Class MultiLineViewG @ JvmOverloads constructor (context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0): ViewGroup (context, attrs, defStyleAttr) {var perLineChild = 2 / * the gap between children * / var space = 10 override fun onMeasure (widthMeasureSpec: Int HeightMeasureSpec: Int) {val width = MeasureSpec.getSize (widthMeasureSpec) for (I in 0 until childCount) {val child: View = getChildAt (I) if (child.visibility! = GONE) {val lp = child.layoutParams val childWidthMeasureSpec = getChildMeasureSpec (widthMeasureSpec, 0) (width-(perLineChild-1) * space) / perLineChild) val childHeightMeasureSpec = getChildMeasureSpec (heightMeasureSpec, 0, lp.height) child.measure (childWidthMeasureSpec ChildHeightMeasureSpec)} val rows = if (childCount% perLineChild = = 0) {childCount / perLineChild} else {childCount / perLineChild + 1} if (childCount > 0) {setMeasuredDimension (width) GetChildAt (0). MeasuredHeight * rows + (rows-1) * space)}} override fun onLayout (changed: Boolean, l: Int, t: Int, r: Int, b: Int) {var left = l var top = t children.forEachIndexed {index View-> if (index% perLineChild = = 0) {left = 0 if (index! = 0) {top+= view.measuredHeight top+=space} view.layout (left, top, view.measuredWidth + left, top+ view.measuredHeight)} else {view.layout (left, top) View.measuredWidth + left, top + view.measuredHeight)} left + = view.measuredWidth left + = space} so far On the "Android how to customize ViewGroup multi-row and multi-column effect" study is over, I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!
