QMUI_Android
功能特性
全局 UI 配置
只需要修改一份配置表就可以调整 App 的全局样式,包括组件颜色、导航栏、对话框、列表等。一处修改,全局生效。
丰富的 UI 控件
提供丰富常用的 UI 控件,例如 BottomSheet、Tab、圆角 ImageView、下拉刷新等,使用方便灵活,并且支持自定义控件的样式。
高效的工具方法
提供高效的工具方法,包括设备信息、屏幕信息、键盘管理、状态栏管理等,可以解决各种常见场景并大幅度提升开发效率。
功能列表
QMUIAnimationListView
使
ListView
支持添加/删除 Item 的动画,支持自定义动画效果。QMUIBottomSheet
在
Dialog
的基础上重新定制了show()
和hide()
时的动画效果, 使Dialog
在界面底部升起和降下。提供了以下两个面板样式:
列表样式:使用
QMUIBottomSheet.BottomListSheetBuilder
生成。宫格类型:使用
QMUIBottomSheet.BottomGridSheetBuilder
生成。
QMUICommonListItemView
用作通用列表
QMUIGroupListView
里的 Item,也可单独使用。支持以下样式:
展示一行文字。
在右侧或下方增加一行说明文字。
在 item 右侧显示一个开关或箭头或自定义的View
QMUIDialog
提供了一系列常用的对话框,解决了使用系统默认对话框时在不同 Android 版本上的表现不一致的问题。使用不同的 Builder 来构建不同类型的对话框,这些 Builder 都拥有设置 title 和添加底部按钮的功能,不同的 Builder 特有的作用如下:
MessageDialogBuilder
: 消息类型的对话框 Builder。通过它可以生成一个带标题、文本消息、按钮的对话框。ConfirmMessageDialogBuilder
: 带 Checkbox 的消息确认框 Builder。EditTextDialogBuilder
: 带输入框的对话框 Builder。MenuDialogBuilder
: 菜单对话框 Builder。CheckableDialogBuilder
: 单选类型的对话框 Builder。MultiCheckableDialogBuilder
: 多选类型的对话框 Builder。
7.CustomDialogBuilder
: 自定义对话框内容区域的 Builder。
-
AutoResizeDialogBuilder
: 随键盘升降自动调整 Dialog 高度的 Builder
QMUIEmptyView
通用的空界面控件,支持显示 loading、主标题和副标题、图片。
QMUIFloatLayout
类似 CSS 里
float: left
的浮动布局,从左到右排列子 View 并自动换行。支持以下特性:
控制子
View
之间的垂直/水平间距。控制子
View
的水平对齐方向(左对齐/居中/右对齐)。限制子
View
的个数或行数。
QMUIFontFitTextView
使
TextView
在宽度固定的情况下,文字多到一行放不下时能缩小文字大小来自适应。QMUIGroupListView
通用的列表,常用于 App 的设置界面,注意其父类不是
ListView
而是LinearLayout
,所以一般要配合ScrollView
使用。提供了 Section 的概念,用来将列表分块。 配合QMUIGroupListView.Section
,QMUICommonListItemView
和QMUIGroupListSectionHeaderFooterView
使用。QMUIGroupListSectionHeaderFooterView
用作通用列表
QMUIGroupListView
里每个 Section 的头部或尾部,也可单独使用。QMUIItemViewsAdapter
一个带 cache 功能的“列表型数据-View”的适配器,适用于自定义
View
需要显示重复单元ListView
的情景,cache 功能主要是保证在需要多次刷新数据或布局的情况下(ListView
或RecycleView
的 itemView)复用已存在的View
。QMUI 用于QMUITabSegment
中Tab
与数据的适配。QMUIKeyboardHelper
提供更加便捷的方式针对给定的 EditText 显示/隐藏软键盘,并且提供了工具方法判断键盘是否当前可见。
QMUILinkTextView
使
TextView
能自动识别 URL、电话、邮箱地址,相比TextView
有以下特点:
可以设置链接的样式。
可以设置链接的点击事件。
QMUILoadingView
用于显示
Loading
的View
,支持颜色和大小的设置。QMUIObservableScrollView
可以监听滚动事件的
ScrollView
,并能在滚动回调中获取每次滚动前后的偏移量。QMUIPopup
提供一个浮层,支持自定义浮层的内容,支持在指定 View 的任一方向旁边展示该浮层,支持自定义浮层出现/消失的动画。
QMUIListPopup
继承自
QMUIPopup
,在QMUIPopup
的基础上,支持显示一个列表。QMUIProgressBar
一个进度条控件,通过颜色变化显示进度,支持环形和矩形两种形式,主要特性如下:
支持在进度条中以文字形式显示进度,支持修改文字的颜色和大小。
可以通过
xml
属性修改进度背景色,当前进度颜色,进度条尺寸。支持限制进度的最大值。
QMUIPullRefreshLayout
下拉刷新控件。支持自定义 RefreshView(表示正在刷新的 View),触发刷新的位置等特性。
QMUIQQFaceView
支持显示表情的伪
TextView
(继续自定义 View,而不是真正的TextView
), 实现了TextView
的maxLine
、ellipsize
、textSize
、textColor
等基本功能。支持与
QMUITouchableSpan
配合使用实现内容可点击。
QMUIQQFaceCompiler
QMUIQQFaceView
的内容解析器,将文本内容解析成QMUIQQFaceView
想要的数据格式。IQMUIQQFaceManager
QMUIQQFaceView
资源管理接口,使用QMUIQQFaceView
必须实现这个接口以提供表情资源。QMUIRadiusImageView
提供为图片添加圆角、边框、剪裁到圆形或其他形状等功能。
QMUIRoundButton
对
Button
提供圆角功能,支持以下特性:
指定圆角的大小。
分别指定不同方向的圆角大小。
指定圆角的大小为高度的一半,并跟随高度变化自适应圆角大小。
支持分别指定背景色和边框色,指定颜色时支持使用 color 或
ColorStateList
。
QMUIRoundButtonDrawable
使用该
Drawable
可以方便地生成圆角矩形/圆形Drawable
,提供设置背景色、描边大小和颜色、圆角自适应 View 高度等特性。QMUISpanTouchFixTextView
相比
TextView
,修正了两个常见问题:
修正了
TextView
与ClickableSpan
一起使用时,点击ClickableSpan
也会触发TextView
的事件的问题。修正了
TextView
默认情况下如果添加了ClickableSpan
之后就无法把点击事件传递给TextView
的 Parent 的问题。
QMUITabSegment
用于横向多个
Tab
的布局,包含多个特性:
可以用
xml
或QMUITabSegment
提供的 set 方法统一配置文字颜色、icon 位置、是否要下划线等。每个
Tab
都可以非常灵活的配置,内容上支持文字和 icon 的显示,icon 支持选中态,支持内容的排版对齐方向设置,支持显示红点,支持插入自定义的View
,支持监听双击事件等。可以通过
setupWithViewPager(ViewPager)
方法与ViewPager
绑定。
QMUITipDialog
提供一个浮层展示在屏幕中间,提供了以下两种样式:
使用
QMUITipDialog.Builder
生成,提供了一个图标和一行文字的样式, 其中图标有 Loading、成功、失败等类型可选。使用
QMUITipDialog.CustomBuilder
生成,支持传入自定义的layoutResId
。
QMUITopBar
通用的顶部 Bar。提供了以下功能:
更多可参考 wiki 文档
在左侧/右侧添加图片按钮/文字按钮/自定义View。
设置标题/副标题,且支持设置标题/副标题的水平对齐方式。
QMUITopBarLayout
对
QMUITopBar
的包裹类,并代理了QMUITopBar
的方法。配合QMUIWindowInsetLayout
使用,可使QMUITopBar
在支持沉浸式状态栏的界面中顶部延伸到状态栏。QMUIVerticalTextView
在
TextView
的基础上支持文字竖排。QMUITouchableSpan
-继承自 ClickableSpan
,支持 normal 态和 press 态时有不同的背景颜色以及字体颜色。建议配合 QMUISpanTouchFixTextView
或其子类使用,便于事件传递的协调。
QMUIWindowInsetLayout
配合沉浸式状态栏使用,用于协调子
View
的fitSystemWindows
。QMUIWrapContentListView
支持高度值为
wrap_content
的ListView
,解决原生ListView
在设置高度为wrap_content
时高度计算错误的 bug。QMUIBlockSpaceSpan
通过在段落之间设置该 span,实现段间距的效果。
QMUICustomTypefaceSpan
通过在段落之间设置该 span,实现段间距的效果。
QMUICustomTypefaceSpan
支持以
Typeface
的方式设置span
的字体,实现自定义字体的效果。QMUIAlignMiddleImageSpan
继承自
ImageSpan
,在此基础上实现让span
垂直居中的效果。QMUIMarginImageSpan
继承自
QMUIMarginImageSpan
,在此基础上支持设置图片的左右间距。QMUITextSizeSpan
支持调整字体大小的
span
。AbsoluteSizeSpan
可以调整字体大小,但在中英文混排下由于decent的不同,无法根据具体需求进行底部对齐或者顶部对齐。而QMUITextSizeSpan
则可以多传一个参数,让你可以根据具体情况来决定偏移值。QMUIStickySectionLayout
支持二级结构的列表的折叠与展开;支持滚动时悬浮当前 section header; 支持在section list 或 section item list 前后添加自定义
View
。 更多可参考 wiki 文档。
Helper Classes
QMUIColorHelper
颜色处理工具类,按照功能类型来划分,总共包含以下几个特性:
为一个颜色设置透明度。
根据指定比例,在两个颜色值之间计算出一个颜色值。
将颜色值转换为字符串。
QMUIDeviceHelper
获取设备信息的工具类,按照功能类型来划分,总共包含以下几个特性:
判断设备为手机/平板。
判断设备是否为魅族手机。
判断当前系统是否为 Flyme 系统。
判断当前系统是否为 MIUI 系统。
判断当前是否拥有悬浮窗权限。
QMUIDisplayHelper
屏幕相关的工具类,按照功能类型来划分,总共包含以下几个特性:
方便地获取一个
DisplayMetrics
实例。获取屏幕信息,包括屏幕密度、屏幕宽度和高度、状态栏高度、ActionBar 高度等。
获取设备硬件信息,包括是否有可用摄像头、是否有硬件菜单、是否有网络、SD Card 是否可用、当前选择的国家语言等。
判断当前是否处于全屏状态,控制进入/退出全屏状态。
dp 与 px 数值的相互转化。
- QMUIDrawableHelper
快速绘制一张指定大小、颜色、边框的图片,支持形状为圆角矩形和圆形。
快速绘制一张带上分隔线或下分隔线的图片。
快速绘制一张可带圆角的渐变图片。
将当前图片的颜色换成另一个颜色。
将两张图片叠加后生成一张新的图片。
对某个
View
截图生成图片。
QMUIPackageHelper
提供简便的方式获取 App 的版本信息,可以单独获取主版本号、次版本号以及修正版本号。
QMUIResHelper
封装了更加便捷的方法,用于获取当前
Theme
下的Attr
值,支持Float
、Color
、ColorStateList
、Drawable
和Dimen
类型的Attr
。
-QMUISpanHelper
提供了方法使得
QMUIMarginImageSpan
能被更便捷地使用。QMUIStatusBarHelper
状态栏相关的工具类,按照功能类型来划分,总共包含以下几个特性:
快速实现沉浸式状态栏(支持 4.4 以上版本的
MIUI
和Flyme
,以及 5.0 以上版本的其他Android
)。快速设置状态栏为黑色或白色字体图标(支持 4.4 以上版本
MIUI
和Flyme
,以及 6.0 以上版本的其他Android
)。
3.提供多个常用的工具方法,如获取状态栏高度、判断当前是否全屏等等。
QMUIViewHelper
View 工具类,按照功能类型来划分,总共包含以下几个特性:
对
ImageView
进行处理,可以按比例缩放图片。对
View
做背景颜色变化动画,支持多个动画参数。对
View
做进退场动画,支持透明度变化和上下位移两种方式。
提供多个常用的 View 相关工具方法,如对 View 设置单个方向的 padding、从 ViewStub 中获取一个 View、判断 ListView 是否已经滚动到底部等等。提供多个常用的
View
相关工具方法,如对View
设置单个方向的padding
、从ViewStub
中获取一个View
、判断ListView
是否已经滚动到底部等等。
开始使用
qmui
1. 引入库
最新的库会上传到 JCenter 仓库上,请确保配置了 JCenter 仓库源,然后直接引用:
implementation 'com.qmuiteam:qmui:1.2.0'
至此,QMUI 已被引入项目中。
配置主题
把项目的 theme
的 parent
指向 QMUI.Compat
,至此,QMUI 可以正常工作。
3. 覆盖组件的默认表现
你可以通过在项目中的 theme
中用
的形式来覆盖 QMUI 组件的默认表现。具体可指定的属性名请参考 @style/QMUI.Compat
中的属性。
1. 引入库
arch 库会依赖 qmui 库, 因此也需要引入 qmui 库
implementation com.qmuiteam:arch:0.3.1
2. 在 Application#onCreate 中初始化
QMUISwipeBackActivityManager.init(this);
最后
如果你看到了这里,觉得文章写得不错就给个赞呗?如果你觉得那里值得改进的,请给我留言。一定会认真查询,修正不足。谢谢。
【附】相关架构及资料
资料免费领取方式:加Q群 Android开发交流群:917137200