期末项目实战:基于鸿蒙ArkTs语言的健康检测App问题检测与解决

  • 遇到的问题和解决方法

问题1:

Welcome编写完成之后,点击同意按钮没有跳转到Index界面,同时点击不同意按钮时也没有回到桌面

问题分析:

弹窗正常出现但是按钮的跳转功能失效,

1.首先判断按钮的功能

jumpToIndex方法中,首先设置了一个超时相应setTimeout,在其中赋予了跳转的url和超时时间,本方法没有问题

2.判断跳转逻辑是否正确

给定变量isAgree,默认值为false,说明还不能跳转

同意时调用跳转方法(如上)

不同意是弹出弹窗,此方法逻辑不存在问题

3.判断按钮的正误

用户点击“同意后”进行初始化并将值改为true,同意进行跳转

点击“不同意”时终止程序退出到桌面,逻辑不存在问题

此时,对onConfirm进行断点测试,输入一个testTag,在下方Log中将testTag过滤出来,发现并没有执行Onconfirm方法,也就是没有输出testTag

(上图所示并没有输出testTag)

由此判断单击时没有执行该方法,所以要进入UserPrivacyDialog查看是否配置正确

4.查看配置

进入UserPrivacyDialog该文件之后,发现agree按钮并没有调用方法只使用了名字

同理,“不同意”按钮也没有执行对应方法,只是用了个名字

更改后

log也正常打印了!

单击同意、不同意后逻辑也正常执行

问题2:在开发元素统计表模块中存在数据重叠问题

如上图所示,在编辑完数据环形进度条之后的Preview界面出现数据的重叠。

出现问题的原因:

Text('摄入推荐')//第一部分转成变量名的形式 .fontSize(12) .fontColor($r('app.color.light_gray')) Text(`${value.toFixed(0)}/${recommend.toFixed(0)}`)//已经摄入的数量和推荐的数量都要传入 // .fontColor($r('app.color.light_gray')) .fontSize(20) .fontWeight(CommonConstants.FONT_WEIGHT_700)

上述代码糅合到了一起,但是本来不应该它们柔和到一起的,他们应该是放到Column之中

解决方法:上述的代码再套入一个Column列布局之中使他们变成一个整体。

解决后的代码为:

Column({space:5}){ Text('摄入推荐')//第一部分转成变量名的形式 .fontSize(12) .fontColor($r('app.color.light_gray')) Text(`${value.toFixed(0)}/${recommend.toFixed(0)}`)//已经摄入的数量和推荐的数量都要传入 // .fontColor($r('app.color.light_gray')) .fontSize(20) .fontWeight(CommonConstants.FONT_WEIGHT_700) }

正确的演示图如左图所示

问题3:删除按钮扭曲问题

在设计完删除按钮的Builder构造器之后,应用到列表中时,给列表添加了一个左滑出现删除按钮的行为,按时在左滑时划到最后删除按钮的横坐标被拉长扭曲

出现问题的原因:

Builder构造器在设计删除按钮的时候,没有给删除按钮添加固定的高度,这样它的默认值就是固定的,而且给List列表所使用的行为是

.swipeAction({end:this.deleteButton.bind(this)})

当上述代码检测到滑动的最后才会调用上下文的删除按钮,如果说刚开始滑动呢?刚开始滑动的时候按钮应该是正常的,但是因为没有设置固定的高度,按钮会随着用户的滑动出现扭曲

解决方法:

在Builder构造器中给按钮添加一个固定的高度,避免按钮出现扭曲的情况

@Builder deleteButton(){ Image($r('app.media.ic_public_delete_filled')) .fillColor(Color.Red) .width(20) .margin(5)//删除按钮与其他图片产生一个间距 .height(20) }

问题解决后正常的按钮应该如下图所示

问题4:当我们做完了首页食物信息的弹窗控制的代码之后,进行预览时弹窗并没有弹出,也没有报错信息

控制弹窗相应的代码:

ListIndex.ets

ItemList.ets

分析原因:Panel弹窗首先会占领页面的布局,我们定义的Column和Row的布局都是固定的,可能的原因是ItemList的布局出现了问题,因为我们没有给它固定的高度,而且List的布局的大小又是动态变化的。

解决方法:我们给ItemList添加一个LayoutWeight来控制它的权重,所以也可以看成我们除了头部的位置其他的位置都被列表占据了所以列表的高度就变成固定的了,只要List的高度固定,底部的面板就能了解到List的高度,从而可以在固定的位置去渲染面板

成功之后面板弹出,上方是我们定义的弹窗面板的蒙版,默认是白色的,我们也可以对面板进行拖动,这就是我们的初始化面板的样貌

问题5:数字键盘样式设计完成之后,想要和键盘进行联动我们定义了amount的@link值,但是ItemIndex的NumberKeyboard中我们传入this.amount时出现报错

@link 修饰符通常用于指示某个变量或属性是可变的,并且可以在其被赋值的环境中被修改。在某些编程环境中,使用 @link 修饰符的变量可能需要以特定的方式进行访问或操作,以确保其可变性被正确处理。

对于你提到的 NumberKeyboard(this.amount) 和 NumberKeyboard({amount: $amount}) 这两种用法,它们之间的区别可能与 JavaScript 或 TypeScript(鸿蒙开发可能使用的编程语言)中的 this 关键字的使用有关。

  1. NumberKeyboard(this.amount):这里使用了 this 关键字来引用当前上下文的对象。如果 this.amount 是一个通过 @link 修饰的属性,直接使用 this.amount 可能会引起错误,这可能是因为 this 的上下文不正确,或者 this.amount 需要以对象字面量的形式传递。
  2. NumberKeyboard({amount: $amount}):这里使用了对象字面量语法 {} 来传递参数。即使 $amount 是一个通过 @link 修饰的变量,将其包含在对象字面量中并作为属性传递,可能绕过了直接使用 this 时可能遇到的问题。这种方式明确地告诉函数 NumberKeyboard 接收一个名为 amount 的属性,其值为 $amount。

但是如此修改完成之后我们键盘输入23amount的值只会变成2并没有接收3。

出现问题的原因:我们键盘输入23但是amount只接受了2,我们需要将键盘输入的值拼接起来而不是只让amount接收一次就结束,因此要记录上次点击的是什么数字,首先我们考虑将两次amount的值变成字符串接收,但是有些情况不合适。例如,用户输入23字符串可以正常接收,输入2.5也可以正常接收,但是如果用户输入‘2.’不好意思如果是字符串的话‘2.’并不会存在什么问题,但是在现实生活中2.显然是不合法的,所以我们不能使用字符串。我们应该吧‘.’也记录下来等下次再输入5的时候才能变成2.5。这相当于amount的值和用户输入的字符串的值不一定是一致的,amount代表着最终的结果,用户按了哪个按键也需要单独使用一个变量去记录,我们定义一个变量value来记录键盘的值。

这相当于用户输入的内容我们先记录在value中,将来转换成amount的时候需要特殊处理,例如2.转换成2,同样,value的值也需要传递到键盘中,同时在键盘刚开始展开的时候上述两个值要进行初始化

在ItemIndex中首先定义好变量value

定义完成后后面再调用方法的时候也要将value的值传入

营养素面板也不要忘记定义value的值

link装饰器和state装饰器的区别

  1. @state 装饰器:
    • @state 装饰器通常用于声明组件的状态变量。这些变量可以是组件的内部状态,也可以是与应用的全局状态管理相关联的状态。
    • 状态变量可以被组件内部的方法修改,并且当状态发生变化时,组件会自动重新渲染以反映这些变化。
    • 在使用状态装饰器时,通常需要配合状态管理库或框架来实现状态的持久化和同步。
  1. @link 装饰器:
    • @link 装饰器用于将组件与外部数据源或服务进行连接。这可以是远程API调用、本地数据库查询或其他任何形式的数据绑定。
    • 通过 @link 装饰器,开发者可以定义组件需要的数据,并在数据更新时自动触发组件的重新渲染。
    • @link 装饰器通常与数据获取和状态更新逻辑结合使用,以确保组件总是显示最新的数据。

两者的主要区别在于它们的作用域和用途:

  • @state 更侧重于组件的内部状态管理。
  • @link 更侧重于组件与外部数据源的连接和数据同步。

问题6:键盘的编写中如果数据全部删除完了之后键盘应该是0但是弹出NAN

问题分析:NAN产生的原因

在鸿蒙开发中,产生NaN(Not a Number)的原因可能与编程语言C++中的NaN产生原因相似。根据搜索结果3,NaN通常由于以下操作而产生:

  1. 零为被除数:尝试除以零时,会产生NaN,特别是在浮点运算中,零除零是一种未定义的操作。
  2. 负数开平方:对于实数域来说,负数的平方根是未定义的,尝试计算负数的平方根会导致NaN。
  3. 未定义的数学运算:许多数学函数在特定输入下会返回NaN,例如,对负数取对数。
  4. 未初始化的浮点数:如果一个浮点数变量未被初始化或不存在,它的值可能会被解释为NaN。

参考文献:

鸿蒙开发中,判断一个数字是否为数字的方法

C++ 中的 NaN:产生原因、特性及处理方法

在鸿蒙开发中,如果遇到类似情况,也可能会生成NaN值。例如,当开发者在进行数学计算或数据处理时,如果输入了不合法的值或者进行了不合法的操作,就可能产生NaN。

如上,当我们删除数字键盘中数字的时候最可能的一种情况就是第四种,浮点数初始时不存在,遇到这种情况,计算机默认使用NAN(not a number)来代替了

解决方法:

我们可以定位到对浮点数操作的位置,判断如果该数字不存在则要进行赋初值

在浮点数转化位置添加一个IF判断,判断如果不存在str的时候直接返回0的操作,这样就可以避免出现NAN的错误信息。

问题7:食物列表中食物的营养信息是单量的,如果我们键盘的信息更改的话食物的营养素正常应该是(单片营养*键盘输入的数量)。但是预览中食物的营养并没有变化。

上图是单片食物的相关信息

上图发现问题:如果键盘数字改变但是食物的相关信息并没有变化

问题分析:应该是我们先前将食物的详细信息直接写死了,对照代码的话我们NutrieCard中的amount当我们在输入数字的时候其实是变化的,对应的父组件ItemCard应该也是变化的,父组件传入的ItemCard中的amount的值也要变,ItemCard的值发生改变之后,下方的Builder构造器应该也要变化

解决方法:出现问题的原因如上图,value的值默认是一片的,改变的时候value的值应该需要去*片数amount。

解决之后键盘中输入对应的片数食物的相关信息也会跟着改变了

  • 35
    点赞
  • 27
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值