鸿蒙一次开发,多端部署(六)自适应布局

针对常见的开发场景,方舟开发框架提炼了七种自适应布局能力,这些布局可以独立使用,也可多种布局叠加使用。

下面我们依次介绍这几种自适应布局能力。

拉伸能力

拉伸能力是指容器组件尺寸发生变化时,增加或减小的空间全部分配给容器组件内指定区域。

拉伸能力通常通过 Flex布局 中的flexGrow和flexShrink属性实现,flexGrow和flexShink属性常与flexBasis属性搭配使用,故将这三个属性放在一起介绍。

说明:

  • 开发者期望将父容器的剩余空间全部分配给某空白区域时,也可以通过 Blank组件 实现。注意仅当父组件为Row\Column\Flex组件时,Blank组件才会生效。
  • 类Web开发范式也是通过flex-grow和flex-shrink实现拉伸能力,同时也支持配置flex-basis,详见 通用样式 。
  • 类Web开发范式没有提供blank组件,但可以通过div组件模拟blank组件的行为,如“
    ”。

示例1

本示例中的页面由中间的内容区(包含一张图片)以及两侧的留白区组成,各区域的属性配置如下。

  • 中间内容区的宽度设置为400vp,同时将flexGrow属性设置为1,flexShrink属性设置为0。
  • 两侧留白区的宽度设置为150vp,同时将flexGrow属性设置为0,flexShrink属性设置为1。

由上可知,父容器的基准尺寸是700vp(150vp+400vp+150vp)。

可以通过拖动底部的滑动条改变父容器的尺寸,查看布局变化。

  • 当父容器的尺寸大于700vp时,父容器中多余的空间全部分配给中间内容区。
  • 当父容器的尺寸小于700vp时,左右两侧的留白区按照“1:1”的比例收缩(即平均分配父容器的不足空间)。

@Entry
@Component
struct FlexibleCapabilitySample1 {@State containerWidth: number = 402// 底部滑块,可以通过拖拽滑块改变容器尺寸。@Builder slider() {Slider({ value: this.containerWidth, min: 402, max: 1000, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').onChange((value: number) => {this.containerWidth = value;}).position({ x: '20%', y: '80%' })}build() {Column() {Column() {Row() {// 通过flexGrow和flexShrink属性,将多余的空间全部分配给图片,将不足的控件全部分配给两侧空白区域。Row().width(150).height(400).backgroundColor('#FFFFFF').flexGrow(0).flexShrink(1)Image($r("app.media.illustrator")).width(400).height(400).objectFit(ImageFit.Contain).backgroundColor("#66F1CCB8").flexGrow(1).flexShrink(0)Row().width(150).height(400).backgroundColor('#FFFFFF').flexGrow(0).flexShrink(1)}.width(this.containerWidth).justifyContent(FlexAlign.Center).alignItems(VerticalAlign.Center)}this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

示例2

文字和开关的尺寸固定,仅有中间空白区域(Blank组件)随父容器尺寸变化而伸缩。

@Entry
@Component
struct FlexibleCapabilitySample2 {@State rate: number = 0.8// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: this.rate * 100, min: 30, max: 80, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').onChange((value: number) => {this.rate = value / 100;}).position({ x: '20%', y: '80%' })}build() {Column() {Column() {Row() {Text('飞行模式').fontSize(16).width(135).height(22).fontWeight(FontWeight.Medium).lineHeight(22)Blank()      // 通过Blank组件实现拉伸能力Toggle({ type: ToggleType.Switch }).width(36).height(20)}.height(55).borderRadius(12).padding({ left: 13, right: 13 }).backgroundColor('#FFFFFF').width(this.rate * 100 + '%')}this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

均分能力

均分能力是指容器组件尺寸发生变化时,增加或减小的空间均匀分配给容器组件内所有空白区域。它常用于内容数量固定、均分显示的场景,比如工具栏、底部菜单栏等。

均分能力可以通过将 Row组件 、 Column组件 或 Flex组件 的justifyContent属性设置为FlexAlign.SpaceEvenly实现,即子元素在父容器主轴方向等间距布局,相邻元素之间的间距、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样。

说明:

