鸿蒙初体验

1.布局

布局是UI的必要元素，它定义了组件在界面中的位置。ArkUI框架提供了多种布局方式，除了基础的线性布局、层叠布局、弹性布局、相对布局、栅格布局外，也提供了相对复杂的列表、宫格、轮播。

1.1垂直布局

线性布局（LinearLayout）是开发中最常用的布局，通过线性容器Row和Column构建。线性布局是其他布局的基础，其子元素在线性方向上（水平方向和垂直方向）依次排列。线性布局的排列方向由所选容器组件决定，Column容器内子元素按照垂直方向排列，Row容器内子元素按照水平方向排列。根据不同的排列方向，开发者可选择使用Row或Column容器创建线性布局

                                                    垂直向下Column样式：

1.2                              水平方向Row样式

2常用组件

2.1Text文本

Text是文本组件，通常用于展示用户视图，如显示文章的文字。

2.2 文本输入

TextInput、TextArea是输入框组件，通常用于响应用户的输入操作，比如评论区的输入、聊天框的输入、表格的输入等，也可以结合其构它组件建功能页面，例如登录注册页面。具体用法请参考TextInput、TextArea。

TextInput有9种可选类型，分别为Normal基本输入模式、Password密码输入模式、Email邮箱地址输入模式、Number纯数字输入模式、PhoneNumber电话号码输入模式、USER_NAME用户名输入模式、NEW_PASSWORD新密码输入模式、NUMBER_PASSWORD纯数字密码输入模式、NUMBER_DECIMAL带小数点的数字输入模式。通过type属性进行设置

                                                     基本输入模式（默认类型）

密码输入模式  

2.3自定义样式

                                                               单行输入框

设置输入框当前的文本内容

                                        添加backgroundColor改变输入框的背景颜色

 3.按钮

Button是按钮组件，通常用于响应用户的点击操作，其类型包括胶囊按钮、圆形按钮、普通按钮。Button做为容器使用时可以通过添加子组件实现包含文字、图片等元素的按钮。具体用法请参考Button。

Button有三种可选类型，分别为胶囊类型（Capsule）、圆形按钮（Circle）和普通按钮（Normal），通过type进行设置。

3.1 按钮（默认类型）

此类型按钮的圆角自动设置为高度的一半，不支持通过borderRadius属性重新设置圆角。

3.2圆形按钮

此类型按钮为圆形，不支持通过borderRadius属性重新设置圆角。

3.3普通按钮

此类型的按钮默认圆角为0，支持通过borderRadius属性重新设置圆角。

3.4自定义样式

• 设置边框弧度。

  使用通用属性来自定义按钮样式。例如通过borderRadius属性设置按钮的边框弧度

• 设置文本样式。

  通过添加文本样式设置按钮文本的展示样式。

• 

  设置背景颜色。

  添加backgroundColor属性设置按钮的背景颜色

• 

  4.显示图片

• 开发者经常需要在应用中显示一些图片，例如：按钮中的icon、网络图片、本地图片等。在应用中显示图片需要使用Image组件实现，Image支持多种图片格式，包括png、jpg、bmp、svg和gif，具体用法请参考Image组件。

•