HarmonyOS binsheet拉起UIExtension时,UIAbility中用了TextArea组件显示长文本。滚动文本时,bindsheet页面也会跟随下滑,有什么办法仅让文本滚动,bindSheet页面高度保持?
尝试不用UIExtension,直接bindSheet拉起页面布局,此时TextArea组件可以滚动显示文本,bindSheet页面保持高度不受影响。
为什么用UIExtension就会导致bindSheet页面和TextArea文本同时滚动的bug
拉起方:
import prompt from '@ohos.prompt'
import { Button } from '@ohos.multimodalInput.mouseEvent';
@Entry
@Component
struct Second {
@State message1: string = '大江东去,浪淘尽,千古风流人物。故垒西边,人道是:三国周郎赤壁。乱石崩云,惊涛裂岸,卷起千堆雪。江山如画,一时多少豪杰。'
@State visible: Visibility = Visibility.Hidden
private proxy: UIExtensionProxy | null = null;
@State isShow:boolean = false
@Builder myBuilder() {
Column() {
UIExtensionComponent({
bundleName : "com.example.controllablebuildcomponent",
abilityName: "UIExtensionProvider",
parameters: {
"ability.want.params.uiExtensionType": "sys/commonUI"
}
})
.width('98%')
.height('98%')
.onResult((data)=>{
console.log("fengsumei: onResult data : " + JSON.stringify(data))
})
.onRelease((code)=>{
console.log("release code : " + code)
})
.onReceive((data) => {
console.log("onReceive data : " + JSON.stringify(data))
})
.onRemoteReady((proxy) => {
console.info('onRemoteReady, for test')
this.proxy = proxy
this.proxy.off("asyncReceiverRegister");
})
// .hitTestBehavior(HitTestMode.None)
}
.width('100%')
}
build() {
Row() {
Column() {
Text(this.message1)
.fontSize(20)
.margin(20)
.copyOption(CopyOptions.InApp)
.onClick((event?: ClickEvent) => {
console.log("fengsumei: ClickEvent!")
})
.textMenuOptions([{content:"Creative",action:(selectContent: string)=>{
console.log("selectContent: " + selectContent)
this.isShow = true
}}])
.bindSheet($$this.isShow, this.myBuilder(),{
showClose: false,
shouldDismiss:((sheetDismiss: SheetDismiss)=> {
console.log("bind sheet shouldDismiss")
sheetDismiss.dismiss()
}),
})
}
.width('100%')
.height('100%')
}
.height('100%')
}
}
- 1.
- 2.
- 3.
- 4.
- 5.
- 6.
- 7.
- 8.
- 9.
- 10.
- 11.
- 12.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18.
- 19.
- 20.
- 21.
- 22.
- 23.
- 24.
- 25.
- 26.
- 27.
- 28.
- 29.
- 30.
- 31.
- 32.
- 33.
- 34.
- 35.
- 36.
- 37.
- 38.
- 39.
- 40.
- 41.
- 42.
- 43.
- 44.
- 45.
- 46.
- 47.
- 48.
- 49.
- 50.
- 51.
- 52.
- 53.
- 54.
- 55.
- 56.
- 57.
- 58.
- 59.
- 60.
- 61.
- 62.
- 63.
- 64.
- 65.
- 66.
- 67.
被拉起的应用中有问题的界面代码:
Tabs({ barPosition: BarPosition.End, controller: this.tabsController, index: this.currentIndex }) {
TabContent() {
TextArea({
text: this.textResult,
controller: this.textAreaController
})
.width('100%')
.height('100%')
.fontSize(16)
.fontColor('#182431')
.backgroundColor('#FFFFFF')
.copyOption(CopyOptions.LocalDevice)
.lineSpacing(LengthMetrics.px(20))
.letterSpacing(2)
.onChange((value: string) => {
this.textResult = value
})
.onTouch((event: TouchEvent)=>{
console.debug(TAG, "TextArea Touch!")
// event.stopPropagation()
})
.onContentScroll(()=>{
console.debug(TAG, "TextArea content scroll!")
})
}
.backgroundColor('#FFFFFF')
.borderRadius(15)
.margin({ left: 2, right: 2 })
TabContent() {
TextArea({
text: 'this.textResult 222',
controller: this.textAreaController
})
.width('100%')
.height('100%')
.fontSize(16)
.fontColor('#182431')
.backgroundColor('#FFFFFF')
.copyOption(CopyOptions.LocalDevice)
.lineSpacing(LengthMetrics.px(20))
.letterSpacing(2)
.onChange((value: string) => {
// this.textResult = value
})
}
.backgroundColor('#FFFFFF')
.borderRadius(15)
.margin({ left: 2, right: 2 })
TabContent() {
TextArea({
text: 'this.textResult 333',
controller: this.textAreaController
})
.width('100%')
.height('100%')
.fontSize(16)
.fontColor('#182431')
.backgroundColor('#FFFFFF')
.copyOption(CopyOptions.LocalDevice)
.lineSpacing(LengthMetrics.px(20))
.letterSpacing(2)
.onChange((value: string) => {
// this.textResult = value
})
}
.backgroundColor('#FFFFFF')
.borderRadius(15)
.margin({ left: 2, right: 2 })
}
.vertical(false)
.barHeight(0)
.onChange((index: number) => {
this.currentIndex = index
if (index == 0) {
this.previousSource = $r('app.media.ic_arrow_previous_off')
this.nextSource = $r('app.media.ic_arrow_next_on')
} else if (index == this.totalPageNums - 1) {
this.previousSource = $r('app.media.ic_arrow_previous_on')
this.nextSource = $r('app.media.ic_arrow_next_off')
} else {
this.previousSource = $r('app.media.ic_arrow_previous_on')
this.nextSource = $r('app.media.ic_arrow_next_on')
}
})
.scrollable(true)
.width('85%')
.height('85%')
.animationDuration(400)
- 1.
- 2.
- 3.
- 4.
- 5.
- 6.
- 7.
- 8.
- 9.
- 10.
- 11.
- 12.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18.
- 19.
- 20.
- 21.
- 22.
- 23.
- 24.
- 25.
- 26.
- 27.
- 28.
- 29.
- 30.
- 31.
- 32.
- 33.
- 34.
- 35.
- 36.
- 37.
- 38.
- 39.
- 40.
- 41.
- 42.
- 43.
- 44.
- 45.
- 46.
- 47.
- 48.
- 49.
- 50.
- 51.
- 52.
- 53.
- 54.
- 55.
- 56.
- 57.
- 58.
- 59.
- 60.
- 61.
- 62.
- 63.
- 64.
- 65.
- 66.
- 67.
- 68.
- 69.
- 70.
- 71.
- 72.
- 73.
- 74.
- 75.
- 76.
- 77.
- 78.
- 79.
- 80.
- 81.
- 82.
- 83.
- 84.
- 85.
- 86.
- 87.
- 88.
- 89.
- 90.
HarmonyOS
赞
收藏 0
回答 1
相关问题
Text文本过长时如何实现上下滚动?
1221浏览 • 1回复 待解决
HarmonyOS 带滚动条的多行文本显示用什么UI组件?Text、TextArea?
327浏览 • 1回复 待解决
轻量级js ui,超长文本如何在容器内滚动显示?
4701浏览 • 1回复 待解决
HarmonyOS Marquee组件在文本长度较短,不足以滚动时如何设置文字居中显示
369浏览 • 1回复 待解决
webviewController的loadData无法显示长文本
2172浏览 • 1回复 待解决
HarmonyOS 当navigation用NavigationMode.Split,bindsheet是否有办法在分屏时也适应
211浏览 • 1回复 待解决
HarmonyOS bindSheet内部使用Tabs组件,滚动事件无法联动
376浏览 • 1回复 待解决
Marquee组件在文本末尾滚动到控件末尾时,能停止滚动并触发回调事件(目前是滚动到控件的开头)
569浏览 • 1回复 待解决
HarmonyOS TextArea填充值,如何自动滚动到文本底部和如何手动失去焦点
839浏览 • 1回复 待解决
TextArea组件是否支持输入富文本(比如emoji表情和富文本)
3006浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何实现文本滚动停滞效果
388浏览 • 1回复 待解决
通过Preferences保存键值对类型的长文本时,报错怎么处理啊?
3140浏览 • 1回复 待解决
HarmonyOS A页面跳B页面,当A有CustomDialog显示时,也在B页面上
290浏览 • 1回复 待解决
过长文字如何滚动显示
2110浏览 • 1回复 待解决
如何获取文本的显示宽度和高度?
934浏览 • 1回复 待解决
HarmonyOS 使用RichText加载富文本字体太小,且加载富文本时偶现白屏无法显示富文本内容
649浏览 • 1回复 待解决
HarmonyOS 单行超长文本换行不生效
382浏览 • 1回复 待解决
HarmonyOS bindSheet如何实现嵌套滚动关闭容器效果
507浏览 • 1回复 待解决
HarmonyOS 文本输入组件(textInput、textArea)禁止粘贴功能
615浏览 • 1回复 待解决
HarmonyOS 加密长文本,如何动态获取密文
934浏览 • 1回复 待解决
HarmonyOS 如何实现长文本实现展开收起功能
478浏览 • 1回复 待解决
HarmonyOS bindSheet高度异常
760浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何实现HarmonyOS文本自动循环滚动效果?
967浏览 • 1回复 待解决
HarmonyOS 目前文本组件是否支持显示文本和表情包同时显示
592浏览 • 1回复 待解决
HarmonyOS bindsheet里面打开别的页面问题
534浏览 • 1回复 待解决
在bindSheet里面套一个Scroll,这种情况下半模态的高度不变,内容会向下滑动