HarmonyOS鸿蒙Next中为什么TextInput的passwordIcon不能设置大小？

当前的UX规格不支持更改icon图标的大小及位置，许多APP均是使用的此规格，由于并不阻塞功能的开发，此场景可以通过实现一个自定义组件，来完成行尾密码图标位置、大小、颜色的修改。 自定义组件由TextInput和Image组成，使用Stack容器作为父容器。需要注意的是需要将TextInput自带的passwordIcon设置为不显示，然后将需要替换的图标放入到Image组件中即可，此时即可随意更改位置、大小、颜色。具体代码细节如下：

1.新建一个自定义组件TextInputExample。

TextInputExample.ets

@Entry
@Component
export struct TextInputExample {
  // TextInput行尾图标宽度
  @State iconWidth: number = 40
  // TextInput行尾图标宽度
  @State iconHeight: number = 40
  // TextInput组件高度
  @State TextInputHeight: number = 56

  // TextInput输入内容
  @State text: string = ''
  // 密码是否可见
  @State passwordState: boolean = false
  // TextInput行尾图标图片
  @State icon: Resource = $r('app.media.ic_public_password_invisible');
  // TextInputController
  controller: TextInputController = new TextInputController()

  build() {
    Column() {
      Flex({ direction: FlexDirection.Row }) {
        Stack() {
          TextInput({ text: this.text, controller: this.controller })
            .type(InputType.Password)
            .placeholderFont({ size: 16, weight: 400 })
            .showPasswordIcon(false) // 此处需将自带的行尾小眼睛图标设置成不显示
            .showPassword(this.passwordState)
            .width('100%')
            .height(this.TextInputHeight)
            .backgroundColor('#E8E7E7')
            .onChange((value: string) => {
              this.text = value
            })
          // 使用Image组件自定义实现行尾图标
          Image(this.icon)
            .margin({
              left: 290
            })
            .width(this.iconWidth)
            .height(this.iconHeight)
            .onClick(() => {
              // 点击行尾图标改变状态和icon
              this.passwordState = !this.passwordState
              this.icon = $r(this.passwordState ? 'app.media.ic_public_password_visible' :
                'app.media.ic_public_password_invisible')
            })
        }
      }
    }
    .width('100%')
    .height('100%')
  }
}

2.调用自定义组件。 Index.ets

import { TextInputExample } from './TextInputExample';

@Entry
@Component
struct Index {
  build() {
    Column() {
      // icon宽高20vp
      TextInputExample({ iconWidth: 20, iconHeight: 20 })
        .height('50vp')
      Blank()
      // icon宽高30vp
      TextInputExample({ iconWidth: 30, iconHeight: 30 })
        .height('50vp')
      Blank()
      // icon宽高40vp
      TextInputExample({ iconWidth: 40, iconHeight: 40 })
        .height('50vp')
      Blank()
      // icon宽高50vp
      TextInputExample({ iconWidth: 50, iconHeight: 50 })
        .height('50vp')
    }
    .height('50%')
    .width('100%')
    .margin({ top: 50 })
    .justifyContent(FlexAlign.Center)
    .alignItems(HorizontalAlign.Center)
  }
}

【背景知识】 TextInput为单行文本输入框组件。可以通过InputType设置输入框类型,常见的类型有：Normal、Password、Email、Number、PhoneNumber等。在TextInput输入类型为Password时，输入的字符会表现为点（·），在showPasswordIcon设置为true时，行尾会有一个小眼睛图标，点击可控制密码的显隐