HarmonyOS DataBinding 使用指南

开发 前端 OpenHarmony
Databinding 顾名思义就是数据绑定,HarmonyOS为提供了Databinding库,该库允许你使用声明格式而不是以代码的方式将数据绑定到UI上。

[[413224]]

想了解更多内容,请访问:

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

https://harmonyos.51cto.com

在开始讲DataBinding之前,我们不得不先说一下MVVM架构模式,MVVM是MVP模式的改进版,Model层跟View层与MVP模式类似,ViewModel层只做和逻辑处理相关的工作,在ViewModel中不会持有View层的引用,这时候就需要借助DataBinding,通过Binding方式通信,只需要在ViewModel层对数据进行操作,View层就会自动更新UI。

概述

​ Databinding 顾名思义就是数据绑定,HarmonyOS为提供了Databinding库,该库允许你使用声明格式而不是以代码的方式将数据绑定到UI上。Databinding库会解析布局文件,自动生成数据绑定代码,实现数据源与UI组件之间的相互绑定。

​ 自动生成绑定代码的基类,是用来实现ComponentContainer和ActiveData对象之间的绑定,ComponentContainer是指组件容器,相当于Android的ViewGroup,ActiveData是一个可观察数据类,同时也具有生命周期感知,作用类似于Android的LiveData。

​ 当ComponentContainer或ActiveData对象被修改时,DataBinding对象会自动修改绑定到ComponentContainer或ActiveData的对象。比如,如果你修改了某个ComponentContainer的属性,DataBinding会将属性值到绑定到该ComponentContainer的ActiveData对象。反之亦然,如果一个ActiveData对象的属性值被更改,绑定的ComponentContainer的属性值也将被更新。

开始使用

1.在使用DataBinding之前,首先要在应用模块下build.gradle中开启dataBinding,代码如下:

  1. ohos { 
  2.     ... 
  3.     buildTypes { 
  4.         debug { 
  5.             dataBindingEnabled true 
  6.         } 
  7.     } 

 2.使用DataBinding之前,首先使用ActiveData对象来定义要观察的数据,并实现其0get() 和set()方法:

创建一个Model类

  1. public class MainAbilityModel { 
  2.     private ActiveData titile; 
  3.  
  4.     public ActiveData getTitile() { 
  5.         return titile; 
  6.     } 
  7.     public void setTitile(ActiveData titile) { 
  8.         this.titile = titile; 
  9.     } 

 3.在我们的布局文件中,声明DataBinding的绑定标签,并在中定义刚创建的ActiveData Model类。

  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <DirectionalLayout 
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos" 
  4.     ohos:height="match_parent" 
  5.     ohos:width="match_parent" 
  6.     ohos:background_element="#1a1a1a" 
  7.     ohos:orientation="vertical"
  8.  
  9.     <Text 
  10.         ohos:id="$+id:title_text" 
  11.         ohos:height="300" 
  12.         ohos:width="match_parent" 
  13.         ohos:text="${model.titile}" 
  14.         ohos:text_alignment="center" 
  15.         ohos:text_color="#FF555555" 
  16.         ohos:text_size="50"/> 
  17.     <....> 
  18.     <binddata> 
  19.         <variable 
  20.             class="com.example.time.model.MainAbilityModel" 
  21.             name="model"/> 
  22.     </binddata> 
  23. </DirectionalLayout> 

在<Text>的ohos:text属性,进行数据绑定ohos:text=“${model.titile}”

4.在布局中声明DataBinding后,系统会在编译后自动生成一个以布局文件命名的Binding类,比如我的布局文件名为ability_main,那么系统就会自动生成一个AbilityMainBinding类。我们在Slice类中调用DataBindingUtil.createBinding方法来获取AbilityMainBinding的对象,然后调用initComponent及setLifecycle来初始化对象,之后我们就可以调用在ActiveData对象设置数据,调用MainAbilityModel中定义的方法,绑定到其中的ActiveData对象。

  1. public class MainAbilitySlice extends AbilitySlice { 
  2.     private static HiLogLabel mLabel = new HiLogLabel(HiLog.LOG_APP, 00001, "suisui"); 
  3.     AbilityMainBinding binding; 
  4.  
  5.     @Override 
  6.     public void onStart(Intent intent) { 
  7.         super.onStart(intent); 
  8.         ComponentContainer componentContainer = 
  9.                 (ComponentContainer) LayoutScatter.getInstance(this).parse(ResourceTable.Layout_ability_main, nullfalse); 
  10.         if (!(componentContainer instanceof ComponentContainer)) { 
  11.             return
  12.         } 
  13.         super.setUIContent(componentContainer); 
  14.         try { 
  15.             binding = DataBindingUtil.createBinding(ResourceTable.Layout_ability_main, getContext(), "com.example.time"); 
  16.         } catch (IllegalArgumentException | IOException exception) { 
  17.             HiLog.info(mLabel, exception.toString()); 
  18.         } 
  19.         if (binding != null) { 
  20.             binding.initComponent(componentContainer); 
  21.             binding.setLifecycle(getLifecycle()); 
  22.             ActiveData price = new ActiveData<>(); 
  23.             price.setData("DataBinding Demo"); 
  24.             MainAbilityModel model = new MainAbilityModel(); 
  25.             model.setTitile(price); 
  26.             binding.setModel(model); 
  27.         } 
  28.     } 

需要注意的是在调用DataBindingUtil.createBinding时,要替换成自己的包名。

至此,我们大致的把DataBinding的简单使用梳理了,总体来说DataBinding可以为我们减少代码量,也不需要再做findComponentById,设置数据等一些繁琐的操作。但在实际业务开发当中可能也会有一定的局限性,例如ActiveData的类型转换问题,相信后续官方也会越来越完善,HarmonyOS也会越来越好,让我们拭目以待。

最终效果

【中软国际】HarmonyOS DataBinding 使用指南-鸿蒙HarmonyOS技术社区

注:DevEco Studio版本过低可能会导致编译生成Binding找不到包,可升级版本再试。

想了解更多内容,请访问:

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

https://harmonyos.51cto.com

 

责任编辑:jianghua 来源: 鸿蒙社区
相关推荐

2022-09-29 09:07:08

DataGrip数据仓库数据库

2012-12-26 12:41:14

Android开发WebView

2011-07-21 14:57:34

jQuery Mobi

2009-12-28 17:40:10

WPF TextBox

2010-09-06 14:24:28

ppp authent

2021-01-12 15:19:23

Kubernetes

2009-12-31 17:17:45

Silverlight

2010-06-03 17:27:36

Hadoop命令

2010-08-05 15:40:21

FlexBuilder

2010-08-04 15:37:31

Flex图表

2017-01-04 15:22:57

TrimPath模板引擎

2019-11-13 12:39:26

Python 开发编程语言

2010-08-04 14:28:01

Flex组件

2024-02-04 00:00:00

Loki性能查询

2022-06-23 08:01:36

FlaskSocketIOSwift

2009-11-30 13:15:27

PHP模板Smarty

2010-12-12 11:27:00

PGP使用指南

2011-03-16 10:17:06

2024-02-18 12:44:22

2010-02-06 16:30:25

C++内存对齐
点赞
收藏

51CTO技术栈公众号