HarmonyOS入门|JavaUI线性布局

该文章介绍了如何在华为DevEcoStudio3.1Beta1版本中,使用已被弃用的Java语言进行HarmonyOS应用开发,特别是线性布局的设计。开发者需要下载API7以下版本的SDK,并通过步骤详细讲解了创建EmptyAbility项目,命名Module,布局文件的修改,包括删除默认元素,设置线性布局的方向、高度、宽度和权重,以及背景颜色的调整。

本代码地实现都是基于Huawei DevEco Studio程序,目前IDE已经更新到3.1 Beta1版本,而Java是旧版本的开发语言,在新版本已经被弃用,要想用Java进行程序开发的话,应在主页配置的设置里SDKs页面下载API7以下版本的SDK,本文章是基于API7写成的。

IDE官方下载网站:HarmonyOS应用开发官网 - 华为HarmonyOS打造全场景新服务

此次进行的线性布局设计是在一个页面内,将页面线性分成三个部分,并用不同的颜色进行填充。

首先,我们在应用首页建一个新项目,即HarmonyOS下的Empty Ability,点击Next。

其次,我们为Project赋名(根据个人喜好即可),Compile SDK选择3.0.0(API7),Language选择Java,完成后点击Finish。

第三,我们在项目的名称处点右键,新建一个模块(Module),依旧是选择Empty Ability,开发语言选择Java,我对此Module命名为DirectionDemo1。

第四,我们先对DirectionDemo1下主要的文件有个认识,实现线性布局主要进行在DirectionDemo1/src/main/里,main中有java和resources两个文件(由于笔者能力有限,仅阐述个人对部分文件的认知),resources下的base文件中有四个文件,分别是element对应的元素(可用于实现Text等的输出),graphic对应的图像(可用于对界面的背景设置),layout对应的布局(可以实现线性布局和相对布局等),media对应的媒介(可用于插入一些图片等)。

我们首先删除element/string.json中自带的初始化Hellow World输出,并在layout/ability_main.xml下进行布局设计,<DirectionalLayout/>是实现线性布局的执行代码,而三个小的线性布局是在一个大的线性布局下实现的,height对应高度,width对应宽度,orientation对应方向,而在height和width又有match_parent(与父容器相比配)和match_content(自适应),而orientation中又有vertical(垂直)和horizontal(水平)两种。

然后分别对三个小的线性布局进行细节化处理,其中weight对应权重比例,三者都是“1”,说明三个线性布局将页面三等分,我们可以根据调成三个权重的大小,进行对应的比例划分。

最后是对页面背景进行设置,利用background_element指令,用$调用指定文件,而设置背景则调用的是graphic中的文件。

第五,我们需要对background进行修改,只需修改颜色代码即可,最简单的修改方式就是选择ohos:color左端对应的颜色方块,选择自己想要的颜色。

新建background.xml文件只需对background_ability_main.xml进行Ctrl+C和Ctrl+V即可。

最后,我们回到layout下的ability_main.xml界面,打开预览器就可以得到最后的效果,完成简单的线性布局设计。

由于笔者能力有限,可能存在很多问题与不足,敬请各位前辈指正指导!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

再给艾克三年

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值