harmonyOS应用组件两种创建方式

1、在layout文件夹中通过xml文件创建

• 创建一个xml文件：例ability_demo.xml
• 文件中加下列代码

  <?xml version="1.0" encoding="utf-8"?>
  <DependentLayout
      xmlns:ohos="http://schemas.huawei.com/res/ohos"
      ohos:width="match_parent"
      ohos:height="match_parent"
      ohos:background_element="#000111">
  
  </DependentLayout>

  说明：DependentLayout 标签是所有组件的承载体，所有组件都在该标签里面

• 在DependentLayout标签中插入文本组件

  <Text
          ohos:id="$+id:text"
          ohos:width="match_content"
          ohos:height="match_content"
          ohos:text="你好，鸿蒙"
          ohos:text_color="#000000"
          ohos:text_size="32fp"
          ohos:center_in_parent="true"/>

  说明：鸿蒙应用所有组件的属性开始都是ohos：开始的（起始好像是harmonyos：开始，但是我接触的时候是ohos） id（该组件的id），$+id指创建id为text的组件

• 创建DemoAilitySlice.java继承AbilitySlice类，实现onStart方法来加载你定义好的布局：

  public class DemoAbilitySlice extends AbilitySlice {
  
      @Override
      public void onStart(Intent intent) {
          super.onStart(intent);
          super.setUIContent(ResourceTable.Layout_ability_demo);  // 加载xml布局
      }
  }

• 在MainAbility中加载DemoAilitySlice类

  public class MainAbility extends Ability {
      @Override
      public void onStart(Intent intent) {
          super.onStart(intent);
          super.setMainRoute(DemoAbilitySlice.class.getName());  //启动时的第一个页面
      }
  }

2、直接在Slice中创建组件

• 在Slice中创建组件的时候就不用再加载xml文件，直接创建

  public void onStart(Intent intent) {
          super.onStart(intent);
          // 声明布局
          DependentLayout myLayout = new DependentLayout(this);
          // 设置布局大小
          myLayout.setWidth(MATCH_PARENT);
          myLayout.setHeight(MATCH_PARENT);
          // 设置布局背景为白色
          ShapeElement element = new ShapeElement();
          element.setRgbColor(new RgbColor(255, 255, 255));
          myLayout.setBackground(element);
  
          // 创建一个文本
          Text text = new Text(this);
          text.setText(intent.getStringParam("date"));
          text.setWidth(MATCH_PARENT);
          text.setTextSize(100);
          text.setTextColor(Color.BLACK);
          // 设置文本的布局
          DependentLayout.LayoutConfig textConfig = new DependentLayout.LayoutConfig(MATCH_CONTENT,MATCH_CONTENT);
          textConfig.addRule(DependentLayout.LayoutConfig.CENTER_IN_PARENT);
          text.setLayoutConfig(textConfig);
          myLayout.addComponent(text);  //将组件加入到布局页面
  
          super.setUIContent(myLayout);  //加载布局
      }

   

  初入鸿蒙，不喜勿喷