modify ux code

Signed-off-by: eleli <liheng10@huawei.com>
This commit is contained in:
eleli
2022-03-10 16:41:29 +08:00
parent 6318332bb4
commit cd363c7a01
9 changed files with 141 additions and 147 deletions
@@ -14,7 +14,7 @@
*/
import abilityFeatureAbility from '@ohos.ability.featureAbility';
import edmEnterpriseDeviceManager from '@ohos.edm.enterpriseDeviceManager';
import edmEnterpriseDeviceManager from '@ohos.enterpriseDeviceManager';
import resourceManager from '@ohos.resourceManager';
import router from '@system.router';
import appDetailData from '../model/appManagementImpl/appDetailData.ets'
@@ -54,27 +54,29 @@ struct ApplicationInfo {
Column() {
Text(this.enterpriseName)
.fontColor($r('app.color.color_333333_grey'))
.fontSize($r('app.float.font_20'))
.height($r('app.float.wh_value_21'))
.fontColor($r('sys.color.ohos_id_color_text_primary'))
.fontSize($r('app.float.font_16'))
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Start)
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.margin({
left: $r('app.float.wh_value_15'),
top: $r('app.float.wh_value_5'),
bottom: $r('app.float.wh_value_5')
left: $r('app.float.wh_value_36'),
top: $r('app.float.wh_value_12'),
});
Text(this.enterpriseDescription)
.fontColor($r('app.color.color_333333_grey'))
.fontSize($r('app.float.font_20'))
.height($r('app.float.wh_value_19'))
.fontColor($r('sys.color.ohos_id_color_text_secondary'))
.fontSize($r('app.float.font_14'))
.fontWeight(FontWeight.Regular)
.textAlign(TextAlign.Start)
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.margin({
left: $r('app.float.wh_value_15'),
top: $r('app.float.wh_value_5'),
bottom: $r('app.float.wh_value_5')
left: $r('app.float.wh_value_36'),
top: $r('app.float.wh_value_2'),
});
}
.width('100%')
@@ -83,15 +85,15 @@ struct ApplicationInfo {
Column() {
Text(this.isShowActive ? this.deviceAdminActive : this.deviceAdminDisActive)
.fontColor($r('app.color.color_333333_grey'))
.fontSize($r('app.float.font_20'))
.fontColor($r('sys.color.ohos_id_color_text_primary'))
.fontSize($r('app.float.font_16'))
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Start)
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.margin({
left: $r('app.float.wh_value_15'),
top: $r('app.float.wh_value_5'),
bottom: $r('app.float.wh_value_5')
left: $r('app.float.wh_value_36'),
top: $r('app.float.wh_value_24'),
});
List() {
@@ -112,17 +114,17 @@ struct ApplicationInfo {
Row() {
Button() {
Text(this.isShowActive ? $r('app.string.deActivate') : $r('app.string.activation'))
.fontSize($r('app.float.font_20'))
.fontColor(this.isEnableButton ? Color.Blue : $r('app.color.color_999999_grey'))
.opacity(this.isEnableButton ? 1 : 0.38)
.fontSize($r('sys.float.ohos_id_text_size_button1'))
.fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
}
.enabled(this.isEnableButton)
.backgroundColor($r('app.color.color_E3E3E3_grey'))
.backgroundColor($r('sys.color.ohos_id_color_button_normal'))
.height($r('app.float.button_height'))
.width($r('app.float.button_width'))
.margin({
right: $r('app.float.wh_value_20'),
bottom: $r('app.float.wh_value_5'),
left: $r('app.float.wh_value_20')
bottom: $r('app.float.wh_value_24'),
left: $r('app.float.wh_value_36')
})
.onClick(() => {
console.log('adminprovisioning ApplicationInfo in button active:' + this.isShowActive);
@@ -131,13 +133,17 @@ struct ApplicationInfo {
Button() {
Text($r('app.string.cancel'))
.fontSize($r('app.float.font_20'))
.fontColor(Color.Blue)
.fontSize($r('sys.float.ohos_id_text_size_button1'))
.fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
}
.backgroundColor($r('app.color.color_E3E3E3_grey'))
.backgroundColor($r('sys.color.ohos_id_color_button_normal'))
.height($r('app.float.button_height'))
.width($r('app.float.button_width'))
.margin({ left: $r('app.float.wh_value_20'), bottom: $r('app.float.wh_value_5') })
.margin({
left: $r('app.float.wh_value_24'),
right: $r('app.float.wh_value_36'),
bottom: $r('app.float.wh_value_24')
})
.onClick(() => {
console.log('adminprovisioning ApplicationInfo button cancel in isShowActive:' + this.isShowActive);
appDetailData.terminateAbilityPage();
@@ -145,6 +151,9 @@ struct ApplicationInfo {
}
.alignItems(VerticalAlign.Center)
}
.height('100%')
.width('100%')
.backgroundColor($r('sys.color.ohos_id_color_sub_background'))
}
private aboutToAppear(): void {
@@ -22,25 +22,27 @@ export default struct EntryComponent {
Flex({ justifyContent: FlexAlign.SpaceBetween }) {
Row() {
Image(this.appIcon)
.width($r('app.float.wh_value_50'))
.height($r('app.float.wh_value_50'))
.margin({ right: $r('app.float.wh_value_10') })
.width($r('app.float.wh_value_40'))
.height($r('app.float.wh_value_40'))
.margin({
left: $r('app.float.wh_value_36'),
right: $r('app.float.wh_value_16')
})
.visibility('' === this.appIcon ? Visibility.None : Visibility.Visible)
.objectFit(ImageFit.Contain);
Text(this.appTitle)
.fontColor($r('app.color.color_333333_grey'))
.fontSize($r('app.float.font_20'))
.fontColor($r('sys.color.ohos_id_color_text_primary'))
.fontSize($r('app.float.font_16'))
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Start)
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.margin({ top: $r('app.float.wh_value_10'), bottom: $r('app.float.wh_value_5') });
}
.flexShrink(0)
.alignItems(VerticalAlign.Center)
.align(Alignment.Start)
.height($r('app.float.wh_value_64'))
.width('100%')
}
.margin({ left: $r('app.float.wh_value_15') })
.width('100%')
}
}
@@ -23,13 +23,12 @@ export default struct HeadComponent {
build() {
Row() {
Image($r('app.media.ic_back'))
.width($r('app.float.wh_value_50'))
.height($r('app.float.wh_value_50'))
.width($r('app.float.wh_value_24'))
.height($r('app.float.wh_value_24'))
.borderRadius($r('app.float.wh_value_15'))
.margin({
left: $r('app.float.wh_value_15'),
top: $r('app.float.wh_value_5'),
bottom: $r('app.float.wh_value_5')
left: $r('app.float.wh_value_36'),
right: $r('app.float.wh_value_16'),
})
.backgroundColor($r('app.color.color_00000000_transparent'))
.visibility(Visibility.Visible)
@@ -37,16 +36,16 @@ export default struct HeadComponent {
router.back();
})
Text(this.headName)
.fontSize($r('app.float.font_24'))
.height($r('app.float.wh_value_56'))
.fontColor($r('sys.color.ohos_id_color_text_primary'))
.fontSize($r('app.float.font_20'))
.fontWeight(FontWeight.Bold)
.fontColor(Color.Black)
.width('90%')
.textAlign(TextAlign.Start)
.maxLines(1)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.margin({ left: $r('app.float.wh_value_15'), right: $r('app.float.wh_value_15') })
}
.width('100%')
.height($r('app.float.wh_value_70'))
.height($r('app.float.wh_value_56'))
.alignItems(VerticalAlign.Center)
.align(Alignment.Start)
}
@@ -20,37 +20,47 @@ export default struct PermissionListComponent {
build() {
Row() {
Image($r('app.media.rect1'))
.width($r('app.float.wh_value_7'))
.height($r('app.float.wh_value_7'))
.margin({
left: $r('app.float.wh_value_36'),
right: $r('app.float.wh_value_8') })
.objectFit(ImageFit.Contain);
Column() {
Text(this.permissionName)
.fontColor($r('app.color.color_333333_grey'))
.fontSize($r('app.float.font_20'))
.height($r('app.float.wh_value_22'))
.fontColor($r('sys.color.ohos_id_color_text_primary'))
.fontSize($r('app.float.font_16'))
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Start)
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.visibility('' === this.permissionName || undefined === this.permissionName
? Visibility.None : Visibility.Visible)
.margin({
left: $r('app.float.wh_value_15'),
top: $r('app.float.wh_value_5'),
bottom: $r('app.float.wh_value_5')
bottom: $r('app.float.wh_value_2'),
});
Text(this.permissionDescription)
.fontColor($r('app.color.color_999999_grey'))
.fontSize($r('app.float.font_20'))
.height($r('app.float.wh_value_19'))
.fontColor($r('sys.color.ohos_id_color_text_secondary'))
.fontSize($r('app.float.font_14'))
.fontWeight(FontWeight.Regular)
.textAlign(TextAlign.Start)
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.visibility('' === this.permissionDescription || undefined === this.permissionDescription
? Visibility.None : Visibility.Visible)
.margin({
left: $r('app.float.wh_value_15'),
top: $r('app.float.wh_value_5'),
bottom: $r('app.float.wh_value_5')
});
}
.alignItems(HorizontalAlign.Start)
}
.height($r('app.float.wh_value_64'))
.width('100%')
.margin({
top: $r('app.float.wh_value_12')
})
.align(Alignment.Start)
.alignItems(VerticalAlign.Center)
}
@@ -1,121 +1,88 @@
{
"float": [
{
"name": "wh_value_1",
"value": "1"
"name": "wh_value_2",
"value": "2vp"
},
{
"name": "wh_value_5",
"value": "5"
"value": "5vp"
},
{
"name": "wh_value_10",
"value": "10"
"name": "wh_value_7",
"value": "7vp"
},
{
"name": "wh_value_8",
"value": "8vp"
},
{
"name": "wh_value_12",
"value": "12vp"
},
{
"name": "wh_value_15",
"value": "15"
"value": "15vp"
},
{
"name": "wh_value_20",
"value": "20"
"name": "wh_value_16",
"value": "16vp"
},
{
"name": "wh_value_30",
"value": "30"
"name": "wh_value_19",
"value": "19vp"
},
{
"name": "wh_value_21",
"value": "21vp"
},
{
"name": "wh_value_22",
"value": "22vp"
},
{
"name": "wh_value_24",
"value": "24vp"
},
{
"name": "wh_value_36",
"value": "36vp"
},
{
"name": "wh_value_40",
"value": "40"
"value": "40vp"
},
{
"name": "wh_value_50",
"value": "50"
"name": "wh_value_56",
"value": "56vp"
},
{
"name": "wh_value_60",
"value": "60"
"name": "wh_value_64",
"value": "64vp"
},
{
"name": "wh_value_65",
"value": "65"
"name": "wh_value_75",
"value": "75vp"
},
{
"name": "wh_value_70",
"value": "70"
"name": "font_14",
"value": "14fp"
},
{
"name": "wh_value_80",
"value": "80"
},
{
"name": "wh_value_100",
"value": "100"
},
{
"name": "wh_value_130",
"value": "130"
},
{
"name": "wh_value_160",
"value": "160"
},
{
"name": "wh_value_230",
"value": "230"
},
{
"name": "wh_value_280",
"value": "280"
},
{
"name": "wh_value_390",
"value": "390"
},
{
"name": "wh_value_400",
"value": "400"
},
{
"name": "font_35",
"value": "35"
},
{
"name": "font_18",
"value": "18"
"name": "font_16",
"value": "16fp"
},
{
"name": "font_20",
"value": "20"
},
{
"name": "font_21",
"value": "21"
},
{
"name": "font_22",
"value": "22"
},
{
"name": "font_24",
"value": "24"
},
{
"name": "font_28",
"value": "28"
},
{
"name": "font_50",
"value": "50"
"value": "20fp"
},
{
"name": "button_width",
"value": "160"
"value": "336vp"
},
{
"name": "button_height",
"value": "40"
"value": "40vp"
}
]
}
@@ -10,7 +10,7 @@
},
{
"name": "adminprovisioning",
"value": "设备管理配置"
"value": "是否激活设备管理器?"
},
{
"name": "appManagement",
@@ -50,11 +50,11 @@
},
{
"name": "enterprise_name",
"value": "enterprise name:"
"value": "enterprise name: "
},
{
"name": "enterprise_description",
"value": "enterprise description:"
"value": "enterprise description: "
}
]
}
+7
View File
@@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="7px" height="7px" viewBox="0 0 7 7" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>矩形</title>
<g id="设备管理器" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" fill-opacity="0.2">
<rect id="矩形" fill="#182431" x="0" y="0" width="7" height="7" rx="1"></rect>
</g>
</svg>

After

Width:  |  Height:  |  Size: 421 B

@@ -10,7 +10,7 @@
},
{
"name": "adminprovisioning",
"value": "Device Management Configuration"
"value": "Activate Device Manager?"
},
{
"name": "appManagement",
@@ -50,11 +50,11 @@
},
{
"name": "enterprise_name",
"value": "enterprise name:"
"value": "enterprise name: "
},
{
"name": "enterprise_description",
"value": "enterprise description:"
"value": "enterprise description: "
}
]
}
@@ -10,7 +10,7 @@
},
{
"name": "adminprovisioning",
"value": "设备管理配置"
"value": "是否激活设备管理器?"
},
{
"name": "appManagement",
@@ -50,11 +50,11 @@
},
{
"name": "enterprise_name",
"value": "企业名字:"
"value": "企业名称: "
},
{
"name": "enterprise_description",
"value": "企业描述:"
"value": "企业描述: "
}
]
}