Android 百分比布局详解及实例代码

Android 百分比布局

1.引入:compile 'com.android.support:percent:24.0.0'

2.点开源码可以看到,主要有两个布局类PercentFrameLayout和PercentRelativeLayout,一个工具类PercentLayoutHelper。

3.点开布局类比如PercentRelativeLayout的源码,可以看到实现的很简单。

public class PercentRelativeLayout extends RelativeLayout { private final PercentLayoutHelper mHelper = new PercentLayoutHelper(this); /**省略若干行构造方法之类的代码**/ @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { //重点在这 mHelper.adjustChildren(widthMeasureSpec, heightMeasureSpec); super.onMeasure(widthMeasureSpec, heightMeasureSpec); if (mHelper.handleMeasuredStateTooSmall()) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); } } @Override protected void onLayout(boolean changed, int left, int top, int right, int bottom) { super.onLayout(changed, left, top, right, bottom); mHelper.restoreOriginalParams(); } public static class LayoutParams extends RelativeLayout.LayoutParams implements PercentLayoutHelper.PercentLayoutParams { private PercentLayoutHelper.PercentLayoutInfo mPercentLayoutInfo; public LayoutParams(Context c, AttributeSet attrs) { super(c, attrs); mPercentLayoutInfo = PercentLayoutHelper.getPercentLayoutInfo(c, attrs); } /**省略若干行构造方法之类的代码**/ @Override public PercentLayoutHelper.PercentLayoutInfo getPercentLayoutInfo() { if (mPercentLayoutInfo == null) { mPercentLayoutInfo = new PercentLayoutHelper.PercentLayoutInfo(); } return mPercentLayoutInfo; } @Override protected void setBaseAttributes(TypedArray a, int widthAttr, int heightAttr) { PercentLayoutHelper.fetchWidthAndHeight(this, a, widthAttr, heightAttr); } } }

就是在onMeasure和onLayout里面调用了PercentLayoutHelper 的一些方法,另外在里面定义了自己的LayoutParams ,而这个LayoutParams 也相当简单。

这里关键的一行代码是在onMeasure方法里面,mHelper.adjustChildren(widthMeasureSpec, heightMeasureSpec);通过PercentLayoutHelper 的adjustChildren 遍历子view来设置 子view的宽高,宽高在PercentLayoutHelper 的内部类PercentLayoutInfo通过在布局文件中设置的值计算好了。

public void adjustChildren(int widthMeasureSpec, int heightMeasureSpec) { // Calculate available space, accounting for host's paddings int widthHint = View.MeasureSpec.getSize(widthMeasureSpec) - mHost.getPaddingLeft() - mHost.getPaddingRight(); int heightHint = View.MeasureSpec.getSize(heightMeasureSpec) - mHost.getPaddingTop() - mHost.getPaddingBottom(); for (int i = 0, N = mHost.getChildCount(); i < N; i++) { //遍历子view来设置 子view的宽高 View view = mHost.getChildAt(i); ViewGroup.LayoutParams params = view.getLayoutParams(); if (DEBUG) { Log.d(TAG, "should adjust " + view + " " + params); } if (params instanceof PercentLayoutParams) { PercentLayoutInfo info = ((PercentLayoutParams) params).getPercentLayoutInfo(); if (info != null) { if (params instanceof ViewGroup.MarginLayoutParams) { info.fillMarginLayoutParams(view, (ViewGroup.MarginLayoutParams) params, widthHint, heightHint); } else { info.fillLayoutParams(params, widthHint, heightHint); } } } } }

4.布局中的使用方法:以PercentRelativeLayout为例

<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/background_color" > <TextView android:id="@+id/mian_tab_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:textColor="@color/back_green" android:textSize="15sp" android:text="name" /> <ImageView app:layout_widthPercent="50%" app:layout_heightPercent="50%" android:src="@drawable/ic_launcher_icon" android:scaleType="fitXY" android:layout_below="@+id/mian_tab_name" android:background="@color/black" /> </android.support.percent.PercentRelativeLayout>

引入xmlns:app的命名空间,然后app:layout_widthPercent="50%"就可以设置宽高的百分比了。相当简单 。

5.不过在使用的过程中,可能会有一些其他的需求,比如app:layout_widthPercent="50%",app:layout_heightPercent="50%"都是相对于屏幕的宽高的,假如要显示一张正方形的图片,以宽的50%为准呢?这个时候就可以这样写了:

<ImageView app:layout_widthPercent="50%" app:layout_aspectRatio="100%" android:src="@drawable/ic_launcher_icon" android:scaleType="fitXY" android:layout_below="@+id/mian_tab_name" android:background="@color/CS_black" />

使用layout_aspectRatio属性,设置app:layout_aspectRatio="100%",layout_aspectRatio就是宽高比。这个时候就不要设置app:layout_heightPercent属性了。在PercentLayoutHelper 里面, 源代码如下:

public void fillLayoutParams(ViewGroup.LayoutParams params, int widthHint, int heightHint) { // Preserve the original layout params, so we can restore them after the measure step. mPreservedParams.width = params.width; mPreservedParams.height = params.height; // We assume that width/height set to 0 means that value was unset. This might not // necessarily be true, as the user might explicitly set it to 0. However, we use this // information only for the aspect ratio. If the user set the aspect ratio attribute, // it means they accept or soon discover that it will be disregarded. final boolean widthNotSet = (mPreservedParams.mIsWidthComputedFromAspectRatio || mPreservedParams.width == 0) && (widthPercent < 0); final boolean heightNotSet = (mPreservedParams.mIsHeightComputedFromAspectRatio || mPreservedParams.height == 0) && (heightPercent < 0); if (widthPercent >= 0) { params.width = (int) (widthHint * widthPercent); } if (heightPercent >= 0) { params.height = (int) (heightHint * heightPercent); } //这一段代码是关键,如果aspectRatio >=0,aspectRatio是宽高比 if (aspectRatio >= 0) { if (widthNotSet) { //如果宽没有设置,就以高为准 params.width = (int) (params.height * aspectRatio); // Keep track that we've filled the width based on the height and aspect ratio. mPreservedParams.mIsWidthComputedFromAspectRatio = true; } if (heightNotSet) { //如果高没有设置,就以宽为准 params.height = (int) (params.width / aspectRatio); // Keep track that we've filled the height based on the width and aspect ratio. mPreservedParams.mIsHeightComputedFromAspectRatio = true; } } if (DEBUG) { Log.d(TAG, "after fillLayoutParams: (" + params.width + ", " + params.height + ")"); } }

6.另外,假如我们要定义自己的PercentLinearLayout,基本可以直接改一下名字,继承自LinearLayout就好了:public class PercentLinearLayout extends LinearLayout ,在仿照PercentRelativeLayout里面的LayoutParams定义一个自己的LayoutParams就好了。

不过官方为什么没有直接提供一个PercentLinearLayout 类,而只提供了两个PercentFrameLayout和PercentRelativeLayout呢?或许是由于LinearLayout 本身就有权重属性,自带百分比效果了。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

时间: 2024-10-24 22:03:23

Android 百分比布局详解及实例代码的相关文章

Android LayoutInflater加载布局详解及实例代码

Android  LayoutInflater加载布局详解 对于有一定Android开发经验的同学来说,一定使用过LayoutInflater.inflater()来加载布局文件,但并不一定去深究过它的原理,比如 1.LayoutInflater为什么可以加载layout文件? 2.加载layout文件之后,又是怎么变成供我们使用的View的? 3.我们定义View的时候,如果需要在布局中使用,则必须实现带AttributeSet参数的构造方法,这又是为什么呢? 既然在这篇文章提出来,那说明这三

Android GPS定位详解及实例代码_Android

      GPS定位是智能手机上一个比较有意思的功能,LBS等服务都有效的利用了GPS定位功能.本文就跟大家分享下Android开发中的GPS定位知识.        一.Android基础知识准备        1.Activity类        每一种移动开发环境都有自己的基类.如J2ME应用程序的基类是midlets,BREW的基类是applets,而Android程序的基类是Activity.这个activity为我们提供了对移动操作系统的基本功能和事件的访问.这个类包含了基本的构造

android 通知Notification详解及实例代码

android Notification实例详解 1.使用Builder模式来创建 2.必须要设置一个smallIcon,还可以设置setTicker 3.可以设置 setContentTitle,setContentInfo,setContentText,setWhen 4.可以设置setDefaults(闪屏,声音,震动),通过Notification设置flags(能不能被清除) 5.发送需要获取一个NotificationManager(getSystemService来获取);noti

Android 文件选择器详解及实例代码_Android

     本文给大家讲解下Android文件选择器的使用.实际上就是获取用户在SD卡中选择的文件或文件夹的路径,这很像C#中的OpenFileDialog控件.        此实例的实现过程很简单,这样可以让大家快速的熟悉Android文件选择器,提高开发效率.        网上曾经见到过一个关于文件选择器的实例,很多人都看过,本实例是根据它修改而成的,但更容易理解,效率也更高,另外,本实例有自己的特点:        1.监听了用户按下Back键的事件,使其返回上一层目录.       

Android语音识别技术详解及实例代码_Android

   今天从网上找了个例子实现了语音识别,个人感觉挺好玩的,就把代码贴出来与大家分享下:          Android中主要通过RecognizerIntent来实现语音识别,其实代码比较简单,但是如果找不到设置,就会抛出异常ActivityNotFoundException,所以我们需要捕捉这个异常.而且语音识别在模拟器上是无法测试的,因为语音识别是访问google云端数据,所以如果手机的网络没有开启,就无法实现识别声音的!一定要开启手机的网络,如果手机不存在语音识别功能的话,也是无法启用

Android ListView position详解及实例代码_Android

我们在使用ListView的时候,一般都会为ListView添加一个响应事件android.widget.AdapterView.OnItemClickListener.对OnItemClickListener的position和id参数,我相信有些人在这上面走了些弯路.     在使用listview的时候,我们经常会在listview的监听事件中,例如OnItemClickListener(onItemClick)中,或listview的adapter中(getView.getItem.ge

Android 图片选择详解及实例代码

Android 图片选择 可以达到的效果: 1.第一个图片的位置放照相机,点击打开照相机 2.其余的是显示全部存储的图片,点击一次是查看大图,长按则是每张图片出现一个checkBox,可以进行选择 下面是实例效果图 MainActivity 类 public class MainActivity extends AppCompatActivity implements AdapterView.OnItemClickListener, AdapterView.OnItemLongClickList

Android ListView position详解及实例代码

我们在使用ListView的时候,一般都会为ListView添加一个响应事件android.widget.AdapterView.OnItemClickListener.对OnItemClickListener的position和id参数,我相信有些人在这上面走了些弯路. 在使用listview的时候,我们经常会在listview的监听事件中,例如OnItemClickListener(onItemClick)中,或listview的adapter中(getView.getItem.getIte

Android 消息机制详解及实例代码

Android 消息机制 1.概述 Android应用启动时,会默认有一个主线程(UI线程),在这个线程中会关联一个消息队列(MessageQueue),所有的操作都会被封装成消息队列然后交给主线程处理.为了保证主线程不会退出,会将消息队列的操作放在一个死循环中,程序就相当于一直执行死循环,每循环一次,从其内部的消息队列中取出一个消息,然后回调相应的消息处理函数(handlerMessage),执行完成一个消息后则继续循环,若消息队列为空,线程则会阻塞等待.因此不会退出.如下图所示: Handl