云计算（一）：弹性计算概述

云计算（一）：弹性计算概述

背景

在实际场景中，经常会出现短时间内资源需求爆发式增长或长时间内资源需求不断增长，这时需要资源供给时刻满足需求的变化，保障业务正常运行。传统的供给方式，类似于“计划经济”，在一定时间内预测资源需求量，并调整供给量，然而这种方法的供给量相对固定，且周期较长。传统方法不仅无法动态分配和释放资源，并且由于周期内供给量需要满足大于需求量的最大值，这样就会存在着资源浪费或业务受损的风险。

为了使计算能力能够根据负载的变化而自动调整，以实现更高的效率和更低的成本。弹性计算在过去几年中发展迅速，现在已经成为了云计算领域的一个重要组成部分。早期的弹性计算主要是基于虚拟化的技术，而现在更多地采用容器化和微服务架构，以更好地满足业务需求的变化。此外，弹性计算也在不断地改进和发展，例如添加了更多的自动化功能，提高了安全性，并且引入了人工智能和机器学习算法来提高系统的可靠性和可用性。在未来几年中，预计弹性计算将进一步发展和完善，以更好地满足企业的业务需求。

含义

弹性计算是一种云计算概念，其中计算资源可以在需要时轻松扩展或缩小，由云服务提供商随时提供灵活的计算能力。它可以支持系统扩展或缩减资源以达到最优利用效果，从而提高系统性能和服务质量，同时还可以减少系统成本。此外，它还允许用户在高峰期迅速扩展资源，而在低峰期则可以缩小资源，这样可以有效避免资源浪费。

弹性计算的主要优势包括以下几点：

  • 提高系统性能：通过动态调整计算资源，可以使系统的运行更加稳定，提高系统性能。
  • 降低运营成本：企业可以根据实际需求来灵活地调整资源，而不是购买过多的设备和维护费用。
  • 增强业务敏捷性：弹性计算可以更快地响应市场变化，帮助企业抓住商业机会。
  • 改善服务质量：当出现突发流量时，弹性计算可以帮助企业快速应对，并确保服务质量和用户体验。

原理

依托于计算机技术的发展，弹性计算可以通过以下几种方式来实现：

  1. 虚拟化：虚拟化技术可以让一台物理机器虚拟出多个虚拟机，这些虚拟机可以共享物理机器的硬件资源，以更好地利用计算资源。
  2. 容器化：容器化技术可以把应用和它们所依赖的环境打包成一个可移植的容器，这样就可以更容易地把应用程序部署到多台机器上。
  3. 自动化：自动化工具可以让企业自动部署和配置应用程序，以便更好地适应业务需求的变化。

弹性计算的原理涉及到资源的动态分配和释放，以满足不断变化的工作负载。搭建一个支持弹性计算的系统，通常需要以下几个部分：

  1. 自动伸缩策略
    弹性计算系统通过实施自动伸缩策略，根据工作负载的变化自动调整计算资源。这包括两个主要方面：
    垂直伸缩： 在单个服务器或虚拟机上增加或减少资源，例如CPU、内存等。这种方式适用于需要更多计算资源的情况。
    水平伸缩： 向系统中添加或移除计算节点，通常采用虚拟机实例或容器。这种方式适用于需要处理更多并发请求的情况。
  2. 监控和预测
    弹性计算系统通过实时监控和度量工作负载的状况来触发自动伸缩。监控项可能包括CPU利用率、内存使用率、网络流量等。当这些指标超过或低于预设的阈值时，系统会触发相应的伸缩操作。同时，利用预测工具和算法（机器学习、动态规划等）可以预测未来的负载和压力，以便提前调整计算资源。
  3. 弹性存储
    弹性计算不仅仅局限于计算资源，还包括存储。系统需要能够根据需要动态调整存储容量，以适应数据量的变化。这可以通过存储虚拟化或云存储服务来实现。
  4. 按需付费
    弹性计算系统面向用户端需要设计一个按需付费模型。用户只需支付实际使用的计算资源，而不是事先预留一定的资源。这种模型使得成本与实际需求相匹配，避免了资源浪费。
  5. 自动化管理
    弹性计算系统的实现依赖于自动化管理。这包括自动配置、自动部署、自动监控和自动修复等功能。通过自动化，系统可以更快速、可靠地响应变化，减少人为干预的需求。
  6. 弹性计算平台
    弹性计算系统通常在云平台上实现，如云计算服务提供商的弹性计算实例。这些平台提供了各种弹性计算服务，使用户能够根据需要灵活配置和管理计算资源。

应用

