openharmony/applications_launcher
1
0
Fork 0
mirror of https://gitee.com/openharmony/applications_launcher synced 2024-11-23 06:50:02 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

bigfloder

Browse Source 
Signed-off-by: haungxiaoxiao123 <huangzhiqing3@huawei.com>
This commit is contained in:
haungxiaoxiao123 2022-05-17 11:30:05 +08:00
parent c2f52495fe
commit 782996345d
15 changed files with 289 additions and 168 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
common/src/main/ets/default/constants/PresetStyleConstants.ts
View File

@ -63,7 +63,7 @@ export default class PresetStyleConstants {
/**
* padding top of icon
*/
static readonly DEFAULT_ICON_PADDING_TOP = 0;
static readonly DEFAULT_ICON_PADDING_TOP = 13;
/**
* padding left of icon
@ -138,6 +138,16 @@ export default class PresetStyleConstants {
static readonly DEFAULT_DESKTOP_NAME_MARGIN = 3;
//----------- desktop folder-----------
/**
* height of add folder dialog
*/
static readonly DEFAULT_APP_ADD_DIALOG_HEIGHT = 534;
/**
* size of add app item height
*/
static readonly DEFAULT_APP_LAYOUT_HEIGHT = 86;
/**
* folder gutter with container size
*/
@ -164,6 +174,11 @@ export default class PresetStyleConstants {
*/
static readonly DEFAULT_OPEN_FOLDER_MARGIN_TOP = 188;
/**
* open folder swiper height
*/
static readonly DEFAULT_OPEN_FOLDER_SWIPER_HEIGHT= 480;
//----------- folder add list ------------------
/**
* max height of container

15
common/src/main/ets/default/layoutconfig/LauncherLayoutStyleConfig.ts
View File

@ -119,11 +119,26 @@ export default class LauncherLayoutStyleConfig extends ILayoutConfig {
*/
mFolderAddMaxHeight: number = PresetStyleConstants.DEFAULT_FOLDER_ADD_MAX_HEIGHT;
/**
* height of add folder dialog
*/
mAddFolderDialogHeight: number = PresetStyleConstants.DEFAULT_APP_ADD_DIALOG_HEIGHT;
/**
* toggle size of add app
*/
mFolderToggleSize: number = PresetStyleConstants.DEFAULT_APP_GRID_TOGGLE_SIZE;
/**
* padding size of add app icon
*/
mAddFolderIconPaddingTop: number = PresetStyleConstants.DEFAULT_ICON_PADDING_TOP;
/**
* size of add app icon
*/
mAddFolderIconSize: number = PresetStyleConstants.DEFAULT_DOCK_ICON_SIZE;
/**
* name lines of add app
*/

4
common/src/main/ets/default/uicomponents/FolderComponent.ets
View File

@ -251,8 +251,8 @@ export default struct FolderComponent {
.visibility(this.superposeIconVisible ? Visibility.Visible : Visibility.Hidden)
.width(StyleConstants.PERCENTAGE_100)
.height(StyleConstants.PERCENTAGE_100)
.onClick((event: ClickEvent) => {
Log.showInfo(TAG, `last item onClick`);
.onTouch((event: TouchEvent) => {
Log.showInfo(TAG, `last item onTouch`);
this.showAnimate(1.5, 0, true);
if (this.onOpenFolderClick) {
this.folderAnimateData.folderId = this.mFolderItem.folderId;

7
common/src/main/ets/default/viewmodel/LayoutViewModel.ts
View File

@ -324,6 +324,7 @@ export default class LayoutViewModel {
let maxHeight: number = this.mLauncherLayoutStyleConfig.mFolderAddMaxHeight *
(this.mScreenHeight - this.mSysUITopHeight);
let toggleSize: number = this.mLauncherLayoutStyleConfig.mFolderToggleSize;
let iconPaddingTop: number = this.mLauncherLayoutStyleConfig.mAddFolderIconPaddingTop;
let screenColumns: number = PresetStyleConstants.DEFAULT_PHONE_GRID_APP_COLUMNS;
let textSize: number = this.mLauncherLayoutStyleConfig.mFolderAddTextSize;
let textLines: number = this.mLauncherLayoutStyleConfig.mFolderAddTextLines;
@ -341,11 +342,9 @@ export default class LayoutViewModel {
let gridSize = layoutWidth - 2 * margin;
let itemSize = (gridSize - (column - 1) * gap) / column;
Log.showInfo(TAG, `desktopIcon add app itemSize ${itemSize}`);
let layoutHeight = layoutWidth + StyleConstants.DEFAULT_APP_ADD_TITLE_SIZE +
StyleConstants.DEFAULT_BUTTON_HEIGHT_NUMBER +
StyleConstants.DEFAULT_DIALOG_BOTTOM_MARGIN_NUMBER;
let layoutHeight: number = this.mLauncherLayoutStyleConfig.mAddFolderDialogHeight;
Log.showInfo(TAG, `desktopIcon add app layoutHeight ${layoutHeight}`);
let iconSize = (1 - 2 * ratio) * itemSize - linesHeight - this.mDesktopIconNameMargin;
let iconSize: number = this.mLauncherLayoutStyleConfig.mAddFolderIconSize;
Log.showInfo(TAG, `desktopIcon add app iconSize ${iconSize}`);
Log.showInfo(TAG, `desktopIcon add app maxHeight ${maxHeight}`);

7
feature/bigfolder/src/main/ets/default/common/BigFolderStyleConfig.ts
View File

@ -89,7 +89,7 @@ export default class BigFolderStyleConfig extends AppListStyleConfig {
/**
* open folder swiper height
*/
mOpenFolderSwiperHeight = StyleConstants.DEFAULT_OPEN_FOLDER_SWIPER_HEIGHT;
mOpenFolderSwiperHeight = PresetStyleConstants.DEFAULT_OPEN_FOLDER_SWIPER_HEIGHT;
/**
* open folder grid gap
@ -170,6 +170,11 @@ export default class BigFolderStyleConfig extends AppListStyleConfig {
*/
mAddFolderItemSize: number = PresetStyleConstants.DEFAULT_APP_LAYOUT_SIZE;
/**
* size of add app item height
*/
mAddFolderItemHeight: number = PresetStyleConstants.DEFAULT_APP_LAYOUT_HEIGHT;
/**
* padding top of add app icon
*/

12
feature/bigfolder/src/main/ets/default/common/constants/FolderStyleConstants.ts
View File

@ -19,6 +19,7 @@ export default class FolderStyleConstants {
static readonly DEFAULT_ICON: any = $r('app.media.icon');
static readonly DEFAULT_BACKGROUND_IMAGE = '$media:ic_wallpaper_folder';
static readonly DEFAULT_ADD_FOLDER_APP_IMAGE = '/common/pics/ic_public_add.svg';
static readonly DEFAULT_CANCEL_APP_IMAGE = '/common/pics/ic_public_cancel.svg';
// font style resources
static readonly DEFAULT_FONT_COLOR = '#ffffff';
@ -36,24 +37,30 @@ export default class FolderStyleConstants {
static readonly DEFAULT_APP_ITEM_HEIGHT = 95;
static readonly DEFAULT_APP_ICON_SIZE_WIDTH = 70;
static readonly DEFAULT_APP_NAME_HEIGHT = 25;
static readonly DEFAULT_ADD_APP_ICON_SIZE = 50;
static readonly DEFAULT_ADD_APP_ICON_SIZE = 28;
static readonly DEFAULT_ADD_APP_SIZE = 54;
static readonly DEFAULT_VP_30 = 30;
static readonly DEFAULT_OPEN_FOLDER_NAME_SIZE = 30;
static readonly DEFAULT_OPEN_FOLDER_TITLE_HEIGHT = 130;
// Folder add app grid list
static readonly DEFAULT_OPEN_FOLDER_TEXTAREA_HEIGHT = 48;
static readonly DEFAULT_OPEN_FOLDER_CANCEL_SIZE = 24;
static readonly DEFAULT_OPEN_FOLDER_TITLE_TOP = 90;
static readonly DEFAULT_OPEN_FOLDER_CANCEL_WIDTH = '85%';
static readonly DEFAULT_OPEN_FOLDER_CANCEL_HEIGHT = '40%';
static readonly DEFAULT_FOLDER_APP_DIALOG_LIST = 536;
static readonly DEFAULT_FOLDER_APP_GRID_LIST = 424;
static readonly DEFAULT_FOLDER_APP_GRID_MARGIN = 10;
static readonly DEFAULT_APP_GRID_TOGGLE_SIZE = 30;
static readonly DEFAULT_APP_GRID_TOGGLE_MARGIN = -30;
static readonly DEFAULT_APP_TITLE_MARGIN = 5;
static readonly DEFAULT_APP_TITLE_MARGIN = 13;
static readonly DEFAULT_APP_ADD_TEXT_MARGIN = 14;
static readonly DEFAULT_APP_ADD_TEXT_BOTTOM_MARGIN = 20;
static readonly DEFAULT_APP_ADD_WIDTH = '70%';
static readonly DEFAULT_APP_GRID_LIST_WIDTH = 360;
static readonly DEFAULT_APP_GRID_TEXT_FONT_SIZE = 20;
static readonly DEFAULT_APP_GRID_TEXT_FONT_WEIGHT = 600;
static readonly DEFAULT_APP_GRID_BUTTON_SIZE = 60;
static readonly DEFAULT_APP_GRID_RADIUS = 24;
static readonly DEFAULT_APP_ADD_TITLE_SIZE = 56;
@ -61,5 +68,6 @@ export default class FolderStyleConstants {
static readonly DEFAULT_APP_ADD_DIALOG_HEIGHT = 536;
static readonly DEFAULT_BUTTON_HEIGHT = 40;
static readonly DEFAULT_BUTTON_WIDTH = 100;
static readonly DEFAULT_DIALOG_OPACITY = 0.95;
static readonly DEFAULT_DIALOG_BOTTOM_MARGIN = 16;
}

232
feature/bigfolder/src/main/ets/default/common/uicomponents/FolderAppListDialog.ets
View File

@ -78,122 +78,124 @@ export default struct FolderAppListDialog {
}
build() {
Flex({direction: FlexDirection.Column, justifyContent: FlexAlign.End}) {
TitleDescriptionComponent({
mTitleDescription: $titleDescription,
mTextSize: this.mFolderStyleConfig.mAddFolderTitleSize})
Column() {
Grid() {
ForEach(this.allAppInfoList, (item) => {
GridItem() {
Stack() {
Column() {
AppBubble({
iconSize: this.mFolderStyleConfig.mAddFolderIconSize,
nameSize: this.mFolderStyleConfig.mAddFolderTextSize,
nameFontColor: this.mNameFontColor,
nameHeight: this.mFolderStyleConfig.mAddFolderTextLines,
appName: item.appName,
bundleName: item.bundleName,
appIconId: item.appIconId,
appLabelId: item.appLabelId,
isSelect:false,
badgeNumber: CommonConstants.BADGE_DISPLAY_HIDE,
nameLines: this.mFolderStyleConfig.mAddFolderTextLines,
mPaddingTop: this.mFolderStyleConfig.mAddFolderIconPaddingTop,
mIconNameMargin: this.mFolderStyleConfig.mIconNameMargin
})
}
Toggle({ type: ToggleType.Checkbox, isOn: item.checked })
.width(this.mFolderStyleConfig.mFolderToggleSize)
.height(this.mFolderStyleConfig.mFolderToggleSize)
.position({x:-this.mFolderStyleConfig.mFolderToggleSize + this.mFolderStyleConfig.mAddFolderIconMarginHorizontal,
y:-this.mFolderStyleConfig.mFolderToggleSize/2})
.onChange((isOn: boolean) => {
Log.showInfo(TAG, `Toggle onChange this.isOn: ${isOn}`);
if (isOn) {
item.checked = true;
let appItem: any;
appItem = item;
appItem.area = [1, 1];
appItem.type = CommonConstants.TYPE_APP;
this.appListChecked.push(appItem);
} else {
item.checked = false;
let index = this.appListChecked.indexOf(item);
this.appListChecked.splice(index, 1);
Column(){
Flex({direction: FlexDirection.Column, justifyContent: FlexAlign.End}) {
TitleDescriptionComponent({
mTitleDescription: $titleDescription,
mTextSize: this.mFolderStyleConfig.mAddFolderTitleSize})
Column() {
Grid() {
ForEach(this.allAppInfoList, (item) => {
GridItem() {
Stack() {
Column() {
AppBubble({
iconSize:this.mFolderStyleConfig.mAddFolderIconSize,
nameSize: this.mFolderStyleConfig.mAddFolderTextSize,
nameFontColor: this.mNameFontColor,
nameHeight: this.mFolderStyleConfig.mAddFolderTextLines,
appName: item.appName,
bundleName: item.bundleName,
appIconId: item.appIconId,
appLabelId: item.appLabelId,
isSelect:false,
badgeNumber: CommonConstants.BADGE_DISPLAY_HIDE,
nameLines: this.mFolderStyleConfig.mAddFolderTextLines,
mPaddingTop: this.mFolderStyleConfig.mAddFolderIconPaddingTop,
mIconNameMargin: this.mFolderStyleConfig.mIconNameMargin
})
}
AppStorage.SetOrCreate('appListChecked', this.appListChecked);
})
}
}
.width(this.mFolderStyleConfig.mAddFolderItemSize)
.height(this.mFolderStyleConfig.mAddFolderItemSize)
}, (item) => JSON.stringify(item))
}
.columnsTemplate(this.getColumnsTemplate())
.columnsGap(this.mFolderStyleConfig.mAddFolderGridGap)
.rowsGap(this.mFolderStyleConfig.mAddFolderGridGap)
.margin( this.mFolderStyleConfig.mAddFolderGridMargin )
}
.width(this.mFolderStyleConfig.mAddFolderDialogWidth)
.height(this.mGridHeight)
Flex({ justifyContent: FlexAlign.SpaceAround }) {
Button() {
Text($r('app.string.cancel_dialog'))
.fontSize(this.mFolderStyleConfig.mAddFolderButtonSize)
.fontColor(CommonStyleConstants.BUTTON_FONT_COLOR)
}
.flexGrow(1)
.backgroundColor(CommonStyleConstants.DEFAULT_BG_COLOR)
.width(FolderStyleConstants.DEFAULT_BUTTON_WIDTH)
.height(FolderStyleConstants.DEFAULT_BUTTON_HEIGHT)
.onClick(() => {
this.controller.close();
this.cancel()
})
Divider()
.vertical(true)
.color(CommonStyleConstants.DEFAULT_DIVIDER_COLOR)
.height(FolderStyleConstants.DEFAULT_BUTTON_HEIGHT)
Button() {
Text($r('app.string.confirm_dialog'))
.fontSize(this.mFolderStyleConfig.mAddFolderButtonSize)
.fontColor(CommonStyleConstants.BUTTON_FONT_COLOR)
}
.flexGrow(1)
.backgroundColor(CommonStyleConstants.DEFAULT_BG_COLOR)
.height(FolderStyleConstants.DEFAULT_BUTTON_HEIGHT)
.width(FolderStyleConstants.DEFAULT_BUTTON_WIDTH)
.onClick(() => {
Log.showInfo(TAG, `Dialog confirm start`);
folderViewModel.updateFolderAppList(this.appListChecked, this.folderItem);
let isDestory = false;
if (this.folderItem.layoutInfo[0].length < 2) {
isDestory = true;
} else {
folderViewModel.refreshFolder(this.folderItem);
Toggle({ type: ToggleType.Checkbox, isOn: item.checked })
.width(this.mFolderStyleConfig.mFolderToggleSize)
.height(this.mFolderStyleConfig.mFolderToggleSize)
.position({x:-this.mFolderStyleConfig.mFolderToggleSize + this.mFolderStyleConfig.mAddFolderIconMarginHorizontal,
y:-this.mFolderStyleConfig.mFolderToggleSize/2})
.selectedColor(0x007DFF)
.onChange((isOn: boolean) => {
Log.showInfo(TAG, `Toggle onChange this.isOn: ${isOn}`);
if (isOn) {
let appItem: any;
appItem = item;
appItem.area = [1,1];
appItem.type = CommonConstants.TYPE_APP;
this.appListChecked.push(appItem);
} else {
let index = this.appListChecked.indexOf(item);
this.appListChecked.splice(index, 1);
}
AppStorage.SetOrCreate('appListChecked', this.appListChecked);
})
}
}.width(this.mFolderStyleConfig.mAddFolderItemSize)
.height(this.mFolderStyleConfig.mAddFolderItemHeight)
}, (item) => JSON.stringify(item))
}
this.controller.close();
this.confirm(isDestory);
Log.showInfo(TAG, `Dialog confirm end`);
})
.columnsTemplate(this.getColumnsTemplate())
.columnsGap(this.mFolderStyleConfig.mAddFolderGridGap)
.rowsGap(this.mFolderStyleConfig.mAddFolderGridGap)
.margin(this.mFolderStyleConfig.mAddFolderGridMargin)
}
Flex({ justifyContent: FlexAlign.SpaceAround }) {
Button() {
Text($r('app.string.cancel_dialog'))
.fontSize(this.mFolderStyleConfig.mAddFolderButtonSize)
.fontColor(CommonStyleConstants.BUTTON_FONT_COLOR)
}
.flexGrow(1)
.backgroundColor(CommonStyleConstants.DEFAULT_BG_COLOR)
.width(FolderStyleConstants.DEFAULT_BUTTON_WIDTH)
.height(FolderStyleConstants.DEFAULT_BUTTON_HEIGHT)
.onClick(() => {
this.controller.close();
this.cancel()
})
Divider()
.vertical(true)
.color(CommonStyleConstants.DEFAULT_DIVIDER_COLOR)
.height(FolderStyleConstants.DEFAULT_APP_GRID_TEXT_FONT_SIZE)
Button() {
Text($r('app.string.confirm_dialog'))
.fontSize(this.isPad?this.mFolderStyleConfig.mAddFolderButtonSize:16)
.fontColor(CommonStyleConstants.BUTTON_FONT_COLOR)
}
.flexGrow(1)
.backgroundColor(CommonStyleConstants.DEFAULT_BG_COLOR)
.height(FolderStyleConstants.DEFAULT_BUTTON_HEIGHT)
.width(FolderStyleConstants.DEFAULT_BUTTON_WIDTH)
.onClick(() => {
Log.showInfo(TAG, `Dialog confirm start`);
folderViewModel.updateFolderAppList(this.appListChecked, this.folderItem);
let isDestory = false;
if (this.folderItem.layoutInfo[0].length < 2) {
isDestory = true;
} else {
folderViewModel.refreshFolder(this.folderItem);
}
this.controller.close();
this.confirm(isDestory);
Log.showInfo(TAG, `Dialog confirm end`);
})
}
}
}
.backgroundColor(Color.White)
.padding({
bottom: FolderStyleConstants.DEFAULT_DIALOG_BOTTOM_MARGIN
})
.border({
radius: CommonStyleConstants.DEFAULT_DIALOG_RADIUS
})
.margin({
bottom: FolderStyleConstants.DEFAULT_DIALOG_BOTTOM_MARGIN
})
.width(this.mFolderStyleConfig.mAddFolderDialogWidth)
.height(this.mDialogHeight)
.backgroundColor(Color.White)
.opacity(FolderStyleConstants.DEFAULT_DIALOG_OPACITY)
.padding({
bottom: FolderStyleConstants.DEFAULT_DIALOG_BOTTOM_MARGIN
})
.border({
radius: CommonStyleConstants.DEFAULT_DIALOG_RADIUS
})
.margin({
bottom: FolderStyleConstants.DEFAULT_DIALOG_BOTTOM_MARGIN
})
.width(this.mFolderStyleConfig.mAddFolderDialogWidth)
.height(this.mFolderStyleConfig.mAddFolderDialogHeight)
if (this.navigationBarStatusValue){}else{
Stack().width(this.mFolderStyleConfig.mAddFolderDialogWidth).height(FolderStyleConstants.DEFAULT_APP_GRID_TOGGLE_SIZE)
}
}.width('100%').height('100%').justifyContent(this.isPad?FlexAlign.Center:FlexAlign.End)
}
}
}

4
feature/bigfolder/src/main/ets/default/common/uicomponents/TitleDescriptionComponent.ets
View File

@ -19,10 +19,12 @@ import FolderStyleConstants from '../constants/FolderStyleConstants';
export default struct TitleDescriptionComponent {
@Link mTitleDescription: any;
@State mTextSize: number = FolderStyleConstants.DEFAULT_APP_GRID_TEXT_FONT_SIZE;
@StorageLink('isPad') isPad: boolean = true;
build() {
Text(this.mTitleDescription)
.fontSize(this.mTextSize)
.fontSize(this.isPad?this.mTextSize:FolderStyleConstants.DEFAULT_APP_GRID_TEXT_FONT_PHONE_SIZE)
.fontWeight(FolderStyleConstants.DEFAULT_APP_GRID_TEXT_FONT_WEIGHT)
.margin({
top: FolderStyleConstants.DEFAULT_APP_TITLE_MARGIN,
bottom: FolderStyleConstants.DEFAULT_APP_TITLE_MARGIN,

56
feature/bigfolder/src/main/ets/default/view/FolderOpenComponent.ets
View File

@ -63,7 +63,7 @@ let isPad = false;
@Component
export default struct FolderOpenComponent {
@State withBlur: boolean = true;
// @StorageLink('isDraging') isDraging: boolean = false;
@StorageLink('isDraging') isDraging: boolean = false;
@State @Watch('showStateChange') showState: boolean = false;
@StorageLink('openFolderPageIndex') PageIndex: number = 0;
@StorageLink('openFolderStatus') @Watch('updateFolderData') openFolderStatus: number = FeatureConstants.OPEN_FOLDER_STATUS_CLOSE;
@ -188,9 +188,14 @@ export default struct FolderOpenComponent {
Log.showInfo(TAG, 'title click');
this.isRenaming = true;
})
TextInput({ placeholder: this.mFolderInfo.folderName, text: this.newFolderName })
.maxLength(CommonConstants.FOLDER_NAME_MAX_LENGTH)
TextArea({ placeholder: this.mFolderInfo.folderName, text: this.newFolderName })
.height(FolderStyleConstants.DEFAULT_OPEN_FOLDER_TEXTAREA_HEIGHT)
.textAlign(TextAlign.Center)
.fontColor(Color.White)
.fontSize(FolderStyleConstants.DEFAULT_OPEN_FOLDER_NAME_SIZE)
.fontWeight(FontWeight.Normal)
.fontFamily("sans-serif")
.fontStyle(FontStyle.Normal)
.placeholderColor(Color.White)
.caretColor(Color.White)
.placeholderFont({
@ -198,25 +203,36 @@ export default struct FolderOpenComponent {
weight: FontWeight.Normal,
family: "sans-serif"
})
.backgroundColor('rgba(255,255,255,0.3)')
.clip(new Rect({
width:FolderStyleConstants.PERCENTAGE_100,
height:FolderStyleConstants.DEFAULT_OPEN_FOLDER_TEXTAREA_HEIGHT,
radius:[[FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE,FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE],
[FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE,FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE],
[FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE,FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE],
[FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE,FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE]]}))
.width(FolderStyleConstants.PERCENTAGE_100)
.visibility(this.isRenaming ? Visibility.Visible : Visibility.Hidden)
.enterKeyType(EnterKeyType.Done)
.border({
width: 1,
color: Color.White,
radius: 10,
style: BorderStyle.Solid
})
.onSubmit((enterKey: EnterKeyType) => {
Log.showInfo(TAG, `textinput done: ${enterKey}`);
.onBlur(()=> {
this.isRenaming = true;
this.saveText();
})
.onChange((text: string) => {
Log.showInfo(TAG, `textinput: ` + text);
this.newFolderName = text;
this.newFolderName = text;
})
Image(FolderStyleConstants.DEFAULT_CANCEL_APP_IMAGE)
.width(FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE)
.height(FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_SIZE)
.position({ x: FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_WIDTH,
y: FolderStyleConstants.DEFAULT_OPEN_FOLDER_CANCEL_HEIGHT})
.visibility(this.isRenaming ? Visibility.Visible : Visibility.Hidden)
.onClick(()=>{
this.mFolderInfo.folderName = ''
this.newFolderName = ''
})
}
.margin({ top: FolderStyleConstants.DEFAULT_OPEN_FOLDER_TITLE_TOP })
.width(mGridWidth)
.height(mGridMarginTop)
@ -418,7 +434,7 @@ struct FolderSwiperPage {
@Component
struct FolderAppItem {
@StorageLink('uninstallAppInfo') appInfo: any = {};
// @StorageLink('dragLocation') @Watch('onTouchEventUpdate') dragLocation: string = '';
@StorageLink('dragLocation') @Watch('onTouchEventUpdate') dragLocation: string = '';
@State @Watch('onIsDraging') isDraging: boolean = false;
@StorageLink('selectDesktopAppItem') selectDesktopAppItem: string = '';
@State item: any = {};
@ -632,12 +648,12 @@ struct FolderAppItem {
})
)
)
// .onTouch((event: TouchEvent) => {
// Log.showInfo(TAG, `onTouch`);
// AppStorage.SetOrCreate('dragFocus', FeatureConstants.FEATURE_NAME);
// mBigFolderDragHandler.setDragStateListener(this.mDragStateListener);
// mBigFolderDragHandler.notifyTouchEventUpdate(event);
// })
.onTouch((event: TouchEvent) => {
Log.showInfo(TAG, `onTouch`);
AppStorage.SetOrCreate('dragFocus', FeatureConstants.FEATURE_NAME);
mBigFolderDragHandler.setDragStateListener(this.mDragStateListener);
mBigFolderDragHandler.notifyTouchEventUpdate(event);
})
}
.width(mAppItemWidth)
.height(mAppItemWidth)

7
feature/form/src/main/ets/default/view/FormManagerComponent.ets
View File

@ -175,10 +175,11 @@ export default struct FormManagerComponent {
}
}
.height('80%')
}
}.width('100%')
}, (dimensionItem) => JSON.stringify(dimensionItem))
}, (formItem) => JSON.stringify(formItem))
}
.width('100%')
.height('100%')
.loop(false)
.index(0)
@ -188,7 +189,7 @@ export default struct FormManagerComponent {
.onChange((index: number) => {
this.mSwiperIndex = index;
})
}
}.alignItems(HorizontalAlign.Center)
.height('60%')
Blank()
Button({type: ButtonType.Capsule}) {
@ -215,4 +216,4 @@ export default struct FormManagerComponent {
.width(StyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
.backgroundImage(StyleConstants.DEFAULT_FORM_MGR_BACKGROUND_IMAGE)
}
}
}

2
product/pad/src/main/ets/common/constants/PadPresentConstants.ts
View File

@ -91,7 +91,7 @@ export default class PadPresetStyleConstants {
/**
* margin top of open folder
*/
static readonly DEFAULT_OPEN_FOLDER_MARGIN_TOP = 166;
static readonly DEFAULT_OPEN_FOLDER_MARGIN_TOP = 120;
//----------- folder add list ------------------
/**

13
product/pad/src/main/ets/common/pics/ic_public_cancel.svg Normal file
View File

@ -0,0 +1,13 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24" version="1.1">
<title>Public/ic_public_cancel</title>
<defs>
<path d="M19.7781746,4.22182541 C20.0710678,4.51471863 20.0710678,4.98959236 19.7781746,5.28248558 L5.28248558,19.7781746 C4.98959236,20.0710678 4.51471863,20.0710678 4.22182541,19.7781746 C3.92893219,19.4852814 3.92893219,19.0104076 4.22182541,18.7175144 L10.9395166,11.9994697 L4.22182541,5.28248558 C3.92893219,4.98959236 3.92893219,4.51471863 4.22182541,4.22182541 C4.51471863,3.92893219 4.98959236,3.92893219 5.28248558,4.22182541 L12,10.9389863 L18.7175144,4.22182541 C19.0104076,3.92893219 19.4852814,3.92893219 19.7781746,4.22182541 Z M19.7781746,18.7175144 C20.0710678,19.0104076 20.0710678,19.4852814 19.7781746,19.7781746 C19.4852814,20.0710678 19.0104076,20.0710678 18.7175144,19.7781746 L12.7072836,13.7675902 L13.767767,12.7071068 L19.7781746,18.7175144 Z" id="_path-1"/>
</defs>
<g id="_Public/ic_public_cancel" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<mask id="_mask-2" fill="white">
<use xlink:href="#_path-1"/>
</mask>
<use id="_形状" fill="#FFFFFF" xlink:href="#_path-1"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

16
product/phone/src/main/ets/common/PhoneLauncherLayoutStyleConfig.ts
View File

@ -129,6 +129,11 @@ export default class PhoneLauncherLayoutStyleConfig extends LauncherLayoutStyleC
*/
mFolderToggleSize: number = PhonePresetStyleConstants.DEFAULT_APP_GRID_TOGGLE_SIZE;
/**
* padding size of add app icon
*/
mAddFolderIconPaddingTop: number = PhonePresetStyleConstants.DEFAULT_ICON_PADDING_TOP;
/**
* name lines of add app
*/
@ -231,6 +236,17 @@ export default class PhoneLauncherLayoutStyleConfig extends LauncherLayoutStyleC
*/
mOpenFolderSwiperHeight: number = PhonePresetStyleConstants.DEFAULT_OPEN_FOLDER_SWIPER_HEIGHT;
/**
* icon size of dock
*/
mAddFolderIconSize: number = PhonePresetStyleConstants.DEFAULT_DOCK_ICON_SIZE;
/**
* height of add folder dialog
*/
mAddFolderDialogHeight: number = PhonePresetStyleConstants.DEFAULT_APP_ADD_DIALOG_HEIGHT;
private constructor() {
super();
}

52
product/phone/src/main/ets/common/constants/PhonePresetStyleConstants.ts
View File

@ -28,23 +28,23 @@ export default class PhonePresetStyleConstants {
/**
* desktop item size
*/
static readonly DEFAULT_APP_LAYOUT_SIZE = 120;
static readonly DEFAULT_APP_LAYOUT_SIZE = 80;
/**
* desktop container margin
*/
static readonly DEFAULT_LAYOUT_MARGIN = 19.5;
static readonly DEFAULT_LAYOUT_MARGIN = 12;
/**
* desktop container minimum gutter
*/
static readonly DEFAULT_APP_LAYOUT_MIN_GUTTER = 7;
static readonly DEFAULT_APP_LAYOUT_MIN_GUTTER = 5;
//----------- desktop icon-------------
/**
* desktop item padding top
*/
static readonly DEFAULT_APP_TOP_RATIO = 0.01;
static readonly DEFAULT_APP_TOP_RATIO = 0.0375;
/**
* desktop item name lines
@ -54,17 +54,17 @@ export default class PhonePresetStyleConstants {
/**
* desktop item name size
*/
static readonly DEFAULT_APP_NAME_TEXT_SIZE = 18;
static readonly DEFAULT_APP_NAME_TEXT_SIZE = 12;
/**
* desktop item icon and name gap
*/
static readonly DEFAULT_ICON_NAME_GAP = 6;
static readonly DEFAULT_ICON_NAME_GAP = 4;
/**
* desktop icon name height
*/
static readonly DEFAULT_DESKTOP_NAME_HEIGHT = 24;
static readonly DEFAULT_DESKTOP_NAME_HEIGHT = 16;
//----------- desktop folder-----------
/**
@ -72,12 +72,22 @@ export default class PhonePresetStyleConstants {
*/
static readonly DEFAULT_FOLDER_GUTTER_RATIO = 0.043;
/**
* icon size
*/
static readonly DEFAULT_ICON_SIZE = 54;
/**
* folder padding with container size
*/
static readonly DEFAULT_FOLDER_PADDING_RATIO = 0.07;
//----------- desktop open --------------
/**
* height of add folder dialog
*/
static readonly DEFAULT_APP_ADD_DIALOG_HEIGHT = 524;
/**
* gutter of open folder
*/
@ -91,7 +101,7 @@ export default class PhonePresetStyleConstants {
/**
* margin top of open folder
*/
static readonly DEFAULT_OPEN_FOLDER_MARGIN_TOP = 214;
static readonly DEFAULT_OPEN_FOLDER_MARGIN_TOP = 100;
//----------- folder add list ------------------
/**
@ -104,6 +114,12 @@ export default class PhonePresetStyleConstants {
*/
static readonly DEFAULT_FOLDER_ADD_MARGIN = 18;
/**
* padding top of icon
*/
static readonly DEFAULT_ICON_PADDING_TOP = 13;
/**
* gutter of container
*/
@ -112,7 +128,7 @@ export default class PhonePresetStyleConstants {
/**
* toggle of item
*/
static readonly DEFAULT_APP_GRID_TOGGLE_SIZE = 24;
static readonly DEFAULT_APP_GRID_TOGGLE_SIZE = 20;
/**
* icon padding of item with item size
@ -122,7 +138,7 @@ export default class PhonePresetStyleConstants {
/**
* name size of container
*/
static readonly DEFAULT_FOLDER_ADD_GRID_TEXT_SIZE = 18;
static readonly DEFAULT_FOLDER_ADD_GRID_TEXT_SIZE = 12;
/**
* title size of container
@ -137,7 +153,7 @@ export default class PhonePresetStyleConstants {
/**
* button size of container
*/
static readonly DEFAULT_FOLDER_ADD_BUTTON_SIZE = 24;
static readonly DEFAULT_FOLDER_ADD_BUTTON_SIZE = 16;
//----------- app center--------------
/**
@ -174,17 +190,17 @@ export default class PhonePresetStyleConstants {
/**
* icon size of dock
*/
static readonly DEFAULT_DOCK_ICON_SIZE = 75;
static readonly DEFAULT_DOCK_ICON_SIZE = 54;
/**
* padding of dock
*/
static readonly DEFAULT_DOCK_PADDING = 21;
static readonly DEFAULT_DOCK_PADDING = 12;
/**
* gap of dock container
*/
static readonly DEFAULT_DOCK_ITEM_GAP = 55;
static readonly DEFAULT_DOCK_ITEM_GAP = 31.33;
/**
* gap with resident and recent
@ -194,17 +210,17 @@ export default class PhonePresetStyleConstants {
/**
* save margin of dock
*/
static readonly DEFAULT_DOCK_SAVE_MARGIN = 16;
static readonly DEFAULT_DOCK_SAVE_MARGIN = 10;
/**
* margin bottom of dock
*/
static readonly DEFAULT_DOCK_MARGIN_BOTTOM = 72;
static readonly DEFAULT_DOCK_MARGIN_BOTTOM = 9;
/**
* margin bottom of dock(Immersive navigation bar)
*/
static readonly DEFAULT_DOCK_MARGIN_BOTTOM_HIDE_BAR = 20;
static readonly DEFAULT_DOCK_MARGIN_BOTTOM_HIDE_BAR = 18;
/**
* open folder grid height
@ -214,5 +230,5 @@ export default class PhonePresetStyleConstants {
/**
* open folder swiper height
*/
static readonly DEFAULT_OPEN_FOLDER_SWIPER_HEIGHT= 650;
static readonly DEFAULT_OPEN_FOLDER_SWIPER_HEIGHT= 445;
}

13
product/phone/src/main/ets/common/pics/ic_public_cancel.svg Normal file
View File

@ -0,0 +1,13 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24" version="1.1">
<title>Public/ic_public_cancel</title>
<defs>
<path d="M19.7781746,4.22182541 C20.0710678,4.51471863 20.0710678,4.98959236 19.7781746,5.28248558 L5.28248558,19.7781746 C4.98959236,20.0710678 4.51471863,20.0710678 4.22182541,19.7781746 C3.92893219,19.4852814 3.92893219,19.0104076 4.22182541,18.7175144 L10.9395166,11.9994697 L4.22182541,5.28248558 C3.92893219,4.98959236 3.92893219,4.51471863 4.22182541,4.22182541 C4.51471863,3.92893219 4.98959236,3.92893219 5.28248558,4.22182541 L12,10.9389863 L18.7175144,4.22182541 C19.0104076,3.92893219 19.4852814,3.92893219 19.7781746,4.22182541 Z M19.7781746,18.7175144 C20.0710678,19.0104076 20.0710678,19.4852814 19.7781746,19.7781746 C19.4852814,20.0710678 19.0104076,20.0710678 18.7175144,19.7781746 L12.7072836,13.7675902 L13.767767,12.7071068 L19.7781746,18.7175144 Z" id="_path-1"/>
</defs>
<g id="_Public/ic_public_cancel" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<mask id="_mask-2" fill="white">
<use xlink:href="#_path-1"/>
</mask>
<use id="_形状" fill="#FFFFFF" xlink:href="#_path-1"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB