!150 列表hover效果+弹窗间距调整

Merge pull request !150 from fanchenxuan/master
This commit is contained in:
openharmony_ci 2023-07-28 02:01:07 +00:00 committed by Gitee
commit d3fec5aee8
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
12 changed files with 212 additions and 38 deletions

View File

@ -4,8 +4,8 @@
"app": {
"bundleName": "com.ohos.permissionmanager",
"vendor": "example",
"versionCode": 1000015,
"versionName": "1.1.5",
"versionCode": 1000016,
"versionName": "1.1.6",
"icon": "$media:app_icon",
"label": "$string:app_name",
"minAPIVersion": 9,

View File

@ -21,6 +21,7 @@ export struct backBar {
@Prop title: string; // return title name
@Prop recordable: boolean;
@State record: string = '';
@State isToush: string = '';
build() {
Column() {
@ -55,14 +56,7 @@ export struct backBar {
.height(Constants.BACKBAR_IMAGE_HEIGHT)
.width(Constants.BACKBAR_IMAGE_WIDTH)
.margin({ top: Constants.BACKBAR_TEXT_MARGIN_TOP, right: Constants.BACKBAR_IMAGE_MARGIN_RIGHT })
.bindMenu([
{
value: $r("app.string.permission_access_record"),
action: () => {
router.pushUrl({ url: 'pages/permission-access-record' })
}
}
])
.bindMenu(this.MenuBuilder())
}
}
}
@ -71,4 +65,38 @@ export struct backBar {
.alignItems(HorizontalAlign.Start)
.backgroundColor($r("sys.color.ohos_id_color_sub_background"))
}
@Builder MenuBuilder() {
Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
Row() {
Text($r("app.string.permission_access_record"))
.fontSize(Constants.TEXT_MIDDLE_FONT_SIZE)
.fontWeight(FontWeight.Medium)
.fontColor($r('sys.color.ohos_id_color_text_primary'))
}.constraintSize({ minWidth: Constants.MAXIMUM_HEADER_WIDTH })
.height(Constants.LISTITEM_ROW_HEIGHT)
.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === 'true') ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = 'true';
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
.onClick(() => {
router.pushUrl({ url: 'pages/permission-access-record' })
})
}
}
}

View File

@ -100,7 +100,7 @@ export struct globalDialog {
.backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
.borderRadius(Constants.DIALOG_PRIVACY_BORDER_RADIUS)
.width(Constants.FULL_WIDTH)
.margin({ bottom: Constants.DIALOG_MARGIN_BOTTOM })
.margin({ bottom: $r('sys.float.ohos_id_dialog_margin_bottom') })
.clip(true)
}.width(Constants.FULL_WIDTH)
.height(Constants.FULL_HEIGHT)

View File

