HarmonyOS实战—TextField文本输入框组件基本使用

想了解更多内容，请访问：

网站建设公司,为您提供网站建设,网站制作,网页设计及定制网站建设服务,专注于成都企业网站定制,高端网页制作,对高空作业车租赁等多个行业拥有丰富的网站建设经验的网站建设公司。专业网站设计,网站优化推广哪家好,专业seo优化排名优化,H5建站,响应式网站。

和华为官方合作共建的鸿蒙技术社区

https://harmonyos.

1. TextField组件基本用法

组件说明：

  • 是Text的子类，用来进行用户输入数据的。

常见属性：

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.         ohos:id="$+id:text" 
    3. 
  
  
  
  
  3.         ohos:height="50vp" 
    4. 
  
  
  
  
  4.         ohos:width="319vp" 
    5. 
  
  
  
  
  5.         ohos:background_element="#FFFFFF" 
    6. 
  
  
  
  
  6.         ohos:hint="请输入信息" 
    7. 
  
  
  
  
  7.         ohos:layout_alignment="horizontal_center" 
    8. 
  
  
  
  
  8.         ohos:text_alignment="center" 
    9. 
  
  
  
  
  9.         ohos:text_color="#999999" 
    10. 
  
  
  
  
  10.         ohos:text_size="17fp" 
    11. 
  
  
  
  
  11.         ohos:top_margin="100vp"/> 
    12.

2. TextField案例——获取文本输入框中的内容并进行Toast提示

  • 通过TextField获取文本输入框中的内容并进行Toast提示
  • 新建项目：TextFieldApplication

ability_main 

 
 
 
 
    
  
  
  
  
  1.  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos" 
    4. 
  
  
  
  
  4.     ohos:height="match_parent" 
    5. 
  
  
  
  
  5.     ohos:width="match_parent" 
    6. 
  
  
  
  
  6.     ohos:background_element="#F2F2F2" 
    7. 
  
  
  
  
  7.     ohos:orientation="vertical"> 
    8. 
  
  
  
  
  8.  
    9. 
  
  
  
  
  9.     
  
  
  
  
  10.         ohos:id="$+id:text" 
    11. 
  
  
  
  
  11.         ohos:height="50vp" 
    12. 
  
  
  
  
  12.         ohos:width="319vp" 
    13. 
  
  
  
  
  13.         ohos:background_element="#FFFFFF" 
    14. 
  
  
  
  
  14.         ohos:hint="请输入信息" 
    15. 
  
  
  
  
  15.         ohos:layout_alignment="horizontal_center" 
    16. 
  
  
  
  
  16.         ohos:text_alignment="center" 
    17. 
  
  
  
  
  17.         ohos:text_color="#999999" 
    18. 
  
  
  
  
  18.         ohos:text_size="17fp" 
    19. 
  
  
  
  
  19.         ohos:top_margin="100vp"/> 
    20. 
  
  
  
  
  20.  
    21. 
  
  
  
  
  21.     
  
  
  
  
  22.         ohos:id="$+id:but" 
    23. 
  
  
  
  
  23.         ohos:height="47vp" 
    24. 
  
  
  
  
  24.         ohos:width="319vp" 
    25. 
  
  
  
  
  25.         ohos:background_element="#21a8FD" 
    26. 
  
  
  
  
  26.         ohos:layout_alignment="center" 
    27. 
  
  
  
  
  27.         ohos:text="获取信息" 
    28. 
  
  
  
  
  28.         ohos:text_alignment="center" 
    29. 
  
  
  
  
  29.         ohos:text_color="#FEFEFE" 
    30. 
  
  
  
  
  30.         ohos:text_size="24vp" 
    31. 
  
  
  
  
  31.         ohos:top_margin="77vp"/> 
    32. 
  
  
  
  
  32.  
    33. 
  
  
  
  
  33.  
    34.

因为要在 onClick 方法中用到 TextField 和 Button 这两个组件，所以要把这两个组件移到成员位置，使其成为成员变量后，onClick 方法才能访问的到。

MainAbilitySlice

 
 
 
 
    
  
  
  
  
  1. package com.xdr630.textfieldapplication.slice; 
    2. 
  
  
  
  
  2.  
    3. 
  
  
  
  
  3. import com.xdr630.textfieldapplication.ResourceTable; 
    4. 
  
  
  
  
  4. import ohos.aafwk.ability.AbilitySlice; 
    5. 
  
  
  
  
  5. import ohos.aafwk.content.Intent; 
    6. 
  
  
  
  
  6. import ohos.agp.components.Button; 
    7. 
  
  
  
  
  7. import ohos.agp.components.Component; 
    8. 
  
  
  
  
  8. import ohos.agp.components.TextField; 
    9. 
  
  
  
  
  9. import ohos.agp.utils.LayoutAlignment; 
    10. 
  
  
  
  
  10. import ohos.agp.window.dialog.ToastDialog; 
    11. 
  
  
  
  
  11.  
    12. 
  
  
  
  
  12. public class MainAbilitySlice extends AbilitySlice implements Component.ClickedListener { 
    13. 
  
  
  
  
  13.  
    14. 
  
  
  
  
  14.     TextField tf; 
    15. 
  
  
  
  
  15.     Button but; 
    16. 
  
  
  
  
  16.  
    17. 
  
  
  
  
  17.     @Override 
    18. 
  
  
  
  
  18.     public void onStart(Intent intent) { 
    19. 
  
  
  
  
  19.         super.onStart(intent); 
    20. 
  
  
  
  
  20.         super.setUIContent(ResourceTable.Layout_ability_main); 
    21. 
  
  
  
  
  21.  
    22. 
  
  
  
  
  22.         //1.找到文本组件框对象 
    23. 
  
  
  
  
  23.         tf = (TextField) findComponentById(ResourceTable.Id_text); 
    24. 
  
  
  
  
  24.         //找到按钮组件对象 
    25. 
  
  
  
  
  25.         but = (Button) findComponentById(ResourceTable.Id_but); 
    26. 
  
  
  
  
  26.  
    27. 
  
  
  
  
  27.         //2.给按钮绑定点击事件 
    28. 
  
  
  
  
  28.         //当点击了按钮之后，就要获取文本输入框的内容 
    29. 
  
  
  
  
  29.         but.setClickedListener(this); 
    30. 
  
  
  
  
  30.  
    31. 
  
  
  
  
  31.     } 
    32. 
  
  
  
  
  32.  
    33. 
  
  
  
  
  33.     @Override 
    34. 
  
  
  
  
  34.     public void onActive() { 
    35. 
  
  
  
  
  35.         super.onActive(); 
    36. 
  
  
  
  
  36.     } 
    37. 
  
  
  
  
  37.  
    38. 
  
  
  
  
  38.     @Override 
    39. 
  
  
  
  
  39.     public void onForeground(Intent intent) { 
    40. 
  
  
  
  
  40.         super.onForeground(intent); 
    41. 
  
  
  
  
  41.     } 
    42. 
  
  
  
  
  42.  
    43. 
  
  
  
  
  43.     @Override 
    44. 
  
  
  
  
  44.     public void onClick(Component component) { 
    45. 
  
  
  
  
  45.         //当点击了按钮之后，获取文本输入框的内容 
    46. 
  
  
  
  
  46.         String message = tf.getText(); 
    47. 
  
  
  
  
  47.         //利用一个Toast将信息弹出 
    48. 
  
  
  
  
  48.         ToastDialog td = new ToastDialog(this); 
    49. 
  
  
  
  
  49.         //大小不用设置，默认是包裹内容的 
    50. 
  
  
  
  
  50.         //自动关闭不用设置，默认到了时间之后就自动关闭 
    51. 
  
  
  
  
  51.         //默认持续时间是 2秒 
    52. 
  
  
  
  
  52.  
    53. 
  
  
  
  
  53.         //设置Toast的背景 
    54. 
  
  
  
  
  54.         td.setTransparent(true); 
    55. 
  
  
  
  
  55.         //位置（默认居中） 
    56. 
  
  
  
  
  56.         td.setAlignment(LayoutAlignment.BOTTOM); 
    57. 
  
  
  
  
  57.         //设置一个偏移 
    58. 
  
  
  
  
  58.         td.setOffset(0,200); 
    59. 
  
  
  
  
  59.         //设置Toast内容 
    60. 
  
  
  
  
  60.         td.setText(message); 
    61. 
  
  
  
  
  61.         //让Toast出现 
    62. 
  
  
  
  
  62.         td.show(); 
    63. 
  
  
  
  
  63.     } 
    64. 
  
  
  
  
  64. } 
    65.

