Android进阶教程之ViewGroup自定义布局

发布时间:2019-08-08 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了Android进阶教程之ViewGroup自定义布局脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

前言

在我们的实际应用中, 经常需要用到自定义控件,比如自定义头像,自定义计步器等等。但有时我们不仅需要自定义控件,举个例子,FloatingActionButton 大家都很常用,所以大家也很经常会有一种需求,点击某个 FloatingActionButton 弹出更多 FloatingActionButton ,这个需求的一般思路是写 n 个 button 然后再一个个的去设置动画效果。但这实在是太麻烦了,所以网上有个 FloatingActionButtonMenu 这个开库,这就是利用到了自定义布局 「ViewGroup」,现在就让我给他家介绍下,如何自定义布局 「layout」。

Android进阶教程之ViewGroup自定义布局

难点

相比于自定义 View ,自定义 ViewGroup 的难点在于,子控件位置的确定和布局大小的确定。不像 单个 View 子要花粉好模式,测量好度就搞定了,ViewGroup 的长宽根据子 View 的数量和单个的大小变化而变化。这就是最大的坎,所以该如何确定 ViewGroup 的大小呢?

步骤

这里 我为大家设计一个 类似 LinearLayout 线性布局的 ViewGroup 作为范例。

首先,如果是一个 LinearLayout 那么当设置 wrap_content 时,他就会以子空间中最宽的那个为它的宽度。同时在高度方面会是所有子控件高度的总和。所以我们先写两个方法,分别用于测量 ViewGroup 的宽度和高度。

  PRivate int getMaxWidth(){   int count = getChildCount();   int maxWidth = 0;   for (int i = 0 ; i < count ; i ++){    int currentWidth = getChildAt(i).getMeasuredWidth();    if (maxWidth < currentWidth){     maxWidth = currentWidth;    }   }   return maxWidth;  }    private int gettotalHeight(){   int count = getChildCount();   int totalHeight = 0;   for (int i = 0 ; i < count ; i++){    totalHeight += getChildAt(i).getMeasuredHeight();   }   return totalHeight;  }

对于 ViewGroup 而言我们可以粗略的分为两种模式:固定长宽模式(match_parent),自适应模式(wrap_content),根据这两种模式,就可以对 ViewGroup 的绘制进行划分。这里关于 measureChildren 这个方法,他是用于将所有的子 View 进行测量,这会触发每个子 View 的 onMeasure 函数,但是大家要注意要与 measureChild 区分,measureChild 是对单个 view 进行测量

  @override  protected void onMeasure(int widthMeasureSPEc, int heightMeasureSpec) {   super.onMeasure(widthMeasureSpec, heightMeasureSpec);     measureChildren(widthMeasureSpec, heightMeasureSpec);     int widthMode = MeasureSpec.getMode(widthMeasureSpec);   int width  = MeasureSpec.getSize(widthMeasureSpec);   int heightMode= MeasureSpec.getMode(heightMeasureSpec);   int height = MeasureSpec.getSize(heightMeasureSpec);     if (widthMode == MeasureSpec.AT_MOST && heightMode == MeasureSpec.AT_MOST){    int groupWidth = getMaxWidth();    int groupHeight= getTotalHeight();      setMeasuredDimension(groupWidth, groupHeight);   }else if (widthMode == MeasureSpec.AT_MOST){    setMeasuredDimension(getMaxWidth(), height);   }else if (heightMode == MeasureSpec.AT_MOST){    setMeasuredDimension(width, getTotalHeight());   }  }

重写 onLayout

整完上面这些东西,我们的布局大小七十九已经出来了,然我们在活动的布局文件里面加上它,并添加上几个子 View 然后运行一下,先看看效果:

  <com.entry.andROId_view_user_defined_First.views.MyLinearLayout   android:layout_width="wrap_content"   android:layout_height="wrap_content"   android:background="@color/colorAccent">     <Button    android:layout_width="100dp"    android:layout_height="50dp"    android:text="qwe"/>     <Button    android:layout_width="250dp"    android:layout_height="150dp"    android:text="qwe"/>     <Button    android:layout_width="200dp"    android:layout_height="75dp"    android:text="qwe"/>    </com.entry.android_view_user_defined_first.views.MyLinearLayout>

运行效果如下:

Android进阶教程之ViewGroup自定义布局

我们看见布局出来了,大小好像也没啥问题,但是子 View 呢??! 这么没看见子 View 在看看代码,系统之前然我们重写的 onLayout() 还是空着的呀!!也就是说,子 View 的大小和位置根本就还没有进行过设定!让我们来重写下 onLayout() 方法。

  @Override  protected void onLayout(boolean changed, int l, int t, int r, int b) {   int count = getChildCount();   int currentHeight = 0;   for (int i = 0 ; i < count ; i++){    View view = getChildAt(i);    int height = view.getMeasuredHeight();    int width = view.getMeasuredWidth();    view.layout(l, currentHeight, l + width, currentHeight + height);    currentHeight += height;   }  }

再运行一下看看:

Android进阶教程之ViewGroup自定义布局

成功了有木有!

总结

android教程
脚本网站
android studio

脚本宝典总结

以上是脚本宝典为你收集整理的Android进阶教程之ViewGroup自定义布局全部内容,希望文章能够帮你解决Android进阶教程之ViewGroup自定义布局所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。