从UI适配上，咱们能学到什么

前言

UI适配，一直都是开发过程当中极其恶心的问题。不过一旦吃透适配的原理，这块“食之无味，弃之惋惜”的鸡肋问题就能够迎刃而解。好比前段时间，我司的解决方案：字节跳动：一种极低成本的Android屏幕适配方式

时间过了这么久，为啥单独搞了一篇关于UI适配的文章了？一是由于最近工做需求；二是在适配的过程当中学到了一些其余布局的用法，因此算是一篇近期工做总结性质的文章。

OK，开整。

1、为何须要适配

咱们都知道因为Android手机分辨率碎片化及其严重，即便Google推出了dp效果也一样不尽如人意。那么我们先来明确第一个问题：为何dp效果并很差。

提到dp，我们不得不提到几个公式：

• px = density * dp;
• density = dpi / 160;
• px = dp * (dpi / 160);

咱们能够看到，dp和px之间的转换和dpi有着密不可分的关系。那么它又是怎么算出来的呢？上一张图：

说白了，dpi就是手机斜边除以屏幕尺寸

从上述的公式，咱们能够看出，dpi的本质和手机屏幕的物理宽高有着直接的关系。

接下来咱们看俩款手机：

一、屏幕分辨率：1920*1080，屏幕尺寸：5吋的话，那么dpi约为440。

那么这种状况下1dp=2.75px。

二、屏幕分辨率：1920*1080，屏幕尺寸：6吋的话，那么dpi约为367。

那么这种状况下1dp=2.3px。

所以咱们能够看出来，对于不一样的手机来讲，若是它们的分辨率相同，但屏幕尺寸不一样。那么即便dp相同，真正到手机上去展现时仍然会出现问题。

所以咱们就须要进行适配...

2、百分比布局（ConstraintLayout）

最初为了适配，各类以百分比为核心的适配思想层出不穷。百分比布局的出现就是其中之一。此次我们经过ConstraintLayout来聊一聊百分比。

ConstraintLayout，能够经过各类约束关系将复杂的布局简单化，极大的下降layout的层级关系（减小UI绘制所带来的时间消耗）。

ConstraintLayout一样拥有极强的百分比布局能力。

好比：

• layout_constraintHorizontal_bias
• layout_constraintVertical_bias

<android.support.constraint.ConstraintLayout ...>
     <Button android:id="@+id/button" ... app:layout_constraintHorizontal_bias="0.3" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent/> </android.support.constraint.ConstraintLayout> 复制代码

简单来讲如今的Buttom拥有父布局宽度30%的左边距

还有一种有趣的方式，那就是使用Guideline，好比这样：

<androidx.constraintlayout.widget.Guideline android:id="@+id/effect_guideline" android:layout_width="wrap_content" android:orientation="vertical" app:layout_constraintGuide_percent="0.66" android:layout_height="wrap_content" />
复制代码

建立一个拥有左间距66%的Guideline

有了Guideline咱们能够随意基于这个约束进行布局，固然若是须要横向的Guideline，只须要改android:orientation=""便可。

固然还有：

• layout_constraintWidth_percent
• layout_constraintHeight_percent

直接将宽高设置为父级的百分比。

注意android:layout_width、android:layout_height的优先级会高于它们俩。

尾声

今天写聊的东西就这么多，应该很通俗易懂并且我的感受比较有实战意义。虽然内容有些少，哈哈。

这周比较忙，一直没抽出时间好好写写文章。一步步来吧~

我是一个应届生，最近和朋友们维护了一个公众号，内容是咱们在从应届生过渡到开发这一路所踩过的坑，以及咱们一步步学习的记录，若是感兴趣的朋友能够关注一下，一同加油~