运行：

3. TextField组件高级用法

3.1 密码的密文展示

当输入密码的时候会变成密文展示。

ohos:text_input_type="pattern_password"：表示输入的密码以密文的方式显示。

基本使用： 

 
 
 
 
    
  
  
  
  
  1.  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos" 
    4. 
  
  
  
  
  4.     ohos:height="match_parent" 
    5. 
  
  
  
  
  5.     ohos:width="match_parent" 
    6. 
  
  
  
  
  6.     ohos:orientation="vertical" 
    7. 
  
  
  
  
  7.     ohos:background_element="#F2F2F2"> 
    8. 
  
  
  
  
  8.  
    9. 
  
  
  
  
  9.     
  
  
  
  
  10.         ohos:height="50vp" 
    11. 
  
  
  
  
  11.         ohos:width="319vp" 
    12. 
  
  
  
  
  12.         ohos:hint="请输入信息" 
    13. 
  
  
  
  
  13.         ohos:text_size="17fp" 
    14. 
  
  
  
  
  14.         ohos:hint_color="#999999" 
    15. 
  
  
  
  
  15.         ohos:text_alignment="center" 
    16. 
  
  
  
  
  16.         ohos:top_margin="100vp" 
    17. 
  
  
  
  
  17.         ohos:layout_alignment="horizontal_center" 
    18. 
  
  
  
  
  18.         ohos:background_element="#FFFFFF" 
    19. 
  
  
  
  
  19.         ohos:text_input_type="pattern_password"/> 
    20. 
  
  
  
  
  20.  
    21. 
  
  
  
  
  21.  
    22.

3.2 基线的设置

有的时候文本输入框并不是一个框，而是下面有一条横线，这条线华为官方叫做基线。

把文本输入框使用横线表示，在上面加上一条基线，把输入框的背景颜色去掉。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.         ohos:height="50vp" 
    3. 
  
  
  
  
  3.         ohos:width="319vp" 
    4. 
  
  
  
  
  4.         ohos:hint="请输入信息" 
    5. 
  
  
  
  
  5.         ohos:text_size="17fp" 
    6. 
  
  
  
  
  6.         ohos:hint_color="#999999" 
    7. 
  
  
  
  
  7.         ohos:text_alignment="center" 
    8. 
  
  
  
  
  8.         ohos:top_margin="100vp" 
    9. 
  
  
  
  
  9.         ohos:layout_alignment="horizontal_center" 
    10. 
  
  
  
  
  10.         ohos:text_input_type="pattern_password" 
    11. 
  
  
  
  
  11.         ohos:basement="#000000" 
    12. 
  
  
  
  
  12.         /> 
    13.

如果以后看到一条基线，然后在输入一些数字信息，这还是 TextField 文本输入框组件，只不过是背景色没有设置，让它跟布局的颜色一致了，看不到背景而已。

3.3 气泡的设置

