Android屏幕适配(三)--自定义View实现百分比布局适配
程序员文章站
2024-02-05 23:33:40
...
在Android屏幕适配中百分比布局适配是一种很好的解决方案。
Android其实提供了百分比适配布局,使用方法如下:(这不是今天所说的重点,重点在后边)
一:先添加依赖
dependencies {
implementation 'com.android.support:percent:27.0.2'
····
}
二:使用下面两种布局
PercentRelativeLayout
PercentFrameLayout
三:主要属性
app:layout_heightPercent:用百分比表示高度
app:layout_widthPercent:用百分比表示宽度
app:layout_marginPercent:用百分比表示View之间的间隔
app:layout_marginLeftPercent:用百分比表示左边间隔
app:layout_marginRight:用百分比表示右边间隔
app:layout_marginTopPercent:用百分比表示顶部间隔
app:layout_marginBottomPercent:用百分比表示底部间隔
app:layout_marginStartPercent:用百分比表示距离第一个View之间的距离
app:layout_marginEndPercent:用百分比表示距离最后一个View之间的距离
app:layout_aspectRatio:用百分比表示View的宽高比
今日重点
如果你不想添加上面的依赖包,毕竟添加依赖会增加app的体积,而且想用百分比布局的话。不妨自己手写一个百分比布局。
实现原理:
一、自定义属性来设置view的宽、高、边距、等百分比属性,
二、根据父容器的宽高与设置的百分比属性来计算出子view 的宽高。
开撸代码:
**第一步:**自定义view–自定义属性
在values下新建attrs.xml文件,代码如下:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="PercentLayout">
<attr name="widthPercent" format="float"/>
<attr name="heightPercent" format="float"/>
<attr name="marginLeftPercent" format="float"/>
<attr name="marginRightPercent" format="float"/>
<attr name="marginTopPercent" format="float"/>
<attr name="marginBottomPercent" format="float"/>
</declare-styleable>
</resources>
**第二步:**新建一个类PercentLayout继承RelativeLayout,代码如下:
/**
* 自定义View
* 百分比布局
*/
public class PercentLayout extends RelativeLayout {
public PercentLayout(Context context) {
super(context);
}
public PercentLayout(Context context, AttributeSet attrs) {
super(context, attrs);
}
public PercentLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//获取父容器的尺寸
int widthSize = MeasureSpec.getSize(widthMeasureSpec);
int heightSize = MeasureSpec.getSize(heightMeasureSpec);
int count = getChildCount();
for (int i =0;i < count ; i ++){
View child = getChildAt(i);
ViewGroup.LayoutParams params = child.getLayoutParams();
//如果说是百分比布局属性
if (checkLayoutParams(params)){
LayoutParams lp = (LayoutParams) params;
float widthPercent = lp.widthPercent;
float heightPercent = lp.heightPercent;
float marginLeftPercent = lp.marginLeftPercent;
float marginRightPercent = lp.marginRightPercent;
float marginTopPercent = lp.marginTopPercent;
float marginBottomPercent = lp.marginBottomPercent;
if (widthPercent > 0){
params.width = (int) (widthSize * widthPercent);
}
if (widthPercent > 0){
params.height = (int) (heightSize * heightPercent);
}
if (widthPercent > 0){
((LayoutParams) params).leftMargin = (int) (widthSize * marginLeftPercent);
}
if (widthPercent > 0){
((LayoutParams) params).rightMargin = (int) (widthSize * marginRightPercent);
}
if (widthPercent > 0){
((LayoutParams) params).topMargin = (int) (heightSize * marginTopPercent);
}
if (widthPercent > 0){
((LayoutParams) params).bottomMargin = (int) (heightSize * marginBottomPercent);
}
}
}
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
public LayoutParams generateLayoutParams(AttributeSet attrs) {
return new LayoutParams(getContext(), attrs);
}
public static class LayoutParams extends RelativeLayout.LayoutParams{
private float widthPercent;
private float heightPercent;
private float marginLeftPercent;
private float marginRightPercent;
private float marginTopPercent;
private float marginBottomPercent;
public LayoutParams(Context c, AttributeSet attrs) {
super(c, attrs);
//解析自定义属性
TypedArray a = c.obtainStyledAttributes(attrs,R.styleable.PercentLayout);
widthPercent = a.getFloat(R.styleable.PercentLayout_widthPercent,0);
heightPercent = a.getFloat(R.styleable.PercentLayout_heightPercent,0);
marginLeftPercent = a.getFloat(R.styleable.PercentLayout_marginLeftPercent,0);
marginRightPercent = a.getFloat(R.styleable.PercentLayout_marginRightPercent,0);
marginTopPercent = a.getFloat(R.styleable.PercentLayout_marginTopPercent,0);
marginBottomPercent = a.getFloat(R.styleable.PercentLayout_marginBottomPercent,0);
a.recycle();
}
}
}
**第三步:**布局中如何使用?代码如下:
<?xml version="1.0" encoding="utf-8"?>
<com.yulore.screenadapterdemo.PercentLayout 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"
tools:context=".MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="设置宽50%高50%"
app:widthPercent = "0.5"
android:background="@color/colorPrimary"
app:heightPercent = "0.5"/>
</com.yulore.screenadapterdemo.PercentLayout>
效果如下:
上一篇: AccesS密码的打击