关于android:史上最优美的Android原生UI框架XUI使用指南

14次阅读

共计 6186 个字符，预计需要花费 16 分钟才能阅读完成。

XUI 是一个简洁而又优雅的 Android 原生 UI 框架，解放你的双手！

XUI 能够说是我破费心血最多的开源我的项目了，目前略微大一点的我的项目我都会抉择引入它。XUI 简直涵盖了目前 Android 开发所须要的所有组件，能够说有了 XUI 之后，能够大大提高咱们的开发效率，让咱们能够将精力很多地放在业务性能和数据处理上。能够说 XUI 是目前 Github 上组件最全、文档最具体、案例 (200+) 数量最多的 Android 原生 UI 库。

目前 XUI 在 github 上曾经领有 2.6k 的 star 量, 如果你喜爱的话, 欢送点击 star 珍藏! 我的项目地址: https://github.com/xuexiangjys/XUI

置信做过 Android 的人都晓得 Android 原生组件在国内很不受设计师的待见，至于 Google 推广的 Material Design 设计格调更是无人问津，这就导致了设计师给出的原型图简直是清一色的 IOS 格调，更难堪的是，网上 Android 相干的开源 UI 库是少之又少，这可就尴尬死咱们了，简直所有的根底组件都须要本人重写。之前也写过 React 和 Vue，发现它们都有十分不便的 UI 库，而且应用起来也十分不便，间接在示例代码的根底上修修改改就能大抵上实现本人想要的成果，极大地提高了开发的效率。

在开始着手做这样一个开源库之前，我是一点思路都没有的。好在在 2017 年的某一天，我接触到了 QMUI, 通过浏览它的源码，我发现它的设计思路十分好，能够通过设置不同的主题款式、组件属性等实现不同的组件成果，非常灵活；除此之外，它还对 UI 主题格调做了较为具体的制订和归类，能够说很有启发意义。于是我就遵循了 QMUI 的思路，开启了 XUI 的编写。

简洁优雅，尽可能少得援用资源文件的数量，我的项目库整体大小有余 1M。
组件丰盛，提供了绝大多数咱们在开发者罕用的性能组件。
应用简略，为不便疾速开发，进步开发效率，对 api 进行了优化，提供一键式接入。
款式对立，框架提供了一系列对立的款式，使 UI 整体看上去好看谐和。
兼容性高，框架还提供了 3 种不同尺寸设施的款式（4.5 英寸、7 英寸和 10 英寸），并且最低兼容到 Android 17, 让 UI 兼容性更强。
扩展性强，各组件提供了丰盛的属性和款式 API，能够通过设置不同的款式属性，构建不同格调的 UI。

通过查看演示 Demo 的实现，能够疾速高效地把握 UI 组件的应用。

我的项目页面次要应用 XPage 页面框架主动搭建，构造十分清晰。我的项目次要分为 ” 组件 ”、” 工具 ” 和 ” 拓展 ” 三个局部。

组件：组件页面次要蕴含了 UI 框架中所有组件的应用 Demo 样例，在 "com.xuexiang.xuidemo.fragment.components" 包下，点击查看。
工具：工具页面次要蕴含了 UI 框架中所有辅助工具的应用 Demo 样例，在 "com.xuexiang.xuidemo.fragment.utils" 包下，点击查看。
拓展：扩大页面次要蕴含了性能比较复杂的第三方 UI 组件集成 Demo 样例，在 "com.xuexiang.xuidemo.fragment.expands" 包下，点击查看

我的项目构造如下图：

Demo 主页面如下图:

https://www.bilibili.com/vide…

如何在我的项目中应用 XUI: https://www.bilibili.com/video/BV1w7411c7Hy/

Android 空壳模板工程(主动集成了 XUI、XUtil、XAOP、XPage、XUpdate、XHttp2 等): https://github.com/xuexiangjys/TemplateAppProject
简化版的 Android 空壳模版工程(主动集成了 XUI、XUtil、XAOP、XPage 等): https://github.com/xuexiangjys/TemplateSimpleProject

1. 先在我的项目根目录的 build.gradle 的 repositories 增加:

allprojects {
     repositories {
        ...
        maven {url "https://jitpack.io"}
    }
}

【留神】切记不要跳过这一步，因为 XUI 目前只公布在 jitpack 平台上，跳过这一步会导致 ERROR: Failed to resolve: com.github.xuexiangjys:XUI:x.x.x 谬误！！！

2. 而后在 dependencies 增加:

dependencies {
  ...
  //androidx 我的项目
  implementation 'com.github.xuexiangjys:XUI:1.1.5'

  implementation 'androidx.appcompat:appcompat:1.1.0'
  implementation 'androidx.recyclerview:recyclerview:1.1.0'
  implementation 'com.google.android.material:material:1.1.0'
  implementation 'com.github.bumptech.glide:glide:4.11.0'
}

【留神】如果你的我的项目目前还未应用 androidx，请应用如下配置：