当用鼠标长按选中输入的内容后，就会选中内容，前面的光标和后面的光标，以及中间选中的内容颜色会改变，华为官方给前、后的光标，以及没有选中内容状态下出现的小气球取名为气泡。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.         ohos:height="50vp" 
    3. 
  
  
  
  
  3.         ohos:width="319vp" 
    4. 
  
  
  
  
  4.         ohos:hint="请输入信息" 
    5. 
  
  
  
  
  5.         ohos:text_size="17fp" 
    6. 
  
  
  
  
  6.         ohos:hint_color="#999999" 
    7. 
  
  
  
  
  7.         ohos:text_alignment="center" 
    8. 
  
  
  
  
  8.         ohos:top_margin="100vp" 
    9. 
  
  
  
  
  9.         ohos:layout_alignment="horizontal_center" 
    10. 
  
  
  
  
  10.         ohos:basement="#000000" 
    11. 
  
  
  
  
  11.         /> 
    12.

可以设置左边、右边，以及没有选中情况下的气泡。

气泡的图片、颜色都是可以自定义的。

以下用到的图片可自取：https://www.aliyundrive.com/s/wT22d1Vb1BV

把左、右，以及中间没有选中的气泡图片复制到 media 文件夹下。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.         ohos:height="50vp" 
    3. 
  
  
  
  
  3.         ohos:width="319vp" 
    4. 
  
  
  
  
  4.         ohos:hint="请输入信息" 
    5. 
  
  
  
  
  5.         ohos:text_size="17fp" 
    6. 
  
  
  
  
  6.         ohos:hint_color="#999999" 
    7. 
  
  
  
  
  7.         ohos:text_alignment="center" 
    8. 
  
  
  
  
  8.         ohos:top_margin="100vp" 
    9. 
  
  
  
  
  9.         ohos:layout_alignment="horizontal_center" 
    10. 
  
  
  
  
  10.         ohos:basement="#000000" 
    11. 
  
  
  
  
  11.         ohos:element_selection_left_bubble="$media:left" 
    12. 
  
  
  
  
  12.         ohos:element_selection_right_bubble="$media:right" 
    13. 
  
  
  
  
  13.         ohos:element_cursor_bubble="$media:bubble" 
    14. 
  
  
  
  
  14.         ohos:selection_color="#FF0000" 
    15. 
  
  
  
  
  15.         /> 
    16.
  • ohos:element_selection_left_bubble、ohos:element_selection_right_bubble分别设置左右气泡显示的图片
  • ohos:element_cursor_bubble：设置没有选中时的气泡图片
  • ohos:selection_color：设置选中时内容的颜色

运行：

4. TextField案例——长按查看密码明文

在一些APP中，登录界面密码输入框那里有个小眼睛，按住小眼睛后就可以看到密码的明文展示，松开小眼睛又恢复到密文状态了。

把“小眼睛”改成Button组件，实现的逻辑原理也是一样的。

需求分析：

  • 按住按钮不松，将输入框中的密码变成明文
  • 松开按钮之后，输入框中的密码变回密文

新建项目：TextFieldApplication3

