IDEA又出新神器，一套代码适应多端

　　JetBrains新推出一款基于多端的UI调试工具，一套代码适应多端，真的是太棒了，下面分享给大家。前言
　　该工具是大名鼎鼎的JetBrains公司新推出的，名曰：JetpackComposeforWeb，官方介绍称此项目基于Google现代UI工具包JetpackCompose，支持使用Kotlin编写响应式WebUI。
　　JetpackCompose是用于构建原生界面的新款Android工具包。它可简化并加快Android上的界面开发。使用更少的代码、强大的工具和直观的KotlinAPI，快速让应用生动而精彩。
　　UI代码和预览如下图所示：
　　据介绍，JetpackComposeforWeb可简化并加速Web应用的UI开发，目标是在Web、桌面和AndroidAPP之间实现UI代码共享，一套代码适应多端。目前处于技术预览阶段。fungreet（）listOf（Hello，Hallo，Hola，Servus）。random（）renderComposable（greetingContainer）｛vargreetingbyremember｛mutableStateOf（greet（））｝Button（attrs｛onClick｛greetinggreet（）｝｝）｛Text（greeting）｝｝Result：Servus
　　942。png使用ComposeforWeb构建用户界面
　　借助ComposeforWeb，开发者通过使用Kotlin并应用JetpackCompose的概念和API为Web构建响应式用户界面，以表达应用程序的状态、行为和逻辑。可组合的DOMAPI通过DOM元素和HTML标签表达设计和布局使用类型安全的HTMLDSL构建UI表示形式通过使用类型安全的CSSDSL创建样式表来完全控制应用程序的外观通过DOM子树与其他JavaScript库集成funmain（）｛renderComposable（root）｛varplatformbyremember｛mutableStateOf（aplatform）｝P｛Text（WelcometoComposeforplatform！）Button（attrs｛onClick｛platformWeb｝｝）｛Text（。。。forwhat？）｝｝A（https：www。jetbrains。comlpcomposeweb）｛Text（Learnmore！）｝｝｝
　　943。png具有Web支持的多平台小部件
　　通过利用Kotlin的Expectactual机制来提供特定于平台的实现，从而使用和构建可在Android、桌面和Web上运行的Compose小部件
　　处于实验性阶段的一组布局原语（layoutprimitives）和API，这些原语和API与ComposeforDesktopAndroid的功能相似示例代码
　　使用ComposableDOM编写简单的计数器funmain（）｛valcountmutableStateOf（0）renderComposable（rootElementIdroot）｛Button（attrs｛onClick｛count。valuecount。value1｝｝）｛Text（）｝Span（style｛padding（15。px）｝）｛weuseinlinestylehereText（｛count。value｝）｝Button（attrs｛onClick｛count。valuecount。value1｝｝）｛Text（）｝｝｝声明和使用样式表objectMyStyleSheet：StyleSheet（）｛valcontainerbystyle｛defineaclasscontainerborder（1。px，LineStyle。Solid，Color。RGB（255，0，0））｝｝ComposablefunMyComponent（）｛Div（attrs｛classes（MyStyleSheet。container）usecontainerclass｝）｛Text（Helloworld！）｝｝funmain（）｛renderComposable（rootElementIdroot）｛Style（MyStyleSheet）mountthestylesheetMyComponent（）｝｝声明和使用CSS变量objectMyVariables：CSSVariables｛valcontentBackgroundColorbyvariableColor（）declareavariable｝objectMyStyleSheet：StyleSheet（）｛valcontainerbystyle｛MyVariables。contentBackgroundColor（Color（blue））setitsvalue｝valcontentbystyle｛backgroundColor（MyVariables。contentBackgroundColor。value（））useit｝｝ComposablefunMyComponent（）｛Div（attrs｛classes（MyStyleSheet。container）｝）｛Span（attrs｛classes（MyStyleSheet。content）｝）｛Text（Helloworld！）｝｝｝
　　热门自学前端，java，大数据及项目实战（毕设）教程：
　　https：yjxxt520。github。io