嘿,兄弟!移动端调试工具Flipper了解一下

内容简介:本文介绍了一个面向移动端开发者的桌面调试平台Flipper,该调试工具功能包含移动端的日志,布局,文件,性能监控等。

什么是Flipper

Flipper 是 facebook 开源的一个面向移动端(Android/iOS)开发者的桌面调试平台。

开源地址: https://github.com/facebook/flipper

官网地址: https://fbflipper.com/

它分为两个部分

  • macOS 的桌面应用程序(目前仅支持 macOS )

  • Android 和 iOS 的原生 SDK

桌面部分

可以在github下载最新版,当我们在Android或iOS应用中集成好SDK之后,打开桌面应用,可以看到如下窗口,目前它有几个内置的插件,分别是:

  • Logs

  • Layout Inspector

  • Network

  • Sandbox

  • Shared Preferences

  • LeakCanary

  • Crash Reporter Plugin

640?wx_fmt=png

注意:除了内置的插件之外,也可以自己开发插件,实现定制的功能

Android SDK 集成

1、添加依赖
debugImplementation 'com.facebook.flipper:flipper:0.14.1'	
debugImplementation 'com.facebook.soloader:soloader:0.5.1'	
debugImplementation 'com.squareup.leakcanary:leakcanary-android:1.6.1'	
releaseImplementation 'com.squareup.leakcanary:leakcanary-android-no-op:1.6.1'	
implementation 'com.squareup.okhttp3:okhttp:3.6.0'
2、启用插件

其中 Log 默认是打开的无需添加,其他需要通过代码来启用,关键代码如下:

...	
final FlipperClient client = AndroidFlipperClient.getInstance(this);	
//Network插件	
final NetworkFlipperPlugin networkPlugin = new NetworkFlipperPlugin();	
final FlipperOkhttpInterceptor interceptor = new FlipperOkhttpInterceptor(networkPlugin);	
client.addPlugin(networkPlugin);	
//Inspector插件	
client.addPlugin(new InspectorFlipperPlugin(this, DescriptorMapping.withDefaults()));	
//Sandbox插件	
client.addPlugin(new SandboxFlipperPlugin(new SandboxFlipperPluginStrategy() {	
    @Nullable	
    @Override	
    public Map<String, String> getKnownSandboxes() {	
        Map map = new HashMap();	
        return map;	
    }	
    @Override	
    public void setSandbox(@Nullable String sandbox) {	
    }	
}));	
//SP插件	
client.addPlugin(new SharedPreferencesFlipperPlugin(this, "flipper_shared_preference"));	
//LeakCanary插件	
client.addPlugin(new LeakCanaryFlipperPlugin());	
//CrashReporter插件	
client.addPlugin(CrashReporterPlugin.getInstance());	
client.start();	
...

使用效果

1、Logs

Logs 和 Android Studio 的 logcat 类似,可以显示 log 的不同级别及过滤。

640?wx_fmt=png

2、Network

当发起一个网络请求(目前仅支持 OkHttp 库发起的请求),可以在 Network 标签下看到详细的网络请求情况。包括 request 和 response 。在使用中发现, response 在中文解码支持不好,会有乱码。

640?wx_fmt=png

3、Layout

可以在 Layout 标签下看到 Activity 布局。有一个好处是,当修改 View 的样式或者文字等其他属性时,可以实时反馈到手机或模拟器上。

640?wx_fmt=png

4、Shared Preferences

在 Shared Preferences 标签下,可以显示 sp 文件的 key 和 value ,并且在此修改的值也可以实时在手机或模拟器上修改。

640?wx_fmt=png

5、LeakCanary

经测试,这部分功能不是很稳定,内存泄漏信息不能完整显示。

640?wx_fmt=png

关于 Sandbox 和 CrashReporter ,目前文档上的使用不是特别明确,不在演示。

结论

Flipper 截止目前(2019-01-18)最新的版本是 v0.14.1 ,开源的时间也没多久,有一些功能和文档还不是特别完善,比如有一些功能仅支持 Android 或者仅支持 iOS ,但是仓库的更新非常频繁,并且支持开发者自己开发插件。我们一起期待 Flipper 越来越好用。

--END--

识别二维码,关注我们

640?wx_fmt=png

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值