这里有搞鸿蒙开发的兄弟吗？今天遇到一个问题，搞了半天也没搞定。需求很简单就是让左边的竖线跟随整个 Row 的高度变化，整个 Row 的高度不定，后面的文本可能会换行。
Row() {
// Vertical line decoration
Row()
.width(3)
.height('100%')
.backgroundColor('＃DDDDDD')
Column() {
Row() {
Text("Test1111")
.fontSize(14)
.fontWeight(FontWeight.Lighter)
.fontStyle(FontStyle.Italic)
.foregroundColor('＃DDDDDD')
.flexGrow(1)
Button() {
Text("button")
.width(30)
.height(30)
}
.width(30)
.height(30)
.backgroundColor(Color.Transparent)
.foregroundColor('＃DDDDDD')
}
.width('100%')
.alignItems(VerticalAlign.Top)
Text("long text long text long text long text long text ")
.fontSize(14)
.fontWeight(FontWeight.Lighter)
.foregroundColor('＃DDDDDD')
.width('100%')
.margin({ top: 2 })
}
.margin({ left: 7 })
.layoutWeight(1)
}
.alignItems(VerticalAlign.Top)
.width('100%')
.margin({ top: 10 })

试试下面的


export struct DecoratedRow {
 build() {
 Row() {
 // Left decorative line that will stretch full height
 Row() {
 Row()
 .width(3)
 .backgroundColor('＃DDDDDD')
 .height('100%')
 }
 .height('100%')
 .margin({ right: 4 })

 // Main content column
 Column() {
 Row() {
 Text("Test1111")
 .fontSize(14)
 .fontWeight(FontWeight.Lighter)
 .fontStyle(FontStyle.Italic)
 .foregroundColor('＃DDDDDD')
 .flexGrow(1)

 Button() {
 Text("button")
 .width(30)
 .height(30)
 }
 .width(30)
 .height(30)
 .backgroundColor(Color.Transparent)
 .foregroundColor('＃DDDDDD')
 }
 .width('100%')
 .alignItems(VerticalAlign.Top)

 Text("long text long text long text long text long text ")
 .fontSize(14)
 .fontWeight(FontWeight.Lighter)
 .foregroundColor('＃DDDDDD')
 .width('100%')
 .margin({ top: 2 })
 }
 .margin({ left: 7 })
 .layoutWeight(1)
 }
 .alignItems(VerticalAlign.Top)
 .width('100%')
 .margin({ top: 10 })
 }
}

不行，只要高度设置了.height('100%')，这个 Row 就会占据整个屏幕剩余的区域

看下 ChatGPT 的回答呢： chatgpt.com/share/67a6034c-07b8-8011-9d1a-2b56fb06615a

这布局的代码风格，不看晕过去吗

Compose 有固有特性测量，可以找找 Ark UI 有没有

如果是 compose 就很简单，父布局设置 .height(IntrinsicSize.Min)，子布局 .fillMaxHeight() 就完了

这玩意儿的风格，之前除了 SwiftUI ，还有哪个语言或者框架用么？

flutter ,

RelativeContainer() {
Column() {
Row() {
Text("Test1111")
.fontSize(14)
.fontWeight(FontWeight.Lighter)
.fontStyle(FontStyle.Italic)
.foregroundColor('＃DDDDDD')
.flexGrow(1)
Button() {
Text("button")
.width(30)
.height(30)
}
.width(30)
.height(30)
.backgroundColor(Color.Transparent)
.foregroundColor('＃DDDDDD')
}
.width('100%')
.alignItems(VerticalAlign.Top)

Text("long text long text long text long text long text long text long text long text long text long text")
.fontSize(14)
.fontWeight(FontWeight.Lighter)
.foregroundColor('＃DDDDDD')
.width('100%')
.margin({ top: 2 })
}
.id('viewRight')
.backgroundColor(0xff0000)
.margin({ left: 10 })
.alignRules({
left: { anchor: '__container__', align: HorizontalAlign.Start },
right: { anchor: '__container__', align: HorizontalAlign.End },
})

Row()
.id('viewLine')
.width(3)
.backgroundColor(0x00ff00)
.alignRules({
top: { anchor: 'viewRight', align: VerticalAlign.Top },
bottom: { anchor: 'viewRight', align: VerticalAlign.Bottom },
})
}
.size({ width: '100%', height: 'auto' })
.margin({ top: 10 })
.backgroundColor(0x0000ff)

//RelativeContainer 可以做到,但是稍微用错容易出不明所以的 BUG

现在大模型对鸿蒙的 ArkUI 支持的怎么样了

arkui 怎么配跟 SwiftUI 比较😂

我只是说从 App 开发者的角度来看：
对比了一下 flutter ，感觉区别还是挺大的。你去看看 SwiftUI 的代码，你再看看鸿蒙的 ArkUI ，你自己感受一下。

jetpack compose,android 主推的 UI 框架

＃12 我只有简单用过 flutter 现在是在写 react 反正都是抄 react 的嘛

多谢，了解了。看 release 时间，差不多也是那段时期的

您这个回复就跟吃意大利面一定要拌 37 号水泥差不多

＃16 倒也不是吧 我记得原来写 flutter 的时候还是挺简单的。react 更函数式一点 这个看着像用了类的装饰器的那种链式写法。

嗨，你要是从这个角度说，很多前端语言/框架都过不了几年就有这种情况。你这跑题跑的有点儿远了

现在客户端开发基本上就是这个风格的，安卓的 Compose UI 基本上跟 ArkUI 一条裤子的，flutter 也大差不差。

＃18 所以大同小异, 路径依赖就是 react->flutter->swiftUI,jetpack compose ,我猜测华为的不管是范式还是 ,Ui 渲染那块应该都有模仿 react flutter 的痕迹和实现吧。