弹性计算的实际应用案例：

  1. 电子商务网站：电子商务网站经常面临高峰时期的大量流量，而弹性计算可以根据实际情况动态扩展或收缩计算资源，从而保证网站的正常运行。
  2. 在线教育平台：在线教育平台也需要处理大量的并发请求，而弹性计算可以帮助平台及时应对这种状况，并确保服务的可用性。
  3. 游戏公司：游戏公司的服务器也经常会面临高峰时期的流量压力，而弹性计算可以帮助公司快速应对这种情况，确保玩家的游戏体验不受影响。
  4. 网络安全公司：网络安全公司也需要处理大量的数据和请求，而弹性计算可以帮助公司及时响应这种情况，并确保安全保护措施的有效性。
id="article_content" class="article_content clearfix"> id="content_views" class="htmledit_views">

 一、Toggle

Toggle组件是一个交互式UI组件，用于切换两种状态之间的选择或开关。它通常用于表示开关按钮，例如在设置中启用或禁用某些选项。

在Toggle组件中，用户可以点击按钮来切换状态，或者使用键盘或其他输入设备上的快捷键。通常，Toggle组件会在用户点击或切换状态时触发一个事件，以便应用程序可以响应此更改。

Toggle组件通常包含以下属性：

  • type：表示当前Toggle组件类型。
  • isOn：表示当前Toggle组件选中的状态。
  • onChange：在Toggle组件状态改变时触发的事件处理函数。

1.创建切换按钮

语法说明：

Toggle(options: { type: ToggleType, isOn?: boolean })
 class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)">

使用：

  1.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="1">
