zoukankan      html  css  js  c++  java
  • 腾讯开源的Android UI框架——QMUI Android

    各位同学,早上好,我是你们的老朋友D_clock爱吃葱花,前些天忙着发版本,最近也在看各种各样的新知识,有好多东西想写啊啊啊啊啊。嗯,先冷静捋一下,卖个关子。扯回正题,今天继续为大家推荐一个Github上的开源框架——QMUI Android,出品自腾讯广州研发部QMUI团队。

    https://github.com/QMUI

    如果是做Web开发的同学,应该会很熟悉QMUI所开源的QMUI Web框架,我之前也是因为弄一个Web页的问题,知道了QMUI Web,然后才了解到QMUI这个团队,前段时间发现他们新开源了QMUI Android这个框架,觉得还蛮接地气的,索性一直暗中观察,今天就来简单介绍下它。并且据官网介绍,目前该项目已经支持了QQ邮箱和微信读书。

    640?wx_fmt=png&wxfrom=5&wx_lazy=1

    QMUI Android是什么?

    以下是官方在Github的README中给出的介绍:

    QMUI Android的设计目的是用于辅助快速搭建一个具备基本设计还原效果的Android项目,同时利用自身提供的丰富控件及兼容处理,让开发者能专注于业务需求而无需耗费精力在基础代码的设计上。不管是新项目的创建,或是已有项目的维护,均可使开发效率和项目质量得到大幅度提升。

    简单的说,它就是一个封装完善的Android UI组件库,使用它可以解决你很多日常开发需求的UI问题。目前,它主要包含以下两个部分:

    • UI控件:BottomSheet、Tab、圆角 ImageView、下拉刷新等,使用方便灵活,并且支持自定义控件的样式;

    • 常用工具类:如设备信息、屏幕信息、键盘管理、状态栏管理等;

    引入工程中使用也非常简单,参照官方配置文档的手把手教学即可Happy Coding!

    0?wx_fmt=png

    官方配置文档:http://qmuiteam.com/android/page/start.html

    经过一小段时间的体验之后,我总结了以下几个亮点分享一下。

    常见UI效果封装

    QMUI Android中提供了很多常见使用的UI效果封装,比如下面这些:

    1、QMUIDialog:它提供了一系列常用的对话框,解决了使用系统默认对话框时在不同 Android 版本上的表现不一致的问题。

    0?wx_fmt=gif

    并且可以使用不同的Builder来构建不同类型的对话框,这些Builder都拥有设置title和添加底部按钮的功能。

    2、QMUIGroupListView:通用的列表,常用于App的设置界面,由于它的父类不是ListView而是LinearLayout,所以,需要配合ScrollView使用。并且它还提供了一个Section的概念对列表进行分块,按照官方的介绍可以配合其所提供的QMUIGroupListView.Section, QMUICommonListItemViewQMUIGroupListSectionHeaderFooterView使用。

    0?wx_fmt=gif

    3、QMUIFloatLayout:类似CSS中的浮动布局,从左到右排列子View并自动换行,同时还提供控制子View之间的垂直/水平间距和水平对齐方向、限制子View个数或行数等特性。

    0?wx_fmt=gif

    4、除了以上一些UI效果之外,还有诸如进度条效果(QMUIProgressBar)、下拉刷新(QMUIPullRefreshLayout)、类似于PopupWindow的悬浮弹层(QMUIPopupQMUIListPopup)、加载中的等待效果(QMUILoadingView)等等还有好多。

    增强富文本

    QMUI Android中提供了很多自定义的Span来帮你解决各种富文本的问题,如:QMUIBlockSpaceSpanQMUICustomTypefaceSpanQMUIAlignMiddleImageSpanQMUIMarginImageSpanQMUITextSizeSpanQMUITouchableSpan等。

    0?wx_fmt=gif

    还有为文字和表情混排提供支持的QMUIQQFaceViewQMUIQQFaceCompilerIQMUIQQFaceManager,而且相比系统自带的ImageSpan实现,QMUI还做了一定的优化工作,具体可以对比效果图中的expend time(因为录制gif图所以没滑动太快,正常情况下,这个性能差距会更大)。

    QMUIQQFaceView实现效果QMUIQQFaceView和默认ImageSpan性能比对

    0?wx_fmt=gif

    0?wx_fmt=gif

    并且,还提供了支持垂直排版文字的QMUIVerticalTextView,以及QMUISpanTouchFixTextView修复了原生TextView和ClickableSpan一起使用时的一些的bug。

    QMUIVerticalTextViewQMUISpanTouchFixTextView

    0?wx_fmt=gif

    0?wx_fmt=gif

    简直不要太爽。

    工具类

    工具类的话,也有不少,官方给的文档言简意赅,给大家截图好了。

    0?wx_fmt=png

    0?wx_fmt=png

    这些工具类,在平常开发中都是很实用的。

    不足

    介绍完以上几大亮点,最后再说点个人觉得唯一的不足之处,就是如果QMUI Android的文档能像QMUI Web一样完善,那就更好了。

    期待

    总的来说,QMUI Android的发展还是蛮值得继续期待,哦,对了,iOS也有对应的QMUI iOS哦。

    0?wx_fmt=png

    不知道后面会不会出现QMUI RN?QMUI 小程序?哈哈,随意脑洞下一下。觉得文章不错的同学,可以帮忙转发、点赞支持哦。

    之前的精彩文章

  • 相关阅读:
    VUE组件——FlameGraph火焰图
    Linux操作之——配置samba
    Javascript基础——图片预加载
    Javascript基础——浮点数操作
    js页面实时显示时间
    基于Struts2+Hibernate的朋友圈留言网站开发的质量属性
    框架选择
    软件体系架构
    《需求分析与系统设计》第三篇
    《需求分析与系统设计》阅读笔记第二篇
  • 原文地址:https://www.cnblogs.com/Free-Thinker/p/9646519.html
Copyright © 2011-2022 走看看