xugenyuan

fix |> 评论输入框无100字上限限制和提醒,评论输入框无法随着评论内容的输入自适应高度

http://192.168.1.3:8080/zentao/bug-view-20500.html

Signed-off-by: xugenyuan <xugenyuan@wondertek.com.cn>
... ... @@ -36,6 +36,8 @@ export struct CommentCustomDialog {
textInputController: TextAreaController = new TextAreaController()
@State positionInfo: CaretOffset = { index: 0, x: 0, y: 0 }
@State publishButtonOpacity: number = 0.5
@State inputViewHeight: number = 80
@Provide maxInputLength: number = 100
aboutToAppear(): void {
}
... ... @@ -98,15 +100,32 @@ export struct CommentCustomDialog {
.width('100%')
.backgroundColor($r('app.color.color_transparent'))
.caretColor("#ED2800")
.maxLength(this.maxInputLength)
.onWillInsert(data => {
if (this.publishCommentModel.commentContent.length + data.insertValue.length > this.maxInputLength) {
ToastUtils.showToast("已达到输入上限", 3000)
return false
}
return true
})
.onChange(value => {
this.publishCommentModel.commentContent = value;
if ((this.textInputController.getTextContentLineCount() - 3) > 0) {
this.inputViewHeight = 80 + (this.textInputController.getTextContentLineCount() - 3) * 18
}
if (value.length > 0) {
this.publishButtonOpacity = 1.0
} else {
this.publishButtonOpacity = 0.5
}
})
.onPaste(value => {
if (this.publishCommentModel.commentContent.length + value.length > this.maxInputLength) {
ToastUtils.showToast("已达到输入上限", 3000)
}
})
.onFocus(() => {
if (this.emojiSwitch) {
this.emojiSwitch = false
... ... @@ -119,7 +138,7 @@ export struct CommentCustomDialog {
.backgroundColor('#F9F9F9')
// .width('100%')
.margin({ top: 12, right: 12, left: 12, bottom:10})
.height(80)
.height(this.inputViewHeight)
.borderRadius(4)
Row() {
... ... @@ -198,7 +217,24 @@ export struct CommentCustomDialog {
}
if (this.voiceSwitch) {
VoiceInputView({voiceRecoginizerResult:(result: string) => {
this.publishCommentModel.commentContent = result;
let beforeStr = ""
let afterStr = ""
const offset = this.textInputController.getCaretOffset().index
if (offset > 0) {
beforeStr = this.publishCommentModel.commentContent.slice(0, offset)
}
if (offset < this.publishCommentModel.commentContent.length) {
afterStr = this.publishCommentModel.commentContent.slice(offset)
}
if (this.publishCommentModel.commentContent.length + result.length > this.maxInputLength) {
let length = this.maxInputLength - this.publishCommentModel.commentContent.length
if (length < result.length) {
result.substring(0, length)
}
ToastUtils.showToast("已达到输入上限", 3000)
}
this.publishCommentModel.commentContent = beforeStr + result + afterStr
}}).height(150)
}
... ... @@ -213,6 +249,7 @@ export struct CommentCustomDialog {
@Component
struct emojiView {
@Consume maxInputLength: number
@ObjectLink publishCommentModel: publishCommentModel
/*没找到获取系统emoji的方案*/
private emojiArray = ["😀","😁","😂","😃","😄","😅","😆","😇","😈","😉","😊","😋","😌","😍","😎","😏","😐","😑","😒","😓","😔","😕","😖","😗","😘","😙","😚","😛","😜","😝","😞","😟","😠","😡","😢","😣","😤","😥","😦","😧","😨","😩","😪","😫","😬","😭","😮","😯","😰","😱","😲","😳","😴","😵","😶","😷","😸","😹","😺","😻","😼","😽","😾","😿","🙀","🙅","🙆","🙇","🙈","🙉","🙊","🙋","🙌","🙍","🙎","🙏"]
... ... @@ -284,6 +321,10 @@ struct emojiView {
} else {
Logger.debug(TAG, "charCode: " + emoji.charCodeAt(0) + " ==> " + emoji)
if (this.publishCommentModel.commentContent.length + emoji.length > this.maxInputLength) {
ToastUtils.showToast("已达到输入上限", 3000)
return
}
this.publishCommentModel.commentContent = this.publishCommentModel.commentContent + emoji
}
... ...