class="hljs-ln-code"> class="hljs-ln-line">@Entry
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="2">
    • class="hljs-ln-code"> class="hljs-ln-line">@Component
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="3"> class="hljs-ln-code"> class="hljs-ln-line">struct Index {
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="4"> class="hljs-ln-code"> class="hljs-ln-line"> build() {
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="5"> class="hljs-ln-code"> class="hljs-ln-line"> Row() {
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="6"> class="hljs-ln-code"> class="hljs-ln-line"> Column(){
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="7"> class="hljs-ln-code"> class="hljs-ln-line"> Row(){
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="8"> class="hljs-ln-code"> class="hljs-ln-line"> Toggle({ type: ToggleType.Checkbox, isOn: false })
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="9"> class="hljs-ln-code"> class="hljs-ln-line"> Toggle({ type: ToggleType.Checkbox, isOn: true })
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="10"> class="hljs-ln-code"> class="hljs-ln-line"> }
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="11"> class="hljs-ln-code"> class="hljs-ln-line"> Row(){
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="12"> class="hljs-ln-code"> class="hljs-ln-line"> Toggle({ type: ToggleType.Switch, isOn: false })
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="13"> class="hljs-ln-code"> class="hljs-ln-line"> Toggle({ type: ToggleType.Switch, isOn: true })
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="14"> class="hljs-ln-code"> class="hljs-ln-line"> }
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="15"> class="hljs-ln-code"> class="hljs-ln-line"> Row(){
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="16"> class="hljs-ln-code"> class="hljs-ln-line"> Toggle({ type: ToggleType.Button, isOn: false }) {
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="17"> class="hljs-ln-code"> class="hljs-ln-line"> Text('status button')
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="18"> class="hljs-ln-code"> class="hljs-ln-line"> .fontColor('#182431')
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="19"> class="hljs-ln-code"> class="hljs-ln-line"> .fontSize(12)
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="20"> class="hljs-ln-code"> class="hljs-ln-line"> }.width(100)
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="21"> class="hljs-ln-code"> class="hljs-ln-line"> Toggle({ type: ToggleType.Button, isOn: true }) {
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="22"> class="hljs-ln-code"> class="hljs-ln-line"> Text('status button')
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="23"> class="hljs-ln-code"> class="hljs-ln-line"> .fontColor('#182431')
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="24"> class="hljs-ln-code"> class="hljs-ln-line"> .fontSize(12)
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="25"> class="hljs-ln-code"> class="hljs-ln-line"> }.width(100)
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="26"> class="hljs-ln-code"> class="hljs-ln-line"> }
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="27"> class="hljs-ln-code"> class="hljs-ln-line"> }
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="28"> class="hljs-ln-code"> class="hljs-ln-line"> }.height('100%').width('100%').justifyContent(FlexAlign.Center)
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="29"> class="hljs-ln-code"> class="hljs-ln-line"> }
  • class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="30"> class="hljs-ln-code"> class="hljs-ln-line">}
    •  class="hide-preCode-box"> class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)">

    在这里插入图片描述
    ToggleType为Button时，只能包含一个子组件，如果子组件有文本设置，则相应的文本内容会显示在按钮内部。

    2.自定义样式

    1.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="1"> class="hljs-ln-code"> class="hljs-ln-line">@Entry
    2.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="2"> class="hljs-ln-code"> class="hljs-ln-line">@Component
    3.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="3"> class="hljs-ln-code"> class="hljs-ln-line">struct Index {
    4.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="4"> class="hljs-ln-code"> class="hljs-ln-line">  build() {
    5.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="5"> class="hljs-ln-code"> class="hljs-ln-line">    Row() {
    6.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="6"> class="hljs-ln-code"> class="hljs-ln-line">      Column(){
    7.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="7"> class="hljs-ln-code"> class="hljs-ln-line">        Row(){
    8.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="8"> class="hljs-ln-code"> class="hljs-ln-line">          Toggle({ type: ToggleType.Button, isOn: true }) {
    9.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="9"> class="hljs-ln-code"> class="hljs-ln-line">            Text('status button')
    10.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="10"> class="hljs-ln-code"> class="hljs-ln-line">              .fontColor('#182431')
    11.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="11"> class="hljs-ln-code"> class="hljs-ln-line">              .fontSize(12)
    12.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="12"> class="hljs-ln-code"> class="hljs-ln-line">          }.width(100).selectedColor(Color.Pink)
    13.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="13"> class="hljs-ln-code"> class="hljs-ln-line">          Toggle({ type: ToggleType.Checkbox, isOn: true })
    14.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="14"> class="hljs-ln-code"> class="hljs-ln-line">            .selectedColor(Color.Pink)
    15.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="15"> class="hljs-ln-code"> class="hljs-ln-line">          Toggle({ type: ToggleType.Switch, isOn: true })
    16.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="16"> class="hljs-ln-code"> class="hljs-ln-line">            .selectedColor(Color.Pink)
    17.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="17"> class="hljs-ln-code"> class="hljs-ln-line">        }
    18.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="18"> class="hljs-ln-code"> class="hljs-ln-line">        Row(){
    19.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="19"> class="hljs-ln-code"> class="hljs-ln-line">          Toggle({ type: ToggleType.Switch, isOn: false })
    20.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="20"> class="hljs-ln-code"> class="hljs-ln-line">            .switchPointColor(Color.Pink)
    21.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="21"> class="hljs-ln-code"> class="hljs-ln-line">          Toggle({ type: ToggleType.Switch, isOn: true })
    22.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="22"> class="hljs-ln-code"> class="hljs-ln-line">            .switchPointColor(Color.Pink)
    23.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="23"> class="hljs-ln-code"> class="hljs-ln-line">        }
    24.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="24"> class="hljs-ln-code"> class="hljs-ln-line">      }
    25.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="25"> class="hljs-ln-code"> class="hljs-ln-line">    }.height('100%').width('100%').justifyContent(FlexAlign.Center)
    26.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="26"> class="hljs-ln-code"> class="hljs-ln-line">  }
    27.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="27"> class="hljs-ln-code"> class="hljs-ln-line">}
     class="hide-preCode-box"> class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)">

    在这里插入图片描述
    switchPointColor属性设置Switch类型的圆形滑块颜色，仅对type为ToggleType.Switch生效

    3.添加事件

    1.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="1"> class="hljs-ln-code"> class="hljs-ln-line">Toggle({ type: ToggleType.Switch, isOn: false })
    2.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="2"> class="hljs-ln-code"> class="hljs-ln-line">  .onChange((isOn: boolean) => {
    3.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="3"> class="hljs-ln-code"> class="hljs-ln-line">      if(isOn) {
    4.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="4"> class="hljs-ln-code"> class="hljs-ln-line">        // 需要执行的操作
    5.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="5"> class="hljs-ln-code"> class="hljs-ln-line">      }
    6.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="6"> class="hljs-ln-code"> class="hljs-ln-line">  })
     class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)">

    Toggle通常用于选中和取消选中后触发某些操作，可以绑定onChange事件来响应操作后的自定义行为

    4.场景示例

    Toggle按钮通常用于控制一个开关状态的UI控件，例如：

    1. 网页中的深色模式开关：当用户点击Toggle按钮时，页面将切换到深色模式或浅色模式。

    2. 移动应用中的静音开关：当用户点击Toggle按钮时，应用会将声音静音或取消静音。

    3. 音乐播放器中的播放/暂停开关：当用户点击Toggle按钮时，播放器会开始或暂停音乐的播放。

    4. 在网页表单中，使用Toggle按钮来切换显示密码或隐藏密码。

    5. 在网页应用程序中，使用Toggle按钮来控制菜单的打开或关闭状态。

    Toggle按钮适用于任何需要控制一个开关状态的UI控件的场景，方便用户快速进行相关操作。

    案例如下：

    1.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="1"> class="hljs-ln-code"> class="hljs-ln-line">import promptAction from '@ohos.promptAction';
    2.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="2"> class="hljs-ln-code"> class="hljs-ln-line">@Entry
    3.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="3"> class="hljs-ln-code"> class="hljs-ln-line">@Component
    4.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="4"> class="hljs-ln-code"> class="hljs-ln-line">struct Index {
    5.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="5"> class="hljs-ln-code"> class="hljs-ln-line">  build() {
    6.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="6"> class="hljs-ln-code"> class="hljs-ln-line">    Column() {
    7.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="7"> class="hljs-ln-code"> class="hljs-ln-line">      Row() {
    8.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="8"> class="hljs-ln-code"> class="hljs-ln-line">        Text("Bluetooth Mode")
    9.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="9"> class="hljs-ln-code"> class="hljs-ln-line">          .height(50)
    10.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="10"> class="hljs-ln-code"> class="hljs-ln-line">          .fontSize(16)
    11.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="11"> class="hljs-ln-code"> class="hljs-ln-line">      }
    12.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="12"> class="hljs-ln-code"> class="hljs-ln-line">      Row() {
    13.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="13"> class="hljs-ln-code"> class="hljs-ln-line">        Text("Bluetooth")
    14.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="14"> class="hljs-ln-code"> class="hljs-ln-line">          .height(50)
    15.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="15"> class="hljs-ln-code"> class="hljs-ln-line">          .padding({left: 10})
    16.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="16"> class="hljs-ln-code"> class="hljs-ln-line">          .fontSize(16)
    17.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="17"> class="hljs-ln-code"> class="hljs-ln-line">          .textAlign(TextAlign.Start)
    18.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="18"> class="hljs-ln-code"> class="hljs-ln-line">          .backgroundColor(0xFFFFFF)
    19.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="19"> class="hljs-ln-code"> class="hljs-ln-line">        Toggle({ type: ToggleType.Switch })
    20.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="20"> class="hljs-ln-code"> class="hljs-ln-line">          .margin({left: 200, right: 10})
    21.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="21"> class="hljs-ln-code"> class="hljs-ln-line">          .onChange((isOn: boolean) => {
    22.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="22"> class="hljs-ln-code"> class="hljs-ln-line">            if(isOn) {
    23.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="23"> class="hljs-ln-code"> class="hljs-ln-line">              promptAction.showToast({ message: 'Bluetooth is on.' })
    24.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="24"> class="hljs-ln-code"> class="hljs-ln-line">            } else {
    25.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="25"> class="hljs-ln-code"> class="hljs-ln-line">              promptAction.showToast({ message: 'Bluetooth is off.' })
    26.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="26"> class="hljs-ln-code"> class="hljs-ln-line">            }
    27.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="27"> class="hljs-ln-code"> class="hljs-ln-line">          })
    28.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="28"> class="hljs-ln-code"> class="hljs-ln-line">      }
    29.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="29"> class="hljs-ln-code"> class="hljs-ln-line">      .backgroundColor(0xFFFFFF)
    30.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="30"> class="hljs-ln-code"> class="hljs-ln-line">    }
    31.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="31"> class="hljs-ln-code"> class="hljs-ln-line">    .padding(10)
    32.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="32"> class="hljs-ln-code"> class="hljs-ln-line">    .backgroundColor(0xDCDCDC)
    33.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="33"> class="hljs-ln-code"> class="hljs-ln-line">    .width('100%')
    34.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="34"> class="hljs-ln-code"> class="hljs-ln-line">    .height('100%')
    35.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="35"> class="hljs-ln-code"> class="hljs-ln-line">  }
    36.  class="hljs-ln-numbers"> class="hljs-ln-line hljs-ln-n" data-line-number="36"> class="hljs-ln-code"> class="hljs-ln-line">}
     class="hide-preCode-box"> class="hljs-button signin active" data-title="登录复制" data-report-click="{"spm":"1001.2101.3001.4334"}" onclick="hljs.signin(event)">

    在这里插入图片描述

     🚀写在最后

    data-report-view="{"mod":"1585297308_001","spm":"1001.2101.3001.6548","dest":"https://blog.csdn.net/shudaoshanQAQ/article/details/135409484","extend1":"pc","ab":"new"}">> id="blogExtensionBox" style="width:400px;margin:auto;margin-top:12px" class="blog-extension-box"> class="blog_extension blog_extension_type2" id="blog_extension"> class="extension_official" data-report-click="{"spm":"1001.2101.3001.6471"}" data-report-view="{"spm":"1001.2101.3001.6471"}"> class="blog_extension_card_left"> class="blog_extension_card_cont"> 最新鸿蒙Next全套学习资料请扫码 class="blog_extension_card_cont_r"> 微信名片
    注：本文转载自blog.csdn.net的AI Player的文章"https://blog.csdn.net/weixin_43603658/article/details/134405218"。版权归原作者所有，此博客不拥有其著作权，亦不承担相应法律责任。如有侵权，请联系我们删除。
    复制链接
    复制链接
    相关推荐
    发表评论

    评论记录：

    未查询到任何数据！