dependencies {
  ...
  //support 我的项目
  implementation 'com.github.xuexiangjys:XUI:1.0.9-support'

  implementation 'com.android.support:appcompat-v7:28.0.0'
  implementation 'com.android.support:recyclerview-v7:28.0.0'
  implementation 'com.android.support:design:28.0.0'
  implementation 'com.github.bumptech.glide:glide:4.8.0'
}

1. 在 Application 最顶部初始化设置（必须）

XUI.init(this); // 初始化 UI 框架
XUI.debug(true);  // 开启 UI 框架调试日志

2. 调整利用的根底主题（必须）

必须设置利用的根底主题，否则组件将无奈失常应用！必须保障所有用到 XUI 组件的窗口的主题都为 XUITheme 的子类，这十分重要！！！

根底主题类型：

大平板(10 英寸, 240dpi, 1920*1200）：XUITheme.Tablet.Big
小平板(7 英寸, 320dpi, 1920*1200）：XUITheme.Tablet.Small
手机（4.5 英寸, 320dpi, 720*1280）：XUITheme.Phone

<style name="AppTheme" parent="XUITheme.Phone">

    <!-- 自定义本人的主题款式 -->

    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

</style>

当然也能够在 Activity 刚开始时调用如下代码动静设置主题

@Override
protected void onCreate(Bundle savedInstanceState) {XUI.initTheme(this);
    super.onCreate(savedInstanceState);
    ...
}

3. 调整字体库（对字体无要求的可省略）

（1）设置你须要批改的字体库门路（assets 下）

// 设置默认字体为华文行楷，这里写你的字体库
XUI.getInstance().initFontStyle("fonts/hwxk.ttf");

（2）在我的项目的根底 Activity 中退出如下代码注入字体.

留神：1.1.4 版本之后应用如下设置注入

@Override
protected void attachBaseContext(Context newBase) {
    // 注入字体
    super.attachBaseContext(ViewPumpContextWrapper.wrap(newBase));
}

留神：1.1.3 版本及之前的版本应用如下设置注入

@Override
protected void attachBaseContext(Context newBase) {
    // 注入字体
    super.attachBaseContext(CalligraphyContextWrapper.wrap(newBase));
}

-keep class com.xuexiang.xui.widget.edittext.materialedittext.** {*;}

首先，请先认真依照接入文档接入 XUI 框架，不要跳步骤或者漏步骤，一步一步依照阐明来接入。除此之外，我也提供了视频教程供大家学习。
其次，依照正确应用 XUI 的姿态的阐明，来应用 XUI。
最初，呈现问题能够查阅应用阐明文档或者钻研 Demo 的应用，确保本人的用法是正确正当的，不要想当然。源码浏览能力强的可间接翻看 XUI 的我的项目源码, 如果发现框架的确存在问题也能够点击提交 Issue 清单, 将问题反馈给我解决。

2. 为什么我减少 XUI 依赖后会报错：`ERROR: Failed to resolve: com.github.xuexiangjys:XUI:x.x.x`？

答：这句话的意思是：无奈解析到 XUI 的依赖。呈现这种状况的起因是你没有配置近程依赖仓库 jitpack 地址。这里倡议你不要自以为是，老老实实依照应用阐明文档来引入依赖。

3. 为什么我在应用 XUI 中的组件时，会报错说 R 文件找不到 `android.content.res.Resources$NotFoundException: File res/drawable/xxxxx.xml from drawable resource ID ...`、属性获取不到`Failed to resolve attribute at index ...` 或者布局解析出错`android.view.InflateException:Binary XML file line #xx:Error inflating class <unknow>....`？

首先，你须要确认的是你以后组件所在的窗口（Activity）所应用的主题是否继承了 XUITheme 主题，如果没有，请依照接入文档正确接入。这里须要阐明的是，XUI 不同于其余开源组件库，他是一套对立的 UI 框架，有一套严格对立的属性款式规范，其中绝大多数组件和资源都应用了规范化的 XUI 款式主题属性，因而不应用 XUITheme 将无奈失常应用 XUI 框架。
其次，如果你也应用了 XUI 主题，那么请查看你应用的 context 是否是所在窗口的 context，组件中传入的context 肯定不要应用 XUI.getContext() 之类的，不懂的本人去温习一下 Android 的根底吧，这里给个讲 Android 中的 Context 和 Android 中 Context 的类型, 本人去看吧。
而后，如果你 context 也没应用错的话，那么请查看一下以后报错设施的零碎版本。因为在 Android5.0（21）以下在 drawable 中应用 ?attr 援用主题属性的话，也会导致 R 文件找不到的问题。而且同样是在 Android5.0（21）以下，如果你应用 vector 加载 SVG 图片的话，同样也会导致 R 文件找不到，因为在 Android5.0（21）以下零碎是不反对加载 SVG 图片的。
最初，如果以上都查看过但问题仍然存在，你能够尝试降级 XUI 至最新版本（留神最新版本只反对 AndroidX）。如果降级了问题仍然存在，那么就要思考是不是你的用法有问题了，倡议多看看 XUI 我的项目中的演示 Demo，点击查看学习演示 Demo 的用法。

答：最新的版本是只反对 AndroidX 的。从 XUI 1.0.5 当前，是反对 AndroidX 的版本，1.0.5 之前的版本是反对 Support 的版本。这里我倡议应用最新版本（AndroidX 版本），因为之前的版本可能存在一些兼容性的 bug，并在前面的版本被逐个修复。如果你仍然想应用 Support 版本的话，要么你就应用 1.0.5 之前的版本（存在一些低版本兼容性的 bug），要么你就 clone 一下以后最新版本的源码，将其改为 Support 版本本地导入依赖应用。

【这里思考到还有一大部分人在应用 support，为了不便大家应用，我在以后较为稳固的 1.0.9 版本上批改了一个反对 support 的版本 1.0.9-support 供大家过渡应用。】

答：XUI 依赖的 Glide 版本在 1.1.3 之前必须是 4.8.0, 1.1.3 及之后应用的是 4.11.0。

答：XUI 是反对全局性的字体批改的。详情参见接入文档。

答：XUI 是反对自定义主题的。详情参见如何自定义本人的主题。

答：演示 Demo 的程序跑通是必定没有任何问题的。这里举荐应用 Android Studio 3.4.1 以上的版本关上运行。详情参见如何运行 Demo 程序。除此之外, 请不要批改 gradle 的版本, 因为降级 gradle 版本可能导致依赖加载失败的问题.

答：” 组件 ” 中次要蕴含了 XUI 对外提供的绝大多数组件的应用案例，” 工具 ” 中次要蕴含 XUI 对外提供辅助工具的应用案例。
而 ” 拓展 ” 中蕴含的则是一些第三方罕用的 UI 组件库应用案例，非 XUI 中提供的内容。详情参见演示 Demo 介绍。

XUI 系列教学视频: https://space.bilibili.com/483850585/channel/detail?cid=104998
XUI 应用文档: https://github.com/xuexiangjys/XUI/wiki
Android 空壳模板工程(主动集成了 XUI、XUtil、XAOP、XPage、XUpdate、XHttp2 等): https://github.com/xuexiangjys/TemplateAppProject
简化版的 Android 空壳模版工程(主动集成了 XUI、XUtil、XAOP、XPage 等): https://github.com/xuexiangjys/TemplateSimpleProject

更多资讯内容，欢送扫描关注我的集体微信公众号:【我的 Android 开源之旅】

正文完

android

发表至： android

2020-11-01

0

关于android:回顾-AndroidDevChallenge-奇妙旅程

关于android:用HMS-Core地图服务自定义地图样式给你的应用制作专属个性化地图

关于android:Android-IO流程你真的清楚了吗｜硬核科普

关于android:Android中Toast的显示和隐藏分析

关于koa:Koa入门教程3错误和异常处理

关于android:史上最优美的Android原生UI框架XUI使用指南

我的项目简介

设计原由

设计思路

解决痛点

演示我的项目

我的项目架构

Demo 体验

视频教程

疾速集成

集成指南

增加 Gradle 依赖

初始化 XUI 设置

混同配置

常见问题

接入的问题

1. 如何疾速上手 XUI，晋升 UI 开发的效率？

2. 为什么我减少 XUI 依赖后会报错：`ERROR: Failed to resolve: com.github.xuexiangjys:XUI:x.x.x`？

4.XUI 有反对 Support 和 AndroidX 的版本吗？

5.Glide 版本抵触问题怎么解决？

6.XUI 反对全局性的字体批改吗？

7.XUI 反对自定义属于本人的主题吗？如何自定义主题以合乎设计师给出的 UI 格调。

演示 Demo 相干的问题

1. 为什么 XUIDemo 我的项目我运行不起来？

2. 演示 Demo 中的 ” 组件 ”、” 工具 ” 和 ” 拓展 ” 都蕴含了什么内容？

资源链接

微信公众号

站内搜索

关于android:史上最优美的Android原生UI框架XUI使用指南

我的项目简介

设计原由

设计思路

解决痛点

演示我的项目

我的项目架构

Demo 体验

视频教程

疾速集成

集成指南

增加 Gradle 依赖

初始化 XUI 设置

混同配置

常见问题

接入的问题

1. 如何疾速上手 XUI，晋升 UI 开发的效率？

2. 为什么我减少 XUI 依赖后会报错：ERROR: Failed to resolve: com.github.xuexiangjys:XUI:x.x.x？

4.XUI 有反对 Support 和 AndroidX 的版本吗？

5.Glide 版本抵触问题怎么解决？

6.XUI 反对全局性的字体批改吗？

7.XUI 反对自定义属于本人的主题吗？如何自定义主题以合乎设计师给出的 UI 格调。

演示 Demo 相干的问题

1. 为什么 XUIDemo 我的项目我运行不起来？

2. 演示 Demo 中的 ” 组件 ”、” 工具 ” 和 ” 拓展 ” 都蕴含了什么内容？

资源链接

微信公众号

站内搜索

2. 为什么我减少 XUI 依赖后会报错：`ERROR: Failed to resolve: com.github.xuexiangjys:XUI:x.x.x`？