ability_main 

 
 
 
 
    
  
  
  
  
  1.  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos" 
    4. 
  
  
  
  
  4.     ohos:height="match_parent" 
    5. 
  
  
  
  
  5.     ohos:width="match_parent" 
    6. 
  
  
  
  
  6.     ohos:orientation="vertical" 
    7. 
  
  
  
  
  7.     ohos:background_element="#F2F2F2" 
    8. 
  
  
  
  
  8.     > 
    9. 
  
  
  
  
  9.  
    10. 
  
  
  
  
  10.     
  
  
  
  
  11.         ohos:id="$+id:text" 
    12. 
  
  
  
  
  12.         ohos:height="50vp" 
    13. 
  
  
  
  
  13.         ohos:width="319vp" 
    14. 
  
  
  
  
  14.         ohos:hint="请输入密码" 
    15. 
  
  
  
  
  15.         ohos:text_size="17fp" 
    16. 
  
  
  
  
  16.         ohos:hint_color="#999999" 
    17. 
  
  
  
  
  17.         ohos:text_alignment="center" 
    18. 
  
  
  
  
  18.         ohos:top_margin="100vp" 
    19. 
  
  
  
  
  19.         ohos:layout_alignment="horizontal_center" 
    20. 
  
  
  
  
  20.         ohos:background_element="#FFFFFF" 
    21. 
  
  
  
  
  21.         ohos:text_input_type="pattern_password"/> 
    22. 
  
  
  
  
  22.      
    23. 
  
  
  
  
  23.     
  
  
  
  
  24.         ohos:id="$+id:but" 
    25. 
  
  
  
  
  25.         ohos:height="47vp" 
    26. 
  
  
  
  
  26.         ohos:width="319vp" 
    27. 
  
  
  
  
  27.         ohos:text="查看密码" 
    28. 
  
  
  
  
  28.         ohos:text_size="24vp" 
    29. 
  
  
  
  
  29.         ohos:text_color="#FEFEFE" 
    30. 
  
  
  
  
  30.         ohos:text_alignment="center" 
    31. 
  
  
  
  
  31.         ohos:background_element="#21a8FD" 
    32. 
  
  
  
  
  32.         ohos:top_margin="77vp" 
    33. 
  
  
  
  
  33.         ohos:layout_alignment="center"/> 
    34. 
  
  
  
  
  34.  
    35. 
  
  
  
  
  35.  
    36.

 MainAbilitySlice

 
 
 
 
    
  
  
  
  
  1. package com.xdr630.textfieldapplication3.slice; 
    2. 
  
  
  
  
  2.  
    3. 
  
  
  
  
  3. import com.xdr630.textfieldapplication3.ResourceTable; 
    4. 
  
  
  
  
  4. import ohos.aafwk.ability.AbilitySlice; 
    5. 
  
  
  
  
  5. import ohos.aafwk.content.Intent; 
    6. 
  
  
  
  
  6. import ohos.agp.components.Button; 
    7. 
  
  
  
  
  7. import ohos.agp.components.Component; 
    8. 
  
  
  
  
  8. import ohos.agp.components.InputAttribute; 
    9. 
  
  
  
  
  9. import ohos.agp.components.TextField; 
    10. 
  
  
  
  
  10. import ohos.multimodalinput.event.TouchEvent; 
    11. 
  
  
  
  
  11.  
    12. 
  
  
  
  
  12. public class MainAbilitySlice extends AbilitySlice implements Component.TouchEventListener { 
    13. 
  
  
  
  
  13.  
    14. 
  
  
  
  
  14.     TextField tf; 
    15. 
  
  
  
  
  15.  
    16. 
  
  
  
  
  16.     @Override 
    17. 
  
  
  
  
  17.     public void onStart(Intent intent) { 
    18. 
  
  
  
  
  18.         super.onStart(intent); 
    19. 
  
  
  
  
  19.         super.setUIContent(ResourceTable.Layout_ability_main); 
    20. 
  
  
  
  
  20.  
    21. 
  
  
  
  
  21.         //1.找到两个组件对象 
    22. 
  
  
  
  
  22.         tf = (TextField) findComponentById(ResourceTable.Id_text); 
    23. 
  
  
  
  
  23.         Button but = (Button) findComponentById(ResourceTable.Id_but); 
    24. 
  
  
  
  
  24.  
    25. 
  
  
  
  
  25.         //2.要给按钮绑定一个触摸事件 
    26. 
  
  
  
  
  26.         //因为在触摸事件中，才能获取到按下不松或松开 
    27. 
  
  
  
  
  27.         //单击事件——只能捕获到点击了一下 
    28. 
  
  
  
  
  28.         but.setTouchEventListener(this); 
    29. 
  
  
  
  
  29.  
    30. 
  
  
  
  
  30.  
    31. 
  
  
  
  
  31.     } 
    32. 
  
  
  
  
  32.  
    33. 
  
  
  
  
  33.     @Override 
    34. 
  
  
  
  
  34.     public void onActive() { 
    35. 
  
  
  
  
  35.         super.onActive(); 
    36. 
  
  
  
  
  36.     } 
    37. 
  
  
  
  
  37.  
    38. 
  
  
  
  
  38.     @Override 
    39. 
  
  
  
  
  39.     public void onForeground(Intent intent) { 
    40. 
  
  
  
  
  40.         super.onForeground(intent); 
    41. 
  
  
  
  
  41.     } 
    42. 
  
  
  
  
  42.  
    43. 
  
  
  
  
  43.     @Override 
    44. 
  
  
  
  
  44.     //参数一：现在触摸的按钮 
    45. 
  
  
  
  
  45.     //参数二：动作对象 
    46. 
  
  
  
  
  46.     public boolean onTouchEvent(Component component, TouchEvent touchEvent) { 
    47. 
  
  
  
  
  47.         int action = touchEvent.getAction(); 
    48. 
  
  
  
  
  48.  
    49. 
  
  
  
  
  49.         if (action == TouchEvent.PRIMARY_POINT_DOWN){//表示按下不松的时候 
    50. 
  
  
  
  
  50.             //当按下不送的时候，将文本框中密码变成明文 
    51. 
  
  
  
  
  51.             tf.setTextInputType(InputAttribute.PATTERN_NULL); 
    52. 
  
  
  
  
  52.         }else if (action == TouchEvent.PRIMARY_POINT_UP){//表示松开的时候 
    53. 
  
  
  
  
  53.             //当松开的时候，将文本框中的密码变回密文 
    54. 
  
  
  
  
  54.             tf.setTextInputType(InputAttribute.PATTERN_PASSWORD); 
    55. 
  
  
  
  
  55.         } 
    56. 
  
  
  
  
  56.         //true：表示触摸事件的后续动作还会进行触发 
    57. 
  
  
  
  
  57.         //false：表示触摸事件只触发第一个按下不松 
    58. 
  
  
  
  
  58.         return true; 
    59. 
  
  
  
  
  59.     } 
    60. 
  
  
  
  
  60. } 
    61.

 运行：

