竞品技术调研：小米自由窗口Freeform实现方案剖析

文章目录背景自由窗口实现功能和技术原理剖析小米自由窗口为啥比原生体验好自由窗口整体结构剖析放大进入全屏的功能退出自由窗口的相关交互方式拖动自由窗口最右侧交互最小化功能背景国内这些手机大厂在自由窗口这块的功能其实都做得比较好也一直是一个相比aosp原生修改差异较大的功能也属于一个非常大的亮点提升代表厂商比如常见的小米ov等。小米自由窗口展示如下而且国内这些手机厂商在自由窗口这块额外加入的功能还比较多所以今天针对小米手机做一个关于自由窗口的调研报告方便各位vip课程群里的学员朋友进行自由窗口开发时候有个比较好的参考更多关于手机大厂自由窗口功能讨论可以联系马哥交流或者获取额外vip资料如果有的话会分享相关学员。自由窗口实现功能和技术原理剖析小米自由窗口为啥比原生体验好对比原生的自由窗口展示样子小米的自由窗口样式上就好看很多这块也是自由窗口最核心的优化部分那么小米是怎么实现这个自由窗口的美化呢其实这块和马哥自由窗口课程中实战讲解的原理一样具体可以通过dumpsys验证他的原理dumpsys activity containers│ └─ DefaultTaskDisplayAreatypeundefinedmodefullscreen override-modefullscreen requested-bounds[0,0][0,0]bounds[0,0][1220,2712]│ ├─Task6311typestandardmodeFREEFORM override-modeFREEFORM requested-bounds[183,295][1403,2247]bounds[183,295][1403,2247]│ │ └─ ActivityRecord{242935665u0 com.android.mms/.ui.MmsTabActivity t6311}typestandardmodeFREEFORM override-modeundefined requested-bounds[0,0][0,0]bounds[183,295][1403,2247]│ │ └─ ed49369 com.android.mms/com.android.mms.ui.MmsTabActivitytypestandardmodeFREEFORM override-modeundefined requested-bounds[0,0][0,0]bounds[183,295][1403,2247]│ ├─Task1typeHOMEmodefullscreen override-modeundefined requested-bounds[0,0][0,0]bounds[0,0][1220,2712]│ │ └─Task2typeHOMEmodefullscreen override-modeundefined requested-bounds[0,0][0,0]bounds[0,0][1220,2712]│ │ └─ ActivityRecord{247813959u0 com.miui.home/.launcher.Launcher t2}typeHOMEmodefullscreen override-modeundefined requested-bounds[0,0][0,0]bounds[0,0][1220,2712]│ │ ├─ 5db03ab LauncherOverlayWindow:com.miui.personalassistanttypeHOMEmodefullscreen override-modeundefined requested-bounds[0,0][0,0]bounds[0,0][1220,2712]│ │ └─ 37aaaf2 com.miui.home/com.miui.home.launcher.LaunchertypeHOMEmodefullscreen override-modeundefined requested-bounds[0,0][0,0]bounds[0,0][1220,2712]可以看出com.android.mms/.ui.MmsTabActivity短信这个activity实际是modeFREEFORM的情况。但是bounds大小是requested-bounds[183,295][1403,2247]bounds[183,295][1403,2247]而且看看窗口大小的boundsWindow#14 Window{ed49369 u0 com.android.mms/com.android.mms.ui.MmsTabActivity}://省略 Requestedw1220h1952mLayoutSeq117692但是明显这窗口大小是大于自由窗口展示的因为w1220实际是全屏幕的宽度所以这里其实有对图层进行缩放所以这块其实本质原理和课程一模一样。自由窗口整体结构剖析除了自由窗口窗口的本身Task图层外小米还设计了上下Caption Bar进行dumpsys sf后得出如下图层情况Display4630946370515662722(active)HWC layers: --------------------------------------------------------------------------------------------------------------------------------------------------------------- Layer name Z|Window Type|Layer Class|Comp Type|Transform|Disp Frame(LTRB)|Source Crop(LTRB)|Frame Rate(Explicit)(Seamlessness)[Focused]--------------------------------------------------------------------------------------------------------------------------------------------------------------- Wallpaper BBQ wrapper#621|0|0|DEVICE|0|0012202712|0.00.01220.02712.0|[]--------------------------------------------------------------------------------------------------------------------------------------------------------------- com.miui.home/com.miui.home.launcher.Launcher#930283|1|0|DEVICE|0|0012202712|0.00.01220.02712.0|[]---------------------------------------------------------------------------------------------------------------------------------------------------------------Task6181#6797111|0|0|CLIENT|0|04611431682|0.00.00.00.0|[]--------------------------------------------------------------------------------------------------------------------------------------------------------------- com.android.mms/com.android.mms.ui.MmsTabActivity#9306713|1|0|CLIENT|0|1832958941433|0.00.01220.01952.0|[*]--------------------------------------------------------------------------------------------------------------------------------------------------------------- Miui Caption ofTask6181#9307514|0|0|CLIENT|0|509321569333|0.00.060.012.0|[]--------------------------------------------------------------------------------------------------------------------------------------------------------------- Miui Bottom Caption ofTask6181#9307715|0|0|CLIENT|0|45014076271419|0.00.0305.012.0|[]--------------------------------------------------------------------------------------------------------------------------------------------------------------- StatusBar#12119|2000|0|DEVICE|0|001220122|0.00.01220.0122.0|[]--------------------------------------------------------------------------------------------------------------------------------------------------------------- NavigationBar0#12020|2019|0|DEVICE|0|0266412202712|0.00.01220.048.0|[]---------------------------------------------------------------------------------------------------------------------------------------------------------------可以看出上面图层中没有看到有拖拽过程展示的提示圆角这块预计是在sf中的skia绘制的。放大进入全屏的功能这里在自由窗口进行拖动放到时候会检测是否到了阈值一旦到了阈值后自由窗口显示变成一个图标还会展示一个提升圆角背景。退出自由窗口的相关交互方式最小化退出方式缩放到最小退出方式拖动自由窗口最右侧交互最小化功能在自由窗口展示时候整体拖动自由窗口到屏幕最右侧既可以展示一个自由窗口app的一个图标这个图标一般只有一半内容展示在屏幕内。可以看看这个屏幕侧边的图标图层它实际是MiuiBubbles图层实际这个图层处于顶层由systemui进程创建而且他的展示大小还是w1220 h2712相关window信息如下Window#1 Window{9274ecc u0 MiuiBubbles}:mDisplayId0mSessionSession{38089254456:1000}mClientandroid.os.BinderProxydddc59mOwnerUid1000showForAllUserstruepackagecom.android.systemuiappopNONEmAttrs{(0,0)(fillxfill)grTOP CENTER_VERTICALsim{adjustresize}layoutInDisplayCutoutModealways pkgcom.android.systemui adpkgnulltyMAGNIFICATION_OVERLAYfmtTRANSLUCENTflNOT_FOCUSABLE NOT_TOUCH_MODAL HARDWARE_ACCELERATEDpflSHOW_FOR_ALL_USERS FIT_INSETS_CONTROLLED TRUSTED_OVERLAYbhvDEFAULTframeRateBoostOnTouchtruedvrrWindowFrameRateHinttrue}Requestedw1220h2712mLayoutSeq118110mBaseLayer281000mSubLayer0mTokenWindowToken{d70201etype2027android.os.BinderProxy79648a0}-topChildWindow{9274ecc u0 MiuiBubbles}mViewVisibility0x0mHaveFrametruemObscuredfalsemGivenContentInsets[0,0][0,0]mGivenVisibleInsets[0,0][0,0]mTouchableInsets3mGivenInsetsPendingfalse touchableregionSkRegion((1148,656,1340,848))可以看到这个图层显示大小是 w1220 h2712 但是它大部分区域都是透明的只有在SkRegion((1148,656,1340,848))这个区域是显示的而且可以触摸的。点击最右侧这个图标可以既可以进入自由窗口尺寸最小的原文地址https://mp.weixin.qq.com/s/xOR3YcPrKbS_rhmDoiRmOQ