屏幕适配UI设计图解决方案原创

BLUESKYHOST

发布于 2021-3-4 11:33

1100浏览

1收藏

最新收录于

鸿蒙OS前端开发入门指南

查看专栏

先上图

这仨赏金猎人App解决方案赏金猎人开发日志地址https://harmonyos.51cto.com/posts/3203，我想问问谁有办法替换系统默认的尺寸计算方案求大佬告知

这个是实现渲染

屏幕适配UI设计图解决方案-鸿蒙开发者社区

这个是UI设计图

屏幕适配UI设计图解决方案-鸿蒙开发者社区

看看实际效果

平板
移动端

屏幕适配UI设计图解决方案-鸿蒙开发者社区

使用方法

RpxUtil.rpx(23,this.context) 直接按照UI尺寸调用即可

源码

package com.example.shangjinlieren.utils;

import ohos.agp.window.service.Display;
import ohos.agp.window.service.DisplayManager;
import ohos.app.Context;

public  class  RpxUtil {
  private  static float WIDTH=750;
  private  static float HEIGHT=1334;
    public static  float rpx(int value, Context context){

       float wRatioValue=  (getDisplayWidthInPx(context)/WIDTH)*value;
        float hRatioValue=  ( getDisplayHeightInPx(context)/HEIGHT)*value;
        float h =0;
        if (value<=750){
            h= wRatioValue;
        }else if (value>750){
            h=hRatioValue;
        }
        return   h;
    }
    /**
     * 获取屏幕宽度
     *
     * @return 屏幕宽度
     */
    public static int getDisplayWidthInPx( Context context) {
        Display display = DisplayManager.getInstance().getDefaultDisplay(context).get();
        return display.getAttributes().width;
    }
    /**
     * 获取屏幕高度，不包含状态栏的高度
     * @return 屏幕高度，不包含状态栏的高度
     */
    public static int getDisplayHeightInPx( Context context) {
        Display display = DisplayManager.getInstance().getDefaultDisplay(context).get();
        return display.getAttributes().height;
    }

}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.