鸿蒙初开，开天辟地
图片尺寸
过于常用,直接width和height就可以设置
可以传递string,number,resource类型进行设置
string一般是设置百分比用到,还有用px和vp的情况下也会用
鸿蒙应用中常用的尺寸单位px和vp
屏幕参数,像素,屏幕显示的最小单位,屏幕上一个小亮点就是一个像素
分辨率,横向上和纵向上的像素数量
屏幕像素
比如说这个图上的手机,它的屏幕就是横向上1080个像素px,纵向上2340个像素px
尺寸,屏幕对角线的长度,用英尺为单位
这个指的是屏幕的对角线的长度,如这个手机的尺寸就是6.1英寸的
像素密度,每英寸屏幕上的像素数量
PPI,较高的像素密度就意味着在相同尺寸的屏幕上像素点更多,可以为用户提供更加清晰和细腻的图像
px,物理像素
以像素个数来定义图像尺寸,这种方式的弊端是在不同像素密度PPI屏幕上,相同像素对应的物理尺寸是不同的,这样就会导致应用在不同设备显示的图片尺寸不同
vp,虚拟像素
可以根据实际屏幕PPI灵活缩放的单位,1vp相当于像素密度为160ppi的屏幕的1px,系统会根据不同屏幕的ppi转换为对应的物理像素px,类似安卓的dp
因为在像素密度低的屏幕上,单个像素的物理尺寸大,像素密度高的屏幕上,单个像素物理尺寸小
总的来说非常接近安卓开发的dp和dpi
通过vp的设置,我们就能在不同像素密度的屏幕上,获取基本一致的观感了
75px和25vp的显示效果
number是具体数值,默认以vp为单位
Resource类型用于引用resources下的element目录中定义的数值
引用element目录中的数值,同样需要使用$r()取值的方式
但是这里的存储文件和取值是有对应讲究的
如:name.json,我需要保存name的string在里面,就需要在json中定义类型的数组,并将需要的内容以键值对的形式保存进去
{
"string": [
{
"name": "Jack",
"value": "杰克"
},
{
"name": "Rose",
"value": "露丝"
}
]
}当我们要取值的时候,指明类型和key就可以直接获取到
@Component
export default struct See {
@State options:string[] = ["JAVA","Python","C#","Golang"];
@State answer:string = "____";
build() {
Column({space:20}){
Row(){
Text("江河浩瀚,胡生可安").fontSize(25).fontWeight(FontWeight.Bold);
Text(this.answer).fontSize(25).fontWeight(FontWeight.Bold);
};
Image($r('app.media.background')).height('75px').width('75px');
Image($rawfile('123.png')).height('25vp').width('25vp');
Text($r('app.string.Rose'))
Button({type:ButtonType.Circle}){
Text("ArkTS")
}.onClick(()=>{
// this.options = ["JAVA","Python","C#","Golang","ArkTs"];
this.options.push("ArkTs");
}).width(50).height(50);
ForEach(this.options,(item:string) => {
Button(item).width(100).backgroundColor(Color.Red).onClick(()=>{
this.answer = item;
});
},((item:string)=>
JSON.stringify(item)
));
}
}
}