【HarmonyOS专题】02 登录页面搭建原创

啊，大家好，我是和尚，我今天来给大家简单介绍一下，呃，在没有看鸿蒙官方文档的情况下，尝试构建一个简单的登录页面，看能不能实现。和尚新建了一个呃工程项目工程，然里面的基本的内容和之前已经做过简单的介绍了，就是和安卓的很类似的，然后men的呃ability就相当于当安RO的main activity，然后和上新建一个那个登录页试一下。新建一个ability。然后新建的ability里面会有一个呃切片。这里面对应的是呃，Log in的叉ML，然后我们会看到这个在config里头已经新加了这个login ability登录的一个页面，然后因为呃和人新建的这个只是暂时先不做页面跳转，所以先把那个呃。

首页应用进来的首页先设置在那个log这边之后的话，我们就开始构建，呃。页面内容这个direction direction no layout就是一个线性布局，就和它那个呃呃，Land layout是应该是一致的，个人理解这在origin，这可以设置水平或者是垂直方向，然后这个的话，和尚先呃看有没有一妹纸。

呃，宽高的话，宽的话和尚先设置一个固定的。然后在这的话，Preview这儿可以看到它那个预先的一个内容。嗯。呃，因为这个direction就是线性布局，这设置了一个那个对齐方式是居中对齐，我让先设为一个。水平，然后再刷新一下这个。

就放顶上去了，但一个问题就是好像设置100或者150。它这头像就是这个logo的尺寸并没有变化，所以看一下有没有类似于呃，安卓的feet那种的model，然后尝试一下。OK，它已经变大了，然后设置一下它的外边距。外边距设置一个。

我刷新一下。图像这已经先展示了，之后的话我准备展示一个用户名，用户名和密码，呃，根据之前安卓开发的话，如果用线性布局的话，需要设置一个水平的线性布局。这个match parent和那个安卓的我理解的应该是一样的，就是默认填充嘛，负负类，然后match content就是类似于安卓的web方式，就是填充一部分自动填充的那种。这种水平灯，然后在里面就设置一个text。

Hat的话就是。Text。的属性和安卓是很像的，我现在这里设置一下简单的。Size test size画设成24，来B尝试一下。嗯，这时候已经有了，然后用户名之后的话，就是一个text field和Fla是一致的。然后这个OS下一次的话也是。

默认。没有，没有边框，没有内容，先设置一个背景试一下。看有没有color。

嗯，这里是有的，鼠标也是有的，对于边框的话，之后会让再做简单的介绍。然后这个用户名之后就是。密码。OK，然后我先设置一个对齐方式。这里面没有gravity，应该是对齐方式。

水平Dis。然后。下边这个也是一样的。然后设置一个。

OK，剩下这块的话对齐，然后合上之后再介绍。之后的话设置一个按钮。But。是反了。因为安卓上一般都是word在上面在下。

这是一个。的一个编剧。左右边距。编剧好像就说简单，随便说一个。然后是有的。

设置两个按钮。但是两个按钮并不明显，好像加一个边框。对边框的话是在。呃。Graphic就是这个一个背景的一个类似于安卓的JAJA。好像是这样。嗯，颜色的话就随便设一个吧。

然后设一个圆角吧。Cos。试着添加进来试验。然后设置这个效果的话，再设置一下那边距。

这个有点小，我想调整一下。其实我人觉得这个的开发还是挺快的。页面搭建和安卓非常的像。

So。替换下。然后按钮是有。然后我设置一下这个。这个文本框的一个边框。

这样就可以，然后颜色的话是一个。

报汤，还点四维水液，看下效果。往下移。不能说这个应该是外边。整个的吧，暂时先这样尝试一下。Moment。

这里是错了，应该是at可以。嗯，宽度的话要自适应用整个屏幕。这个也是一样的。然后。内容的话是。

这样就比较明显的看出match parent和match content的区别了。我设一下整个的一个。外边去。

OK，代码整理一下，简单就是这个样式，虽然比较丑啊，只是和尚也没有看官方的文档，只是先根据大概的了解试了一下，然后这些内容的话，还是应该写在对应的那个。呃，比较合适。然后合上先简单运行一下。

OK，样式基本上就是这样，但是需要调整一下这个宽高，那好像只是随意的设置，没有没有UI，没有其他的。那种的话。这个的话。我们输入。然后整个页面目前就暂时到这儿，然后剩下的话可能会对照呃官方文档再进一步的了解，只是先尝试一下啊，鸿蒙操作系统和安卓还是很相似的，就是对于开发成本来的说的话，呃，还是降低了很多，然后今天的内容简单就到此为止，谢谢大家。