5. TextField案例——搭建登录界面

新建项目：TextFieldApplication4

细节说明：

  • Text文本(忘记密码了?)组件默认是左边放置的，加上 ohos:layout_alignment="right"就是右边放置了，同时也给个ohos:right_margin="20vp"和右边的屏幕有些距离。如果ohos:layout_alignment="right"属性不写，直接写ohos:right_margin="20vp，那么ohos:layout_alignment="right"属性就会失效，因为组件默认是放在左边的。

ability_main 

 
 
 
 
    
  
  
  
  
  1.  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos" 
    4. 
  
  
  
  
  4.     ohos:height="match_parent" 
    5. 
  
  
  
  
  5.     ohos:width="match_parent" 
    6. 
  
  
  
  
  6.     ohos:orientation="vertical" 
    7. 
  
  
  
  
  7.     ohos:background_element="#F2F2F2"> 
    8. 
  
  
  
  
  8.  
    9. 
  
  
  
  
  9.     
  
  
  
  
  10.         ohos:id="$+id:username" 
    11. 
  
  
  
  
  11.         ohos:height="50vp" 
    12. 
  
  
  
  
  12.         ohos:width="319vp" 
    13. 
  
  
  
  
  13.         ohos:hint="请输入用户名" 
    14. 
  
  
  
  
  14.         ohos:text_size="17fp" 
    15. 
  
  
  
  
  15.         ohos:hint_color="#999999" 
    16. 
  
  
  
  
  16.         ohos:text_alignment="center" 
    17. 
  
  
  
  
  17.         ohos:top_margin="100vp" 
    18. 
  
  
  
  
  18.         ohos:layout_alignment="horizontal_center" 
    19. 
  
  
  
  
  19.         ohos:background_element="#FFFFFF"/> 
    20. 
  
  
  
  
  20.  
    21. 
  
  
  
  
  21.     
  
  
  
  
  22.         ohos:id="$+id:password" 
    23. 
  
  
  
  
  23.         ohos:height="50vp" 
    24. 
  
  
  
  
  24.         ohos:width="319vp" 
    25. 
  
  
  
  
  25.         ohos:hint="请输入密码" 
    26. 
  
  
  
  
  26.         ohos:text_size="17fp" 
    27. 
  
  
  
  
  27.         ohos:hint_color="#999999" 
    28. 
  
  
  
  
  28.         ohos:text_alignment="center" 
    29. 
  
  
  
  
  29.         ohos:top_margin="10vp" 
    30. 
  
  
  
  
  30.         ohos:layout_alignment="horizontal_center" 
    31. 
  
  
  
  
  31.         ohos:background_element="#FFFFFF" 
    32. 
  
  
  
  
  32.         ohos:text_input_type="pattern_password"/> 
    33. 
  
  
  
  
  33.      
    34. 
  
  
  
  
  34.     
  
  
  
  
  35.         ohos:height="match_content" 
    36. 
  
  
  
  
  36.         ohos:width="match_content" 
    37. 
  
  
  
  
  37.         ohos:text="忘记密码了？" 
    38. 
  
  
  
  
  38.         ohos:text_size="17fp" 
    39. 
  
  
  
  
  39.         ohos:text_color="#979797" 
    40. 
  
  
  
  
  40.         ohos:top_margin="13vp" 
    41. 
  
  
  
  
  41.         ohos:layout_alignment="right" 
    42. 
  
  
  
  
  42.         ohos:right_margin="20vp"/> 
    43. 
  
  
  
  
  43.      
    44. 
  
  
  
  
  44.     
  
  
  
  
  45.         ohos:height="47vp" 
    46. 
  
  
  
  
  46.         ohos:width="319vp" 
    47. 
  
  
  
  
  47.         ohos:text="登录" 
    48. 
  
  
  
  
  48.         ohos:text_size="24fp" 
    49. 
  
  
  
  
  49.         ohos:text_color="#FEFEFE" 
    50. 
  
  
  
  
  50.         ohos:text_alignment="center" 
    51. 
  
  
  
  
  51.         ohos:background_element="#21a8FD" 
    52. 
  
  
  
  
  52.         ohos:top_margin="77vp" 
    53. 
  
  
  
  
  53.         ohos:layout_alignment="horizontal_center"/> 
    54. 
  
  
  
  
  54.  
    55. 
  
  
  
  
  55.     
  
  
  
  
  56.         ohos:height="47vp" 
    57. 
  
  
  
  
  57.         ohos:width="319vp" 
    58. 
  
  
  
  
  58.         ohos:text="注册" 
    59. 
  
  
  
  
  59.         ohos:text_size="24fp" 
    60. 
  
  
  
  
  60.         ohos:text_color="#FEFEFE" 
    61. 
  
  
  
  
  61.         ohos:text_alignment="center" 
    62. 
  
  
  
  
  62.         ohos:background_element="#21a8FD" 
    63. 
  
  
  
  
  63.         ohos:top_margin="13vp" 
    64. 
  
  
  
  
  64.         ohos:layout_alignment="horizontal_center"/> 
    65. 
  
  
  
  
  65.  
    66. 
  
  
  
  
  66.  
    67. 
  
  
  
  
  67.  
    68. 
  
  
  
  
  68.  
    69.

 运行：

想了解更多内容，请访问：

和华为官方合作共建的鸿蒙技术社区

https://harmonyos.

网页标题：HarmonyOS实战—TextField文本输入框组件基本使用
文章URL：http://www.csdahua.cn/qtweb/news40/66140.html

网站建设、网络推广公司-快上网，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 快上网

成都快上网为您推荐相关内容

电子商务知识

行业网站建设

不锈钢防护栏　　 　成都电信服务器托管　　 　成都营销网站建设　　 　关键词优化　　 　成都谷歌SEO　　 　鳄鱼养殖　　 　成都移动服务器托管　　 　成都做网站　　 　营销网站建设　　 　眉山做网站　　 　成都口碑营销公司　　 　成都路面机械设备　　 　温江服务器托管　　 　成都做网站　　 　佑馨产后护理　　 　成都网站建设　　 　西信中心　　 　成都劢可为　　 　微信小程序　　 　营山月子护理