说明:本方案可以适配绝大部分普通手机屏、pad屏、折叠屏等
一:长度单位的使用
1:全局使用dimens,包括字号大小、控件长宽等,严禁直接使用dp、sp、px进行设置
2:代码中需要动态获取长度的时候,使用 SizeUtils 工具类,如有不足可以在此工具类内部进行完善,严禁自己创建工具类
3:全局使用deimens,可以避免因为手机系统设置大字号对APP产生的影响
二:具体控件适配示例
![](https://img.haomeiwen.com/i9084896/c9fb2e08cd762505.png)
说明1:红框代表手机屏幕
说明2:轮播图代表需要跟手机屏幕宽度保持一致的轮播图之类的布局,这里以轮播图为例
说明3:瀑布流卡片代表列数 >= 2 的情况下的布局,比如瀑布流、金刚区(一行显示五列)等
1:轮播图类:
a:因为宽度要跟屏幕宽度一致,因此宽度设置为match_parent,xml布局中的高度可以暂时设置为设计稿中的高度,比如dimen_100;
b:轮播图加载的都是图片,因此整体的宽高比是固定的,比如宽高比为351 :94,因此需要在代码中按照实际宽度动态设置高度;
c:b中的实际宽度为:屏幕宽度 - 轮播图距离屏幕左右间距的和
d:如果这里对高度没要求,也不涉及到图片变形之类的问题,那么高度直接设置成warp_content即可;
2:瀑布流类:
a:瀑布流类的适配主要在于宽度适配,xml中宽度可以先随便设置一下来进行开发时的实时预览,比如dimen_175,具体宽度需要在代码中计算;
b:宽度的算法为:(屏幕宽度 - 横向所有间距之和) / 横向卡片的数量
c:这里还有一个比较难弄的问题,即卡片的之间的间距,因为瀑布流类布局多使用recyclerview实现,单纯的给卡片设置margin_left 或者 margin_right的话,最终卡片会往左或者往右偏移;
d:举例解决c中的问题1:比如距离屏幕左右均为dimen_15,卡片中间的间距为dimen_10,那么可以设置recyclerview的margin_left 和 margin_right 为dimen_10,设置卡片的margin_left 和 margin_right 为dimen_5;
e:举例解决c中的问题2:比如距离屏幕左右均为dimen_10,卡片中间的间距为dimen_15,那么可以设置recyclerview的margin_left 和 margin_right 为dimen_2_5,设置卡片的margin_left 和 margin_right 为dimen_7_5;
f:瀑布流的间距,也可以使用recyclerview的addItemDecoration()方法实现
三:dimens创建参考链接
https://blog.csdn.net/shulianghan/article/details/126389918
四:SizeUtils源码
import android.content.Context;
import android.content.res.Resources;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.view.View;
import android.view.ViewGroup;
import androidx.annotation.DimenRes;
public final class SizeUtils {
private SizeUtils() {
throw new UnsupportedOperationException("u can't instantiate me...");
}
//精度丢失
public static int getDimen(@DimenRes int id) {
return (int) Utils.getApp().getResources().getDimension(id);
}
public static float getDimenFloat(@DimenRes int id) {
return Utils.getApp().getResources().getDimension(id);
}
/**
* Value of dp to value of px.
*
* @param dpValue The value of dp.
* @return value of px
* @deprecated Use {@link #getDimen(int)} instead.
*/
@Deprecated
public static int dp2px(final float dpValue) {
// final float scale = Resources.getSystem().getDisplayMetrics().density;
// return (int) (dpValue * scale + 0.5f);
float density = Utils.getApp().getResources().getDisplayMetrics().density;
return (int) (dpValue * density + 0.5);
}
public static float dp2pxFloat(Context context, float dp) {
float scale = context.getResources().getDisplayMetrics().density;
return dp * scale;
}
public static int dp2px(Context context, float dp) {
float scale = context.getResources().getDisplayMetrics().density;
return (int) ((dp * scale) + 0.5f);
}
/**
* Value of px to value of dp.
*
* @param pxValue The value of px.
* @return value of dp
*/
public static int px2dp(final float pxValue) {
final float scale = Resources.getSystem().getDisplayMetrics().density;
return (int) (pxValue / scale + 0.5f);
}
/**
* Value of sp to value of px.
*
* @param spValue The value of sp.
* @return value of px
*/
public static int sp2px(final float spValue) {
float fontScale = Utils.getApp().getResources().getDisplayMetrics().scaledDensity;
return (int) (spValue * fontScale + 0.5f);
}
/**
* Value of px to value of sp.
*
* @param pxValue The value of px.
* @return value of sp
*/
public static int px2sp(final float pxValue) {
final float fontScale = Resources.getSystem().getDisplayMetrics().scaledDensity;
return (int) (pxValue / fontScale + 0.5f);
}
/**
* Converts an unpacked complex data value holding a dimension to its final floating
* point value. The two parameters <var>unit</var> and <var>value</var>
* are as in {@link TypedValue#TYPE_DIMENSION}.
*
* @param value The value to apply the unit to.
* @param unit The unit to convert from.
* @return The complex floating point value multiplied by the appropriate
* metrics depending on its unit.
*/
public static float applyDimension(final float value, final int unit) {
DisplayMetrics metrics = Resources.getSystem().getDisplayMetrics();
switch (unit) {
case TypedValue.COMPLEX_UNIT_PX:
return value;
case TypedValue.COMPLEX_UNIT_DIP:
return value * metrics.density;
case TypedValue.COMPLEX_UNIT_SP:
return value * metrics.scaledDensity;
case TypedValue.COMPLEX_UNIT_PT:
return value * metrics.xdpi * (1.0f / 72);
case TypedValue.COMPLEX_UNIT_IN:
return value * metrics.xdpi;
case TypedValue.COMPLEX_UNIT_MM:
return value * metrics.xdpi * (1.0f / 25.4f);
}
return 0;
}
/**
* Force get the size of view.
* <p>e.g.</p>
* <pre>
* SizeUtils.forceGetViewSize(view, new SizeUtils.OnGetSizeListener() {
* Override
* public void onGetSize(final View view) {
* view.getWidth();
* }
* });
* </pre>
*
* @param view The view.
* @param listener The get size listener.
*/
public static void forceGetViewSize(final View view, final OnGetSizeListener listener) {
view.post(new Runnable() {
@Override
public void run() {
if (listener != null) {
listener.onGetSize(view);
}
}
});
}
/**
* Return the width of view.
*
* @param view The view.
* @return the width of view
*/
public static int getMeasuredWidth(final View view) {
return measureView(view)[0];
}
/**
* Return the height of view.
*
* @param view The view.
* @return the height of view
*/
public static int getMeasuredHeight(final View view) {
return measureView(view)[1];
}
/**
* Measure the view.
*
* @param view The view.
* @return arr[0]: view's width, arr[1]: view's height
*/
public static int[] measureView(final View view) {
ViewGroup.LayoutParams lp = view.getLayoutParams();
if (lp == null) {
lp = new ViewGroup.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
);
}
int widthSpec = ViewGroup.getChildMeasureSpec(0, 0, lp.width);
int lpHeight = lp.height;
int heightSpec;
if (lpHeight > 0) {
heightSpec = View.MeasureSpec.makeMeasureSpec(lpHeight, View.MeasureSpec.EXACTLY);
} else {
heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
}
view.measure(widthSpec, heightSpec);
return new int[]{view.getMeasuredWidth(), view.getMeasuredHeight()};
}
///////////////////////////////////////////////////////////////////////////
// interface
///////////////////////////////////////////////////////////////////////////
public interface OnGetSizeListener {
void onGetSize(View view);
}
}
网友评论