zoukankan      html  css  js  c++  java
  • 【软通动力】HarmonyOS三方件开发指南(1)PrecentPositionLayout

    目录:

    1.      PrecentPositionLayout功能介绍

    2.      PrecentPositionLayout使用方法

    3.      PrecentPositionLayout开发实现

    1.      PrecentPositionLayout功能介绍
    1.1.     组件介绍:
            SDK提供了不同布局规范的组件容器,例如以单一方向排列的DirectionalLayout、以相对位置排列的DependentLayout、以确切位置排列的PositionLayout等。

            其中PositionLayout中组件的位置是以绝对像素点定义的,无法实现根据屏幕的大小自适应。因此,引入一种以百分比方式定义的PrecentPositionLayout布局容器,通过它可以很方便的实现屏幕自适应。

    1.2.     手机模拟器上运行效果:
      【软通动力】HarmonyOS三方件开发指南(1)-PrecentPositionLayout

    2.      PrecentPositionLayout使用方法
    2.1.     新建工程,增加组件Har包依赖
    在应用模块中调用HAR,只需要将precentpositionlayout.har复制到entry\libs目录下即可(由于build.gradle中已经依赖libs目录下的*.har,因此不需要再做修改)。

    2.2.     修改主页面的布局文件
    修改主页面的布局文件ability_main.xml,将跟组件容器修改为com.isoftstone.precentpositionlayout.PrecentPositionLayout,然后再增加5个Text组件,分别位于屏幕的左上,左下,右上,右下和中间,每个组件的长度和宽度都占屏幕的25%。修改后代码如下:
     

    <?xml version="1.0" encoding="utf-8"?>
    
    
    
    <com.isoftstone.precentpositionlayout.PrecentPositionLayout
    
        xmlns:ohos="http://schemas.huawei.com/res/ohos"
    
        ohos:height="match_parent"
    
        ohos:width="match_parent">
    
    
    
        <Text
    
            ohos:id="$+id:text_helloworld"
    
            ohos:height="250"
    
            ohos:width="250"
    
            ohos:left_margin="0"
    
            ohos:top_margin="0"
    
            ohos:background_element="$graphic:background_text"
    
            ohos:text="左上25%"
    
            ohos:text_size="50"
    
            />
    
    
    
        <Text
    
            ohos:id="$+id:text_helloworld"
    
            ohos:height="250"
    
            ohos:width="250"
    
            ohos:left_margin="750"
    
            ohos:top_margin="0"
    
            ohos:background_element="$graphic:background_text"
    
            ohos:text="右上25%"
    
            ohos:text_size="50"
    
            />
    
    
    
        <Text
    
            ohos:id="$+id:text_helloworld"
    
            ohos:height="250"
    
            ohos:width="250"
    
            ohos:left_margin="0"
    
            ohos:top_margin="750"
    
            ohos:background_element="$graphic:background_text"
    
            ohos:text="左下25%"
    
            ohos:text_size="50"
    
            />
    
    
    
        <Text
    
            ohos:id="$+id:text_helloworld"
    
            ohos:height="250"
    
            ohos:width="250"
    
            ohos:left_margin="750"
    
            ohos:top_margin="750"
    
            ohos:background_element="$graphic:background_text"
    
            ohos:text="右下25%"
    
            ohos:text_size="50"
    
            />
    
    
    
        <Text
    
            ohos:id="$+id:text_helloworld"
    
            ohos:height="250"
    
            ohos:width="250"
    
            ohos:left_margin="375"
    
            ohos:top_margin="375"
    
            ohos:background_element="$graphic:background_text"
    
            ohos:text="中心25%"
    
            ohos:text_size="50"
    
            />
    
    
    
    </com.isoftstone.precentpositionlayout.PrecentPositionLayout>


     
    2.3.     增加Text组件的背景资源文件
    为方便观察,上一步我们将Text组件设置了一个绘制背景graphic:background_text。

    这里需要在resources/base/grahic目录下新增一个可绘制资源文件。

    右键点击graphic,选择New-File,文件名输入background_text.xml。

    【软通动力】HarmonyOS三方件开发指南(1)-PrecentPositionLayout

    文件内容如下:(可复制background_ability_main.xml的内容,修改color值即可)

    <?xml version="1.0" encoding="UTF-8" ?>
    
    <shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
    
           ohos:shape="rectangle">
    
        <solid
    
            ohos:color="#00FFFF"/></shape>


     
    2.4.     修改MainAbilitySlince的UI加载代码
    在MainAbilitySlince类的onStart函数中,增加如下代码。

    public void onStart(Intent intent) {
    
        super.onStart(intent);
    
        // 解析xml获得PrecentPositionLayout对象
    
        PrecentPositionLayout precentPositionLayout = (PrecentPositionLayout) LayoutScatter.getInstance(getContext()).parse(ResourceTable.Layout_ability_main, null, false);
    
    
    
        // 自动调整组件的百分比
    
        precentPositionLayout.AutoSize();
    
    
    
        // 设置到UI
    
        super.setUIContent(precentPositionLayout);
    
        //super.setUIContent(ResourceTable.Layout_ability_main);
    
    }

    查看更多章节>>>

    作者:软通动力乾

    想了解更多内容,请访问: 51CTO和华为官方战略合作共建的鸿蒙技术社区https://harmonyos.51cto.com/

  • 相关阅读:
    JZOJ 3034. 【NOIP2012模拟10.17】独立集
    JZOJ 3035. 【NOIP2012模拟10.17】铁轨
    JZOJ 1259. 牛棚安排
    数位DP JZOJ 3316. 非回文数字
    JZOJ 3046. 游戏
    JZOJ 3013. 填充棋盘
    debian 安装oracle提供的java8
    java 汉字转拼音 PinYin4j
    debian ssh设置root权限登陆 Permission denied, please try again
    java并发下订单生成策略
  • 原文地址:https://www.cnblogs.com/HarmonyOS/p/14245209.html
Copyright © 2011-2022 走看看