  • 均分能力还可以通过其它方式实现,如使用 Grid网格组件 或在每个组件间添加Blank组件等。
  • 类Web开发范式中,通过将 div组件 的justify-content属性设置为space-evenly来实现均分布局。

示例:

父容器尺寸变化过程中,图标及文字的尺寸不变,图标间的间距及图标离左右边缘的距离同时均等改变。

@Entry
@Component
struct EquipartitionCapabilitySample {readonly list: number [] = [0, 1, 2, 3]@State rate: number = 0.6// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: this.rate * 100, min: 30, max: 60, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').onChange((value: number) => {this.rate = value / 100}).position({ x: '20%', y: '80%' })}build() {Column() {Column() {// 均匀分配父容器主轴方向的剩余空间Row() {ForEach(this.list, (item:number) => {Column() {Image($r("app.media.icon")).width(48).height(48).margin({ top: 8 })Text('App name').width(64).height(30).lineHeight(15).fontSize(12).textAlign(TextAlign.Center).margin({ top: 8 }).padding({ bottom: 15 })}.width(80).height(102).flexShrink(1)})}.width('100%').justifyContent(FlexAlign.SpaceEvenly)// 均匀分配父容器主轴方向的剩余空间Row() {ForEach(this.list, (item:number) => {Column() {Image($r("app.media.icon")).width(48).height(48).margin({ top: 8 })Text('App name').width(64).height(30).lineHeight(15).fontSize(12).textAlign(TextAlign.Center).margin({ top: 8 }).padding({ bottom: 15 })}.width(80).height(102).flexShrink(1)})}.width('100%').justifyContent(FlexAlign.SpaceEvenly)}.width(this.rate * 100 + '%').height(222).padding({ top: 16 }).backgroundColor('#FFFFFF').borderRadius(16)this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

占比能力

占比能力是指子组件的宽高按照预设的比例,随父容器组件发生变化。

占比能力通常有两种实现方式:

  • 将子组件的宽高设置为父组件宽高的百分比,详见尺寸设置 及 长度类型 。

  • 通过layoutWeight属性配置互为兄弟关系的组件在父容器主轴方向的布局权重,详见 尺寸设置。

    • 当父容器尺寸确定时,其子组件按照开发者配置的权重比例分配父容器中主轴方向的空间。
    • 仅当父容器是Row、Column或者Flex时,layoutWeight属性才会生效。
    • 设置layoutWeight属性后,组件本身的尺寸会失效。比如同时设置了.width(‘40%’)和.layoutWeight(1),那么只有.layoutWeight(1)会生效。

layoutWeight存在使用限制,所以实际使用过程中大多通过将子组件宽高设置为父组件的百分比来实现占比能力。

说明:

  • 占比能力在实际开发中使用的非常广泛,可以通过很多不同的方式实现占比能力,如还可以通过 Grid组件 的columnsTemplate属性设置网格容器中列的数量及其宽度比例,或通过配置子组件在栅格(本章后文将详细介绍栅格系统)中占据不同的列数来实现占比能力。本小节仅介绍最基础和常用的实现方式,局限性较大或比非常小众的实现方式,本文不做展开介绍。
  • 类Web开发范式同样支持以百分比的形式设置组件的宽高,详见 通用样式 中关于width和height的介绍以及 长度类型介绍。
  • 与声明式开发范式中的layoutWeight属性类似,类Web开发范式提供了 flex-weight样式 用于配置互为兄弟关系的组件在父容器主轴方向的布局权重。

示例:

简单的播放控制栏,其中“上一首”、“播放/暂停”、“下一首”的layoutWeight属性都设置为1,因此它们按照“1:1:1”的比例均分父容器主轴方向的空间。

将三个按钮的.layoutWeight(1)分别替换为.width(‘33%’)、.width(‘34%’)、.width(‘33%’),也可以实现与当前同样的显示效果。

@Entry
@Component
struct ProportionCapabilitySample {@State rate: number = 0.5// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: 100, min: 25, max: 50, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').height(50).onChange((value: number) => {this.rate = value / 100}).position({ x: '20%', y: '80%' })}build() {Column() {Column() {Row() {Column() {Image($r("app.media.down")).width(48).height(48)}.height(96).layoutWeight(1)  // 设置子组件在父容器主轴方向的布局权重.justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)Column() {Image($r("app.media.pause")).width(48).height(48)}.height(96).layoutWeight(1)  // 设置子组件在父容器主轴方向的布局权重.backgroundColor('#66F1CCB8').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)Column() {Image($r("app.media.next")).width(48).height(48)}.height(96).layoutWeight(1)  // 设置子组件在父容器主轴方向的布局权重.justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}.width(this.rate * 100 + '%').height(96).borderRadius(16).backgroundColor('#FFFFFF')}this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

缩放能力

缩放能力是指子组件的宽高按照预设的比例,随容器组件发生变化,且变化过程中子组件的宽高比不变。

缩放能力通过使用百分比布局配合固定宽高比(aspectRatio属性)实现当容器尺寸发生变化时,内容自适应调整。

可以访问 布局约束 ,了解aspectRatio属性的详细信息。

说明: 类Web开发范式同样提供了 aspect-ratio样式 ,用于固定组件的宽高比。

示例:

为方便查看效果,示例中特意给Column组件加了边框。可以看到Column组件随着其Flex父组件尺寸变化而缩放的过程中,始终保持预设的宽高比,其中的图片也始终正常显示。

@Entry
@Component
struct ScaleCapabilitySample {@State sliderWidth: number = 400@State sliderHeight: number = 400// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: this.sliderWidth, min: 100, max: 400, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').height(50).onChange((value: number) => {this.sliderWidth = value;}).position({ x: '20%', y: '80%' })Slider({ value: this.sliderHeight, min: 100, max: 400, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').height(50).onChange((value: number) => {this.sliderHeight = value}).position({ x: '20%', y: '87%' })}build() {Column() {Column() {Column() {Image($r("app.media.illustrator")).width('100%').height('100%')}.aspectRatio(1)                           // 固定宽高比.border({ width: 2, color: "#66F1CCB8"})  // 边框,仅用于展示效果}.backgroundColor("#FFFFFF").height(this.sliderHeight).width(this.sliderWidth).justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)this.slider()}.width('100%').height('100%').backgroundColor("#F1F3F5").justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

延伸能力

延伸能力是指容器组件内的子组件,按照其在列表中的先后顺序,随容器组件尺寸变化显示或隐藏。它可以根据显示区域的尺寸,显示不同数量的元素。

延伸能力通常有两种实现方式:

  • 通过 List组件 实现。

  • 通过 Scroll组件 配合 Row组件 或 Column组件 实现。

说明:

  • List、Row或Column组件中子节点的在页面显示时就已经全部完成了布局计算及渲染,只不过受限于父容器尺寸,用户只能看到一部分。随着父容器尺寸增大,用户可以看到的子节点数目也相应的增加。用户还可以通过手指滑动触发列表滑动,查看被隐藏的子节点。
  • 类Web开发范式同样可以使用 list组件 实现延伸能力。
  • 类Web开发范式没有提供scroll组件,但可以将 div组件 的overflow样式设置为scroll(即div组件主轴方向上子元素的尺寸超过div组件本身的尺寸时进行滚动显示)来模拟scroll组件的行为。

示例:

当父容器的尺寸发生改变时,页面中显示的图标数量随之发生改变。

分别通过List组件实现及通过Scroll组件配合Row组件实现。

(1)通过List组件实现。

@Entry
@Component
struct ExtensionCapabilitySample1 {@State rate: number = 0.60readonly appList: number [] = [0, 1, 2, 3, 4, 5, 6, 7]// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: this.rate * 100, min: 8, max: 60, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').height(50).onChange((value: number) => {this.rate = value / 100}).position({ x: '20%', y: '80%' })}build() {Column() {Row({ space: 10 }) {// 通过List组件实现隐藏能力List({ space: 10 }) {ForEach(this.appList, (item:number) => {ListItem() {Column() {Image($r("app.media.icon")).width(48).height(48).margin({ top: 8 })Text('App name').width(64).height(30).lineHeight(15).fontSize(12).textAlign(TextAlign.Center).margin({ top: 8 }).padding({ bottom: 15 })}.width(80).height(102)}.width(80).height(102)})}.padding({ top: 16, left: 10 }).listDirection(Axis.Horizontal).width('100%').height(118).borderRadius(16).backgroundColor(Color.White)}.width(this.rate * 100 + '%')this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

(2)通过Scroll组件配合Row组件实现。

@Entry
@Component
struct ExtensionCapabilitySample2 {private scroller: Scroller = new Scroller()@State rate: number = 0.60@State appList: number [] = [0, 1, 2, 3, 4, 5, 6, 7]// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: this.rate * 100, min: 8, max: 60, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').height(50).onChange((value: number) => {this.rate = value / 100;}).position({ x: '20%', y: '80%' })}build() {Column() {// 通过Scroll和Row组件实现隐藏能力Scroll(this.scroller) {Row({ space: 10 }) {ForEach(this.appList, () => {Column() {Image($r("app.media.icon")).width(48).height(48).margin({ top: 8 })Text('App name').width(64).height(30).lineHeight(15).fontSize(12).textAlign(TextAlign.Center).margin({ top: 8 }).padding({ bottom: 15 })}.width(80).height(102)})}.padding({ top: 16, left: 10 }).height(118).borderRadius(16).backgroundColor(Color.White)}.scrollable(ScrollDirection.Horizontal).width(this.rate * 100 + '%')this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

隐藏能力

隐藏能力是指容器组件内的子组件,按照其预设的显示优先级,随容器组件尺寸变化显示或隐藏,其中相同显示优先级的子组件同时显示或隐藏。它是一种比较高级的布局方式,常用于分辨率变化较大,且不同分辨率下显示内容有所差异的场景。主要思想是通过增加或减少显示内容,来保持最佳的显示效果。

隐藏能力通过设置布局优先级(displayPriority属性)来控制显隐,当布局主轴方向剩余尺寸不足以满足全部元素时,按照布局优先级大小,从小到大依次隐藏,直到容器能够完整显示剩余元素。具有相同布局优先级的元素将同时显示或者隐藏。

可以访问 布局约束 ,了解displayPriority属性的详细信息。

说明: 类Web开发范式同样支持 display-index样式 ,用于设置布局优先级。

示例:

父容器尺寸发生变化时,其子元素按照预设的优先级显示或隐藏。

@Entry
@Component
struct HiddenCapabilitySample {@State rate: number = 0.45// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: this.rate * 100, min: 10, max: 45, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').height(50).onChange((value: number) => {this.rate = value / 100}).position({ x: '20%', y: '80%' })}build() {Column() {Row() {Image($r("app.media.favorite")).width(48).height(48).objectFit(ImageFit.Contain).margin({ left: 12, right: 12 }).displayPriority(1)  // 布局优先级Image($r("app.media.down")).width(48).height(48).objectFit(ImageFit.Contain).margin({ left: 12, right: 12 }).displayPriority(2)  // 布局优先级Image($r("app.media.pause")).width(48).height(48).objectFit(ImageFit.Contain).margin({ left: 12, right: 12 }).displayPriority(3)  // 布局优先级Image($r("app.media.next")).width(48).height(48).objectFit(ImageFit.Contain).margin({ left: 12, right: 12 }).displayPriority(2)  // 布局优先级Image($r("app.media.list")).width(48).height(48).objectFit(ImageFit.Contain).margin({ left: 12, right: 12 }).displayPriority(1)  // 布局优先级}.width(this.rate * 100 + '%').height(96).borderRadius(16).backgroundColor('#FFFFFF').justifyContent(FlexAlign.Center).alignItems(VerticalAlign.Center)this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}
}

折行能力

折行能力是指容器组件尺寸发生变化,当布局方向尺寸不足以显示完整内容时自动换行。它常用于横竖屏适配或默认设备向平板切换的场景。

折行能力通过使用 Flex折行布局 (将wrap属性设置为FlexWrap.Wrap)实现,当横向布局尺寸不足以完整显示内容元素时,通过折行的方式,将元素显示在下方。

可以访问 Flex组件 ,了解Flex组件的详细用法。

说明: 类Web开发范式通过将 div组件 的flex-warp样式设置为wrap来使用折行能力。

示例:

父容器中的图片尺寸固定,当父容器尺寸发生变化,其中的内容做自适应换行。

@Entry
@Component
struct WrapCapabilitySample {@State rate: number = 0.7readonly imageList: Resource [] = [$r('app.media.flexWrap1'),$r('app.media.flexWrap2'),$r('app.media.flexWrap3'),$r('app.media.flexWrap4'),$r('app.media.flexWrap5'),$r('app.media.flexWrap6')]// 底部滑块,可以通过拖拽滑块改变容器尺寸@Builder slider() {Slider({ value: this.rate * 100, min: 50, max: 70, style: SliderStyle.OutSet }).blockColor(Color.White).width('60%').onChange((value: number) => {this.rate = value / 100}).position({ x: '20%', y: '87%' })}build() {Flex({ justifyContent: FlexAlign.Center, direction: FlexDirection.Column }) {Column() {// 通过Flex组件warp参数实现自适应折行Flex({direction: FlexDirection.Row,alignItems: ItemAlign.Center,justifyContent: FlexAlign.Center,wrap: FlexWrap.Wrap}) {ForEach(this.imageList, (item:Resource) => {Image(item).width(183).height(138).padding(10)})}.backgroundColor('#FFFFFF').padding(20).width(this.rate * 100 + '%').borderRadius(16)}.width('100%')this.slider()}.width('100%').height('100%').backgroundColor('#F1F3F5')}
}

为了能让大家更好的学习鸿蒙(HarmonyOS NEXT)开发技术,这边特意整理了《鸿蒙开发学习手册》(共计890页),希望对大家有所帮助:https://qr21.cn/FV7h05

《鸿蒙开发学习手册》:

如何快速入门:https://qr21.cn/FV7h05

