移动开发UI组件【免费下载链接】lithoA declarative framework for building efficient UIs on Android.项目地址https://gitcode.com/gh_mirrors/li/litho点击查看免费下载本指南以 litho-intellij-plugin/README.md 为主线围绕当前仓库中由 Facebook 开源的LithoAndroid 声明式 UI 框架官方 IntelliJ IDEA / Android Studio 插件展开覆盖插件的功能概览、Marketplace 与手动安装流程、Gradle / BUCK 两套构建体系以及从plugin.xml、模板动作、代码补全到组件生成服务的源码级实现剖析。读完本文你将掌握如何在 IDE 中安装与验证该插件、如何选择构建方式并产出可部署的插件 JAR以及理解插件与 Litho Spec 模型、PSI 分析引擎之间的协作原理。插件是什么为 Litho 开发提供 IDE 级集成Litho 采用“Spec 类 编译期代码生成”的声明式模型开发者编写带LayoutSpec、MountSpec、GroupSectionSpec、DiffSectionSpec等注解的 Spec 类注解处理器在编译期生成对应的Component/Section类。这类工作流对 IDE 的代码分析提出了很高要求——例如 Spec 方法参数上的Prop、State注解会映射到生成类的 Builder 方法而这些生成类在编译前并不存在于源码中容易产生“红色符号”red symbols。litho-intellij-plugin正是为解决这些问题而生的 IntelliJ 平台插件其源码位于仓库根目录的 litho-intellij-plugin 下。按照 litho-intellij-plugin/src/main/resources/META-INF/plugin.xml 中的描述插件提供的核心能力包括Command-click 跳转点击 Section 或 Component 直接跳转到对应的 Spec 文件使用处搜索搜索组件时结果中包含生成类的使用位置文件模板在File - New菜单下提供PrimitiveComponent、KComponent、GroupSectionSpec等模板另有Event模板方法注解补全在 LayoutSpec 中补全合法的方法注解如OnCreateLayout事件处理补全对ClickEventhandler 等事件处理器进行补全Builder 补全组件 Builder 调用链补全并优先提示必填 PropRequired Props错误标注对 LayoutSpec 与缺失 Required Props 的代码进行错误高亮折叠展示在Prop参数旁以折叠folding形式显示DefaultProp值Regenerate Component在编辑器菜单中提供重新生成组件动作。插件还内置了**红色符号解析red symbols resolution**能力可以在内存中即时生成组件消除 Spec 依赖生成的“幽灵”类导致的编译前报错。安装方式一从 IntelliJ Marketplace 搜索安装插件处于持续开发状态仓库内plugin.xml中标注的版本为1.8.11-SNAPSHOTidea-version since-build201对应 Android Studio 4.1 及更新版本。官方推荐的最简安装路径是打开 IDE 的插件管理设置Settings - Plugins或Manage Plugins…在 Marketplace 标签页中搜索关键词Litho找到该插件后点击Install并重启 IDE 生效。该方式适合大多数普通使用者无需接触任何构建工具。安装方式二手动构建并安装最新版本当需要体验尚未发布的 SNAPSHOT 功能或希望定制插件行为时可以按 README 给出的三步走流程手动构建安装构建并把插件产物拷贝到 IDE 插件目录output_path在litho-intellij-plugin目录下执行构建命令将生成的插件文件放入 IDE 的插件文件夹。以 macOS 为例该目录通常是~/Library/Application Support/AndroidStudioX.XX.X为 Android Studio 版本号重启 IDE使新安装的插件生效验证进入Preferences - Plugins确认列表中已出现Litho即安装成功。第 1 步的具体命令取决于构建系统仓库同时支持 Gradle 与 BUCK 两套方案。构建系统详解Gradle 与 BUCK 的取舍Gradle构建包含全部特性的插件Gradle 构建会生成包含所有功能的完整插件包执行方式为$ ./buildPlugin.sh -p output_path该命令对应 litho-intellij-plugin/buildPlugin.sh脚本内部逻辑如下../gradlew :litho-intellij-plugin:buildPlugin # 调用根工程 gradlew 执行 IntelliJ 插件构建任务 cd build/distributions unzip -uoq litho-intellij-plugin.zip -d tmp # 解包插件发行 zip # 逐个解压 lib 目录下的所有 jar再重新打包为单一 litho-intellij-plugin.jar jar -cf $_JAR -C tmp . # 最后把该 jar 复制到 -p 参数指定的 output_path cp $_JAR $OPTARG也就是说buildPlugin.sh会把 IntelliJ 插件任务产出的多 jar 发行包合并成一个扁平化的litho-intellij-plugin.jar再拷贝到目标 IDE 插件目录。底层由 litho-intellij-plugin/build.gradle 驱动其中几个关键配置值得注意plugins { id org.jetbrains.intellij version 1.17.4 // IntelliJ 平台 Gradle 插件 } intellij { version 2024.1 // 用于编译/测试的 IDEA 平台版本 updateSinceUntilBuild false plugins [java, org.jetbrains.kotlin,] // 声明对 Java 与 Kotlin 模块的依赖 } dependencies { implementation project(:litho-annotations) // Litho 注解定义 implementation project(:litho-processor) // Spec 模型与代码生成处理器 implementation project(:litho-sections-annotations) implementation project(:litho-sections-processor) implementation deps.javapoet // JavaPoet 用于生成源码文本 }该模块直接复用了litho-processor、litho-sections-processor中的 Spec 模型工厂这正是插件能在 IDE 内复现编译期代码生成的关键——它把注解处理器的模型层搬到了 IDE 进程里。构建过程还包含一个merge任务把 litho-intellij-plugin/src/main/resources/META-INF/redsymbols.xml 中声明的红色符号解析扩展与动作合并进主plugin.xml因此红色符号相关功能是默认包含在 Gradle 产物中的。BUCK构建不含文件生成特性的精简版BUCK 构建产出的是功能受限的精简插件不含文件生成file generation特性$ buck build litho-intellij --out output_path对应的构建定义见 litho-intellij-plugin/BUCKfb_java_binary( name litho-intellij-plugin, blocklist [ ^kotlin.*, org.intellij.lang.annotations, org.jetbrains.annotations, ], deps [make_dep_path(litho-intellij-plugin/src/main:main)], )从源码结构看BUCK 目标通过blocklist排除了 Kotlin 相关依赖Kotlin 模板、KComponent 补全等特性自然不在精简版中且不包含redsymbols.xml的合并逻辑。选择构建方式时的参考口径需要完整模板与代码生成能力用 Gradle仅需轻量校验、导航类能力或处于 BUCK 构建体系中时用 BUCK。插件结构与源码架构从 plugin.xml 看 IDE 集成方式插件的入口声明全部集中在 litho-intellij-plugin/src/main/resources/META-INF/plugin.xml它定义了插件 IDcom.facebook.litho.intellij、名称、最低构建版本since-build201即 Android Studio 4.1以及三类扩展点extensionPoints extensionPoint nameeventLogger interfacecom.facebook.litho.intellij.extensions.EventLogger / extensionPoint nametemplateProvider interfacecom.facebook.litho.intellij.extensions.TemplateProvider / extensionPoint nameactionPostProcess interfacecom.facebook.litho.intellij.extensions.ActionPostProcess / /extensionPoints这三个扩展点是插件对外部集成商开放的能力边界eventLogger统一埋点接口默认实现见 litho-intellij-plugin/src/main/java/com/facebook/litho/intellij/logging含防抖日志器DebounceEventLogger有对应测试 DebounceEventLoggerTest.javatemplateProvider注册File - New菜单里的新模板。插件自带四个实现见 litho-intellij-plugin/src/main/java/com/facebook/litho/intellij/actions/templatesGroupSectionSpecTemplateProviderEventTemplateProviderKotlinComponentTemplateProviderKComponentPrimitiveComponentTemplateProvideractionPostProcess在模板创建出 Litho 文件后执行的后处理钩子CHANGELOG 1.8.3 新增。此外plugin.xml还声明了大量com.intellij命名空间下的扩展可按功能域归类为IDE 扩展点插件实现作用annotatorSpecAnnotator、RequiredPropAnnotator、MethodCallAnnotator对 Spec 文件、缺失 Required Props、方法调用做错误标注completion.contributorMethodCompletionContributor、RequiredPropMethodContributor、StatePropCompletionContributor、EventHandlerCompletionContributor、ParamCompletionContributor、EventClassNameCompletionContributor、LayoutSpecMethodParameterAnnotationsContributor、KComponentRequiredPropMethodContributorBuilder 方法、Spec 方法注解、State/Prop 参数、事件类名与 handler 的补全gotoDeclarationHandlerComponentDeclarationHandler、SectionDeclarationHandler、ComponentsMethodDeclarationHandlerCommand-click 从组件/Section/方法跳转到 SpecfindUsagesHandlerFactoryLithoFindUsagesHandlerFactory让 Spec 方法的使用处搜索包含生成类的调用lang.foldingBuilderDefaultPropertyFoldingBuilder折叠展示DefaultProp值localInspectionUppercaseStatePropInspection检查以大写字母开头的参数名lineMarkerProviderRequiredPropLineMarkerProvider在缺失 Required Prop 处显示行标记toolWindowLithoToolWindowFactoryComponentStructureView左侧Litho Spec工具窗口展示 Spec 结构projectConfigurable/projectServiceAppSettingsController/AppSettingsState插件设置页与状态持久化从实现包结构看源码被组织为actions编辑器右键菜单Go To Component、File - New模板组、completion、foldings、inspections、navigation、services、settings、toolwindows、logging、extensions等模块逻辑边界非常清晰。模板动作实现LithoTemplateAction 的关键逻辑模板创建的入口类是 LithoTemplateAction.java它继承 IntelliJ 的CreateFileFromTemplateAction其实现细节体现了插件对 Litho 命名规范的深刻理解Override protected PsiFile createFile(String name, String templateName, PsiDirectory dir) { // 模板会自动追加 Spec 后缀这里避免生成 SpecSpec 之类的重复后缀 if (!classNameSuffix.isEmpty() name.endsWith(classNameSuffix)) { name name.substring(0, name.length() - classNameSuffix.length()); } else if (LithoPluginUtils.isSpecName(name)) { name LithoPluginUtils.getLithoComponentNameFromSpec(name); } // Kotlin 类名与文件名需要保持一致 if (templateName.endsWith(.kt)) { file.setName(nameWithoutSuffix.concat(classNameSuffix).concat(.kt)); } return file; }模板动作组LithoTemplateActionGroup通过TemplateProvider扩展点收集所有模板并按templatePriority排序、插入分隔线最终挂载到 IntelliJ 的NewGroup菜单、位于Kotlin.NewFile之后。postProcess阶段会触发所有ActionPostProcess扩展并上报EVENT_NEW_TEMPLATE日志。组件生成服务把注解处理器搬进 IDE插件核心的代码生成引擎是 ComponentGenerateService.java它被注册为applicationService。该服务维护一个容量为 50 的 LRU 缓存specFqnToModelMap对给定PsiClass依次尝试四种模型工厂private static SpecModel createModel(PsiClass specCls) { final LayoutSpecModel layoutSpecModel LAYOUT_SPEC_MODEL_FACTORY.createWithPsi(...); if (layoutSpecModel ! null) return layoutSpecModel; final MountSpecModel mountSpecModel MOUNT_SPEC_MODEL_FACTORY.createWithPsi(...); if (mountSpecModel ! null) return mountSpecModel; final GroupSectionSpecModel groupSectionSpecModel GROUP_SECTION_SPEC_MODEL_FACTORY.createWithPsi(...); if (groupSectionSpecModel ! null) return groupSectionSpecModel; return DIFF_SECTION_SPEC_MODEL_FACTORY.createWithPsi(specCls.getProject(), specCls); }其中四种工厂——PsiLayoutSpecModelFactory、PsiMountSpecModelFactory、PsiGroupSectionSpecModelFactory、PsiDiffSectionSpecModelFactory——位于 litho-intellij-plugin/src/main/java/com/facebook/litho/intellij/specmodels/processor 包内它们在 PSIProgram Structure Interface之上解析注解与方法构建出与编译期注解处理器完全一致的SpecModel。拿到模型后用 JavaPoet 生成组件源码TypeSpec typeSpec specModel.generate(RunMode.normal()); return JavaFile.builder(pkgName, typeSpec).skipJavaLangImports(true).build().toString();这与 Litho 官方litho-processor的生成路径见仓库内 litho-processor/src/main/java同源保证了 IDE 内生成结果与真实编译产物的一致性。生成结果再配合redsymbols.xml中的ComponentFinder、ComponentShortNamesCache、FileGeneratingAnnotator等扩展实现“红色符号即时消除”ResolveLithoRedSymbolsActionResolve Litho Red Symbols与GenerateComponentActionRegenerate Component两个动作被合并进litho.EditorPopupMenu右键菜单可以从 litho-intellij-plugin/src/main/resources/META-INF/redsymbols.xml 中确认。方法补全模板库覆盖三大 Spec 类型的全部生命周期方法方法补全背后是一份精心维护的模板库定义在 litho-intellij-plugin/src/main/resources/methodTemplates/methods.xml 中。按 Spec 类型可以划分为三组LayoutSpec 方法模板OnAttached、OnCreateInitialState、OnCreateLayout、OnCreateLayoutWithSizeSpec、OnCreateTransition、OnDetached、OnUpdateState、OnUpdateStateWithTransition以及树级能力OnCreateTreeProp、事件相关OnEvent、OnTrigger和错误处理OnError、OnLoadStyle等。MountSpec 方法模板OnCreateMountContent、OnPrepare、OnBoundsDefined、OnUnbind、OnBind、OnUnmount、OnMeasure、ShouldUpdate、OnCalculateCachedValue、OnCreateMountContentPool以及工作区间Working Range三件套OnRegisterRanges、OnEnteredRange、OnExitedRange和无障碍相关模板。SectionSpec / GroupSectionSpec 方法模板OnCreateChildren、OnCreateService、OnBindService、OnUnbindService、OnDataBound、OnDataRendered、OnViewportChanged、OnRefresh。这些模板并非静态字符串——它们包含placeholder_*占位符如placeholder_type、placeholder_annotation_class、placeholder_from_event_parameter由MethodCompletionContributor、OnEventGenerateUtils、FromEventParameterProvider/FromTriggerParameterProvider/FromParameterProvider等补全逻辑见 litho-intellij-plugin/src/main/java/com/facebook/litho/intellij/completion在插入时代入真实的类型与参数因此能生成直接可编译的方法骨架。CHANGELOG 显示该方法补全能力是逐版本扩展的从 1.5.1 的 LayoutSpec 八方法到 1.8.0 加入 GroupSectionSpec 全套方法补全再到 1.8.5 增加 KComponents 与 Litho widget wrapper 的 Required Props 补全。检查Inspections与导航让 IDE 成为 Spec 的“编译期预演”插件的错误检查体系由inspections包承载在 litho-intellij-plugin/src/main/java/com/facebook/litho/intellij/inspections 下可以找到SpecAnnotator对 Spec 文件做整体校验错误标注的同时会触发组件重新生成1.5.8 起RequiredPropAnnotator定位缺失 Required Prop 的调用语句配合AddArgumentFix提供 Quick FixRequiredPropLineMarkerProvider在行上给出缺失提示MethodCallAnnotator检查方法调用合法性UppercaseStatePropInspection作为localInspection注册提示大写开头的参数名组名为 “Litho”。导航侧navigation包中的ComponentDeclarationHandler、SectionDeclarationHandler、ComponentsMethodDeclarationHandler实现了从生成类/方法到 Spec 的双向跳转LithoFindUsagesHandlerFactory则让 Spec 方法的 Find Usages 结果包含生成类的调用点。这两个能力早在 0.0.1 版本Command-click 跳转与 1.5.1 版本方法级导航与使用处联动就已引入是整个插件体验的基础设施。配套的还有一个Litho Spec工具窗口toolwindows包LithoToolWindowFactory与ComponentStructureView在 IDE 左侧边栏实时展示当前 Spec 的结构树并随文件编辑自动更新1.5.7 起支持自动刷新。CHANGELOG 中从 1.5.4LayoutSpec 结构窗口到 1.8.1GroupSectionSpec 结构窗口再到 1.8.5DiffSectionSpec 结构窗口的演进说明该窗口已覆盖全部四类 Spec。功能演进一览从 CHANGELOG 看插件能力版图仓库内的 litho-intellij-plugin/CHANGELOG.md 记录了从 0.0.12019-04到 1.8.62021-12的完整版本历史可以提炼出插件能力的扩张脉络模板与生成0.0.1 起支持File - New菜单创建 Litho Layout Component0.0.2 加入 Mount Component 与 GroupSection Component 选项1.4.1 增加 Event 模板并把各模板拆为独立菜单项1.5.7 增加 Kotlin LayoutSpec 模板1.8.1 引入 “Resolve Litho Red Symbols” 与 “Regenerate Component” 的 GroupSectionSpec 支持代码补全0.0.1 起提供Prop/State参数补全与DefaultProp折叠0.0.2 支持 ClickEvent handler 补全1.1.0 引入带 Required Props 的 Builder 补全并高亮必填 setter1.5.1 补齐 LayoutSpec 方法注解补全1.8.0 加入 GroupSectionSpec 方法补全分析与导航0.0.2 开启 LayoutSpec 实时错误检查1.5.1 加入 Component 方法与 Spec 方法互跳、Find Usages 联动1.5.4 增加 LayoutSpec 结构工具窗口红色符号解析1.4.0 是里程碑版本引入内存组件生成、红色符号更新、补全与 Find Usages 对内存组件的支持、RegenerateComponent 兜底生成、文件系统变化时清理缓存等一整套机制1.5.0 起支持通过设置页自动解析红色符号AppSettingsState持久化。测试与本地开发仓库为插件配套了 JUnit 测试与测试数据测试入口脚本 litho-intellij-plugin/testPlugin.sh 执行../gradlew :litho-intellij-plugin:test单元测试分布在 litho-intellij-plugin/src/test/java 下覆盖ParamCompletionContributor、RequiredPropMethodContributor、ReplacingConsumer、DebounceEventLogger、AnnotatorUtils、PsiTypeUtils等核心类测试样例 Spec 放在 litho-intellij-plugin/testdata按能力分为completion、file、inspections、processor四组例如OnClickEventCompletionSpec.java、GroupSectionSpecAnnotatorSpec.java、DelegateMethodExtractionClass.java是验证补全、检查与模型提取逻辑的稳定输入。结语litho-intellij-plugin把 Litho 的编译期代码生成逻辑litho-processor/litho-sections-processor以 IDE 插件的形式搬进编辑器进程配合模板、补全、检查、导航、结构视图与红色符号解析构成了完整的 Litho 开发闭环。无论你是想通过 Marketplace 一键安装、用buildPlugin.sh -p output_path手动构建最新版还是希望基于TemplateProvider、EventLogger、ActionPostProcess三个扩展点做二次集成都可以从本文梳理的源码路径出发在仓库的 litho-intellij-plugin 目录下继续深入阅读。赞分享移动开发UI组件【免费下载链接】lithoA declarative framework for building efficient UIs on Android.项目地址https://gitcode.com/gh_mirrors/li/litho点击查看免费下载相关推荐Litho 的 Android Studio 插件litho-intellij-plugin全解析Spec API 生成代码的 IDE 辅助与 Kotlin API 文件模板Litho 的 Android Studio 插件litho intellij plugin全解析Spec API 生成代码的 IDE 辅助与 Kotli移动开发UI组件IntelliJ IDEA插件 Inspection Plugin 安装与使用指南IntelliJ IDEA插件 Inspection Plugin 安装与使用指南 1. 项目目录结构及介绍 该项目基于GitHub仓库 JetBrains/iBuck ideabuck 插件指南安装、本地构建与 IntelliJ 插件开发全流程Buck ideabuck 插件指南安装、本地构建与 IntelliJ 插件开发全流程 ideabuck 是 Buck 构建系统官方的 IntelliJ 插件开发工具构建工具上一篇Xournal手写笔记软件3分钟掌握免费PDF标注与数学公式编辑下一篇从零开始ComfyUI-Impact-Pack V8全面指南解锁AI图像增强的无限可能创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考