1、HarmonyOS 在定时器里面改变@state修饰的变量,无法更新UI吗?
将函数function写成了封装函数的形式就可以了
@Entry
@Component
struct Index {@State acSetValve: number = 0;aboutToAppear(): void {setInterval(() => {this.acSetValve += 200;console.log('hahhah' + this.acSetValve)} ,100)}build() {Row() {Column() {Text(this.acSetValve.toString()).fontSize(50).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}
2、HarmonyOS 写一个公共的page,然后其他具体的page继承它,在公共page的做一些处理?
demo参考:
//主页面 FirstTest.ets
import { FirstTest2 } from "./FirstTest2"@Entry
@Component
struct FirstTest {@State message1: string = 'Hello World';// 显隐控制设置为不占用build() {Column() {Text("FirstTest:" + this.message1).fontSize(25).fontWeight(FontWeight.Bold)//FirstTest2页面数据传递参考API:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/ArkTS-link-0000001820999565#ZH-CN_TOPIC_0000001857916041__%E6%A6%82%E8%BF%B0//FirstTest2为Component修饰的组件,并且进行export,然后在FirstTest进行导入直接使用即可,可以多个页面复用FirstTest2({message2:this.message1});}}
}//复用组件 FirstTest2.ets
@Component
export struct FirstTest2 {@State test:string = "FirstTest2"@Link message2: string ;build() {Row() {Column() {Text("FirstTest2:" + this.test).fontSize(25).fontWeight(FontWeight.Bold)Text("FirstTest2:" + this.message2).fontSize(25).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}
3、HarmonyOS onVisibleAreaChange事件没有触发?
添加onVisibleAreaChange事件监听,只有第一屏可以触发,切到第二屏没有触发。影响埋点上报
onVisibleAreaChange规格上不支持监控由改变offset引起的组件区域变化。若要实现切屏监控,请使用swiper组件。
文档参考:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-swiper-V5
4、HarmonyOS router.pushNamedRoute参数传递 在接收页面怎么接收?
可以通过router.getParams();接收参数,API链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-router-V5#ZH-CN_TOPIC_0000001884917590__routergetparams
参考demo如下:
import router from '@ohos.router';
class innerParams {array:number[]constructor(tuple:number[]) {this.array = tuple}
}class routerParams {text:stringdata:innerParamsconstructor(str:string, tuple:number[]) {this.text = strthis.data = new innerParams(tuple)}
}@Entry
@Component
struct Router1 {build() {Column(){Column(){Text("我是页面1").fontSize(50)}Column(){Button("跳转").onClick(()=>{router.pushUrl({url: 'pages/Router11',params: new routerParams('message' ,[123,456,789])})})}}.width('100%').height('100%')}
}
import router from '@ohos.router';class innerParams {array:number[]constructor(tuple:number[]) {this.array = tuple}
}class routerParams {text:stringdata:innerParamsconstructor(str:string, tuple:number[]) {this.text = strthis.data = new innerParams(tuple)}
}@Entry
@Component
struct Router11 {aboutToAppear(): void {let s:number[]=((router.getParams() as routerParams).data as innerParams).arrayconsole.log("*********:"+s);}build() {Column(){Text("123").fontSize(50)Row(){Text("33333").fontSize(50)}}.width('100%').height('100%').opacity(0.5).backgroundColor(Color.Pink)}
}
5、HarmonyOS 拖拽排序以及控件平移效果是否有工具类可以用,当前控件数据数量上限无法满足?
拖拽排序以及控件平移效果是否有工具类可以用,当前控件数据数量上限无法满足
动画效果可以参考以下demo:
@Entry
@Component
struct AnimationPage {@Provide desX: number = 0;@Provide desY: number = 0;@BuilderTabBar(index: number) {Column() {Image($r("app.media.icon")).width(38).height(38)Text(index == 1 ? "分类" : index.toString())}.onAreaChange((oldValue: Area, newValue: Area) => {if (index == 1) {console.log("onAreaChange========= newValue:" + JSON.stringify(newValue))this.desX = newValue.globalPosition.x as numberthis.desY = newValue.globalPosition.y as number}})}build() {Column() {Category()Column() {Image($r("app.media.icon")).width(38).height(38)}.onAreaChange((oldValue: Area, newValue: Area) => {console.log("onAreaChange========= newValue:" + JSON.stringify(newValue))this.desX = newValue.globalPosition.x as numberthis.desY = newValue.globalPosition.y as number})}.width("100%").height("100%")}
}@Component
struct Category {@State dataList:number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]build() {Column() {Flex({direction:FlexDirection.Row, justifyContent: FlexAlign.SpaceBetween, wrap: FlexWrap.Wrap}) {ForEach(this.dataList, (item:number) => {ListItemComponent()})}.width('100%').height('80%').backgroundColor(Color.White)}}
}@Observed
class AnimationBean {animationAppear: Boolean = false;id:number = -1;
}@Component
struct ListItemComponent {@State animationList: AnimationBean[] = []static index: number = 0;@Consume desX: number;@Consume desY: number;@Provide orgX: number = 0;@Provide orgY: number = 0;@BuilderBuildAnimationItem() {Image($r("app.media.app_icon")).width(41).height(41).id("test").onClick(() => {this.startAnimation();}).onAreaChange((oldValue:Area, newValue:Area) => {this.orgX = newValue.globalPosition.x as numberthis.orgY = newValue.globalPosition.y as numberconsole.log("onAreaChage==========" + JSON.stringify(newValue))})}startAnimation() {const animation = new AnimationBean();animation.id = ListItemComponent.index++this.animationList.push(animation)animateTo({duration: 800,curve: Curve.FastOutLinearIn,onFinish: () => {animation.animationAppear = false;this.animationList = this.animationList.filter((item: AnimationBean) => {return item.animationAppear})}}, () => {animation.animationAppear = true;})}@BuilderBuildItem() {Row() {Stack() {this.BuildAnimationItem()ForEach(this.animationList, (item: AnimationBean) => {AnimationChild({ item: item , AnimationView:this.BuildAnimationItem})}, (item: AnimationBean, index: number) => {return item.id.toLocaleString()})}}.width("20%").height(60)}build() {this.BuildItem()}
}@Component
struct AnimationChild {@ObjectLink item: AnimationBean;@Consume desX: number;@Consume desY: number;@Consume orgX: number;@Consume orgY: number;@BuilderParamAnimationView:() => void;build() {Row() {this.AnimationView()}.zIndex(5).translate(this.item.animationAppear ? { x: (this.desX - this.orgX -20), y: (this.desY - this.orgY) } : { x: 0 })}
}