  1. 基本概念
  2. 构建第一个ArkTS应用
  3. ……

开发基础知识:https://qr21.cn/FV7h05

  1. 应用基础知识
  2. 配置文件
  3. 应用数据管理
  4. 应用安全管理
  5. 应用隐私保护
  6. 三方应用调用管控机制
  7. 资源分类与访问
  8. 学习ArkTS语言
  9. ……

基于ArkTS 开发:https://qr21.cn/FV7h05

  1. Ability开发
  2. UI开发
  3. 公共事件与通知
  4. 窗口管理
  5. 媒体
  6. 安全
  7. 网络与链接
  8. 电话服务
  9. 数据管理
  10. 后台任务(Background Task)管理
  11. 设备管理
  12. 设备使用信息统计
  13. DFX
  14. 国际化开发
  15. 折叠屏系列
  16. ……

鸿蒙开发面试真题(含参考答案):https://qr18.cn/F781PH

鸿蒙开发面试大盘集篇(共计319页):https://qr18.cn/F781PH

1.项目开发必备面试题
2.性能优化方向
3.架构方向
4.鸿蒙开发系统底层方向
5.鸿蒙音视频开发方向
6.鸿蒙车载开发方向
7.鸿蒙南向开发方向

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/763060.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

鸿蒙一次开发,多端部署(十一)设置应用页面

本小节以“设置”应用页面为例,介绍如何使用自适应布局能力和响应式布局能力适配不同尺寸窗口。 页面设计 为充分利用屏幕尺寸优势,应用常常有在小屏设备上单栏显示,大屏设备上左右分两栏显示的设计,设置应用页面设计如下。 观察…

不要取和所用方法名字相同的类

package 练习; import java.util.*; public class StringBuilder {public static void main(String[] args){Scanner scan new Scanner(System.in);String r scan.nextLine();StringBuilder x new StringBuilder(r);System.out.println(x);}} 奉上错误代码(上面&…

qt5-入门-标签页部件QTabWidget-1

参考: C GUI Programming with Qt 4, Second Edition 本地环境: win10专业版,64位,Qt5.12 目录 效果实现Qt Designer操作代码addStretch()解释 效果 首页有三个按钮和最近文件列表。 拖动窗口,按钮和文件列表仍然处…

【C++】1600. 请假时间计算

问题:1600. 请假时间计算 类型:基本运算、整数运算 题目描述: 假设小明的妈妈向公司请了 n 天的假,那么请问小明的妈妈总共请了多少小时的假,多少分钟的假?(提示: 1 天有 24 小时&…

关于UDS刷写的一些杂谈

最近在做CAPL编写UDS刷写上位机的工作,后续过来更新现在这里查个眼,以免后面忘记了。 下面放一些可能会用到的知识点: 1.一般的刷写流程如下所示: 红色标记代表为功能寻址。 预编程:10 01,10 83&#xf…

Linux——du, df命令查看磁盘空间使用情况

一、实现原理: df 命令的全称是Disk Free ,显而易见它是统计磁盘中空闲的空间,也即空闲的磁盘块数。它是通过文件系统磁盘块分配图进行计算出的。 du 命令的全称是 Disk Used ,统计磁盘有已经使用的空间。它是直接统计各文件各目…

HarmonyOS4.0—自定义渐变导航栏开发教程

前言 今天要分享的是一个自定义渐变导航栏,本项目基于鸿蒙4.0。 先看效果: 这种导航栏在开发中也比较常见,特点是导航栏背景色从透明到不透明的渐变,以及导航栏标题和按钮颜色的变化。 系统的导航栏无法满足要求,我们…

8868体育助力西甲赫罗纳 争冠黑马惨遭掀翻

西甲的赫罗纳足球俱乐部是8868体育助力的球队之一,西甲排名第12的赫塔费队迎来了西甲第29轮的较量,赫塔费队此役坐镇自己的主场PK赛前排名第2的争冠超级黑马赫罗纳队。 赛前赫塔费队已经连续4轮联赛不胜(2平2负状态低迷)&#xff…

力扣 字符串解码

维护一个放数字的栈&#xff0c;一个放字母的栈 遇到[把数字和字母入栈&#xff0c;遇到]把当前字母循环加上数字栈头遍的字母栈头 class Solution { public:string decodeString(string s) {string ans"";stack<int>sz;stack<string>zm;里面是string …

一文讲清!进销存管理系统如何实现锁库及库存冻结?计算月加权平均成本?

进销存管理系统中的锁库及库存冻结如何实现&#xff1f;进销存管理系统如何计算月加权平均成本&#xff1f;进销存管理系统又该如何统计和预测采购需求&#xff1f;这些进销存管理难题困扰着许多企业管理者。本文将结合数年从业经验&#xff0c;深入探讨这些进销存管理难题&…

面试算法-83-不同路径 II

题目 一个机器人位于一个 m x n 网格的左上角 &#xff08;起始点在下图中标记为 “Start” &#xff09;。 机器人每次只能向下或者向右移动一步。机器人试图达到网格的右下角&#xff08;在下图中标记为 “Finish”&#xff09;。 现在考虑网格中有障碍物。那么从左上角到…

saas架构使用实现

saas架构使用实现 saas是什么 多租户架构——是指在同一个系统中&#xff0c;为不同的客户提供不同的部署环境&#xff0c;各个客户之间的数据和操作是相互独立的。这种架构可以大幅降低系统的开发和运维成本&#xff0c;同时也能提高系统的可扩展性和灵活性。每个用户有自己特…

苹果电脑不能删除移动硬盘文件 苹果电脑移动硬盘只读模式如何更改 移动硬盘文件或目录损坏且无法读取怎么办

当我们将移动硬盘插入苹果电脑后&#xff0c;发现无法对移动硬盘中的文件进行编辑该怎么办&#xff1f;相信有不少网友遇到过这类情况。苹果电脑不能删除移动硬盘文件&#xff0c;或无法拷贝硬盘里的文件。今天我为大家解决苹果电脑移动硬盘只读模式如何更改的问题&#xff0c;…

superset 二开增加 flink 数据源连接通过flink sql 查询数据

前言 superset 目前还不支持 flink 的数据源连接&#xff0c;目前我们公司在探索使用数据湖那一套东西&#xff1a; 使用 flink 作为计算引擎使用 paimon oss对象存储对接 flink 作为底层存储使用 superset 通过 flink gateway 查询 paimon 数据形成报表 增加flink数据源 …

git push出错: src refspec dev/xxx does not match any

使用如下命令gitp push出错: git push origin 远端分支名 git push origin dev/xxxx error: src refspec dev/xxxx does not match any error: failed to push some refs to https://git.woa.com/..... 解决方案 1: git push origin 本地分支名:远端分支名 解决方案2&#…

docker进阶篇,docker集群介绍

docker swarm 官网&#xff1a;https://docs.docker.com/engine/swarm/how-swarm-mode-works/nodes/ 什么是 docker swarm docker swarm 是 docker 官方提供的容器编排和集群管理工具。它允许用户将多个 docker 主机组成一个虚拟的 docker 集群&#xff0c;以便更高效地管理…

互联网环境下工厂生产企业的数字化转型路径研究

hello宝子们...我们是艾斯视觉擅长ui设计和前端开发10年经验&#xff01;希望我的分享能帮助到您&#xff01;如需帮助可以评论关注私信我们一起探讨&#xff01;致敬感谢感恩&#xff01; 随着互联网技术的飞速发展&#xff0c;数字化已经成为企业提升竞争力的重要手段。对于工…

四信雨水情监测系统,助力构建“三道防线”精准防洪

近年来&#xff0c;我国突破历史记录、颠覆传统认知的水旱灾害频繁发生&#xff0c;依靠传统监测预报手段已难以满足当前洪水防御工作的需求。为贯彻“两个坚持、三个转变”的防灾减灾救灾理念&#xff0c;保障人民群众生命财产安全赢得时机&#xff0c;就必须进一步强化应对洪…

Cadence OrCAD使用小技巧

Cadence是公司名&#xff0c;Allegro&#xff08;俗称阿狸狗&#xff09;是该公司旗下的EDA工具品牌&#xff0c;OrCAD是该公司收购公司的EDA工具品牌。 OrCAD这个产品线是Cadence收购来的&#xff0c;Allegro才是嫡系。 注意&#xff1a;dsn不能放在中文路径下。 开机选captur…

20240316-1-向量化搜索

向量化搜索 在高维空间内快速搜索最近邻&#xff08;Approximate Nearest Neighbor&#xff09;。召回中&#xff0c;Embedding向量的搜索。 FAISS、kd-tree、局部敏感哈希、【Amnoy、HNSW】 FAISS faiss是Facebook的AI团队开源的一套用于做聚类或者相似性搜索的软件库&…