@ -68,6 +68,7 @@ struct appNamePlusPage {
@State bannedListItem: permissionObj[] = []; // array of forbidden permissions
@State routerData: ResourceObj = globalThis.applicationInfo; // Routing jump data
@State label: string = '';
@State isToush: string = '';
@Builder ListItemLayout(item, index, status) {
ListItem() {
@ -111,7 +112,25 @@ struct appNamePlusPage {
});
})
}
}.padding({ left: Constants.DEFAULT_PADDING_START, right: Constants.DEFAULT_PADDING_END })
}.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === item.group) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = item.group;
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
}
showOrNot(index, status) {
@ -309,7 +328,7 @@ struct appNamePlusPage {
}
.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
}.margin({ top: Constants.ROW_MARGIN_TOP })
.padding({
left: Constants.SECONDARY_LIST_PADDING_LEFT,
@ -340,7 +359,7 @@ struct appNamePlusPage {
}
.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
}.margin({ top: Constants.ROW_MARGIN_TOP })
.padding({
left: Constants.SECONDARY_LIST_PADDING_LEFT,

View File

@ -120,6 +120,7 @@ struct mediaDocumentItem {
@State accurateIsOn: boolean = true;
@State api: number = 0;
@State isRisk: boolean = false; // Whether it is a risky application
@State isToush: number = -1;
@State reason: string = '';
@State label: string = '';
@State version: string = '';
@ -428,18 +429,31 @@ struct mediaDocumentItem {
}
}
}
.padding({
left: Constants.DEFAULT_PADDING_START,
right: Constants.DEFAULT_PADDING_END
.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === index) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = index;
}
if (event.type === TouchType.Up) {
this.isToush = -1;
}
})
.margin({ top: Constants.TERTIARY_LISTITEM_MARGIN_TOP })
}, item => JSON.stringify(item))
}
.borderRadius(Constants.BORDER_RADIUS)
.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.padding({
top: Constants.TERTIARY_LIST_PADDING_TOP, bottom: Constants.TERTIARY_LIST_PADDING_BOTTOM
})
.padding(Constants.LIST_PADDING_TOP)
if ((this.api >= Constants.API_VERSION_SUPPORT_STAGE) && (permissions.includes(PRECISE_LOCATION_PERMISSION))) {
Column() {

View File

@ -145,12 +145,31 @@ struct authorityManagementPage {
}
})
}
}.padding({ left: Constants.DEFAULT_PADDING_START, right: Constants.DEFAULT_PADDING_END })
}.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === item.group) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = item.group;
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
}
@State allPermissionApplications: permissionApplications [] = []; // All app permissions
@State allGroupPermission: groupPermission[] = []; // All group permissions
@State currentIndex: number = 0;
@State isToush: string = '';
@Builder TabBuilder(index: number) {
Flex({ alignItems: index ? ItemAlign.Start : ItemAlign.End, justifyContent: FlexAlign.Center, direction: FlexDirection.Column }) {
Text(index ? $r('app.string.application') : $r('app.string.permission'))
@ -502,7 +521,7 @@ struct authorityManagementPage {
}, item => JSON.stringify(item))
}.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
.margin({ bottom: Constants.LIST_MARGIN_BOTTOM })
}
@ -513,7 +532,7 @@ struct authorityManagementPage {
}, item => JSON.stringify(item))
}.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
.margin({ bottom: Constants.LIST_MARGIN_BOTTOM })
}
@ -525,7 +544,7 @@ struct authorityManagementPage {
}, item => JSON.stringify(item))
}.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
.margin({ bottom: Constants.LIST_MARGIN_BOTTOM })
}
}
@ -537,7 +556,7 @@ struct authorityManagementPage {
}, item => JSON.stringify(item))
}.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
}.margin({ bottom: Constants.AUTHORITY_ROW_MARGIN_BOTTOM })
}.height(Constants.FULL_HEIGHT)
.borderRadius(Constants.BORDER_RADIUS)
@ -582,6 +601,7 @@ struct applicationItem {
@State applicationItem: any[] = globalThis.allBundleInfo; // application info array
@State searchResult: boolean = true; // search results
@State selectedIndex: number = 0;
@State isToush: string = '';
scroller: Scroller = new Scroller();
@Builder ListItemLayout(item, index) {
@ -632,9 +652,24 @@ struct applicationItem {
router.pushUrl({ url: 'pages/application-secondary' });
})
}
}.padding({
left: Constants.DEFAULT_PADDING_START,
right: Constants.DEFAULT_PADDING_END
}.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === item.bundleName) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = item.bundleName;
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
}
@ -670,7 +705,7 @@ struct applicationItem {
}, item => JSON.stringify(item))
}.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
.onScrollIndex((start, end) => {
globalThis.scroller = this.scroller;
if (this.applicationItem.length > 0) {

View File

@ -69,6 +69,7 @@ struct appNameItem {
@State calendarListItem: CalendarObj[] = []; // Permission management secondary interface data array
private routerData: any = router.getParams()['routerData']; // Routing jump data
private group = router.getParams()['group'];
@State isToush: string = '';
@Builder ListItemLayout(item, index) {
ListItem() {
@ -108,7 +109,25 @@ struct appNameItem {
});
})
}
}.padding({ left: Constants.DEFAULT_PADDING_START, right: Constants.DEFAULT_PADDING_END })
}.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === item.permissionName) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = item.permissionName;
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
}
/**
@ -154,7 +173,7 @@ struct appNameItem {
.padding({ left: Constants.DEFAULT_PADDING_START, right: Constants.DEFAULT_PADDING_END })
}
}.backgroundColor($r('sys.color.ohos_id_color_list_card_bg')).borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
}.margin({ top: Constants.ROW_MARGIN_TOP })
.padding({ left: Constants.LIST_PADDING_LEFT, right: Constants.LISTITEM_PADDING_RIGHT })
}

View File

@ -191,7 +191,7 @@ struct PermissionDialog {
.borderRadius(Constants.DIALOG_PRIVACY_BORDER_RADIUS)
.width(Constants.FULL_WIDTH)
.padding({ bottom: Constants.DIALOG_PADDING_BOTTOM })
.margin({ bottom: Constants.DIALOG_MARGIN_BOTTOM })
.margin({ bottom: $r('sys.float.ohos_id_dialog_margin_bottom') })
.clip(true)
}.width(Constants.FULL_WIDTH)
.height(Constants.FULL_HEIGHT)

View File

@ -98,7 +98,7 @@ struct globalDialog {
.backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
.borderRadius(Constants.DIALOG_PRIVACY_BORDER_RADIUS)
.width(Constants.FULL_WIDTH)
.margin({ bottom: Constants.DIALOG_MARGIN_BOTTOM })
.margin({ bottom: $r('sys.float.ohos_id_dialog_margin_bottom') })
.clip(true)
}.width(Constants.FULL_WIDTH)
.height(Constants.FULL_HEIGHT)

View File

@ -77,6 +77,8 @@ struct appNamePage {
@Component
struct appNameItem {
@State otherPermissionListItem: string[] = otherPermissionList; // Other permission interface data array
@State isToush: string = '';
@Builder ListItemLayout(item, index) {
ListItem() {
Row() {
@ -117,7 +119,25 @@ struct appNameItem {
});
})
}
}.padding({ left: Constants.DEFAULT_PADDING_START, right: Constants.DEFAULT_PADDING_END })
}.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === item.permission) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = item.permission;
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
}
build() {
@ -133,7 +153,7 @@ struct appNameItem {
this.ListItemLayout(item, Constants.SLICE_END_INDEX)
}, item => JSON.stringify(item))
}.backgroundColor($r('sys.color.ohos_id_color_list_card_bg')).borderRadius(Constants.BORDER_RADIUS)
.padding({ top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
.padding(Constants.LIST_PADDING_TOP)
}.margin({ top: Constants.ROW_MARGIN_TOP })
.padding({ left: Constants.LIST_PADDING_LEFT, right: Constants.LISTITEM_PADDING_RIGHT })
}

View File

@ -50,6 +50,7 @@ struct permissionRecordPage {
@State strings: StringObj = new StringObj('', '');
@State currentIndex: number = 0;
@State show: boolean = false;
@State isToush: string = '';
@Builder TabBuilder(index: number) {
Flex({ alignItems: index ? ItemAlign.Start : ItemAlign.End, justifyContent: FlexAlign.Center, direction: FlexDirection.Column }) {
Text(index ? $r('app.string.application') : $r('app.string.permission'))
@ -155,6 +156,7 @@ struct permissionRecordPage {
})
}
})
.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
if (dimension && (index == this.permissionIndex)) {
List() {
ForEach(this.permissionApplications, (permissionApplication) => {
@ -204,6 +206,25 @@ struct permissionRecordPage {
}
router.pushUrl({ url: 'pages/application-secondary' });
})
.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === permissionApplication.name) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = permissionApplication.name;
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
}, item => JSON.stringify(item))
}
}
@ -254,12 +275,30 @@ struct permissionRecordPage {
}
router.pushUrl({ url: 'pages/application-secondary' });
})
.padding({ left: $r('sys.float.ohos_id_card_margin_start'), right: $r('sys.float.ohos_id_card_margin_end') })
.borderRadius($r("sys.float.ohos_id_corner_radius_default_l"))
.linearGradient((this.isToush === permission.name) ? {
angle: 90,
direction: GradientDirection.Right,
colors: [['#DCEAF9', 0.0], ['#FAFAFA', 1.0]]
} : {
angle: 90,
direction: GradientDirection.Right,
colors: [[$r("sys.color.ohos_id_color_list_card_bg"), 1], [$r("sys.color.ohos_id_color_list_card_bg"), 1]]
})
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.isToush = permission.name;
}
if (event.type === TouchType.Up) {
this.isToush = '';
}
})
}, item => JSON.stringify(item))
}
}
}
}.padding({ left: Constants.DEFAULT_PADDING_START, right: Constants.DEFAULT_PADDING_END,
top: Constants.LIST_PADDING_TOP, bottom: Constants.LIST_PADDING_BOTTOM })
}.padding(Constants.LIST_PADDING_TOP)
.margin({ bottom: Constants.LISTITEM_MARGIN_BOTTOM })
.backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
.borderRadius(Constants.BORDER_RADIUS)

View File

@ -184,7 +184,7 @@ struct CustomSecurityDialog {
.height(Constants.SECURITY_BUTTON_ROW_HEIGHT)
}.margin({ left: Constants.SECURITY_TOTAL_MARGIN_LEFT, right: Constants.SECURITY_TOTAL_MARGIN_RIGHT })
}
.margin({ bottom: Constants.DIALOG_MARGIN_BOTTOM })
.margin({ bottom: $r('sys.float.ohos_id_dialog_margin_bottom') })
.backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
.borderRadius(Constants.DIALOG_PRIVACY_BORDER_RADIUS)
}.width(Constants.FULL_WIDTH)