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

!127 横竖屏适配：大文件夹&卡片修改

Browse Source 
Merge pull request !127 from haungxiaoxiao123/master
This commit is contained in:
openharmony_ci 2022-05-21 03:48:07 +00:00 committed by Gitee
commit a069bd0399
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
18 changed files with 258 additions and 156 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -164,6 +164,11 @@ export default class PresetStyleConstants {
*/
static readonly DEFAULT_OPEN_FOLDER_MARGIN_TOP = 188;
/**
* margin top of open folder
*/
static readonly DEFAULT_OPEN_FOLDER_TITLE_TOP = 40;
//----------- folder add list ------------------
/**
* max height of container

1
common/src/main/ets/default/constants/StyleConstants.ts
View File

@ -52,6 +52,7 @@ export default class StyleConstants {
static readonly DEFAULT_OPEN_FOLDER_SWIPER_HEIGHT= 480;
static readonly DEFAULT_OPEN_FOLDER_GRID_GAP= 6;
static readonly DEFAULT_OPEN_FOLDER_TITLE_HEIGHT = 130;
static readonly DEFAULT_OPEN_FOLDER_TITLE_TOP = 130;
static readonly DEFAULT_APP_ADD_TITLE_SIZE = 56;
static readonly DEFAULT_DIALOG_BOTTOM_MARGIN_NUMBER = 16;
static readonly DEFAULT_BUTTON_HEIGHT_NUMBER = 40;

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

@ -104,6 +104,11 @@ export default class LauncherLayoutStyleConfig extends ILayoutConfig {
*/
mFolderOpenMargin: number = PresetStyleConstants.DEFAULT_OPEN_FOLDER_MARGIN_TOP;
/**
* margin top of open folder
*/
mFolderOpenTitle: number = PresetStyleConstants.DEFAULT_OPEN_FOLDER_TITLE_TOP;
/**
* gutter of add app
*/

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

@ -289,6 +289,7 @@ export default class LayoutViewModel {
let gutter = this.mLauncherLayoutStyleConfig.mFolderOpenGutter;
let padding = this.mLauncherLayoutStyleConfig.mFolderOpenPADDING;
let margin = this.mLauncherLayoutStyleConfig.mFolderOpenMargin;
let title = this.mLauncherLayoutStyleConfig.mFolderOpenTitle;
let itemSize = this.mDesktopItemSize;
let layoutWidth = column * itemSize + (column - 1) * gutter + 2 * padding;
let layoutHeight = row * itemSize + (row - 1) * gutter + 2 * padding;
@ -305,6 +306,7 @@ export default class LayoutViewModel {
mOpenFolderGridGap: gutter,
mOpenFolderGridPadding: padding,
mFolderOpenMargin: margin,
mFolderOpenTitle: title,
mOpenFolderGridIconTopPadding: this.mDesktopIconMarginTop
};
return result;

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

@ -50,6 +50,7 @@ export default class BigFolderStyleConfig extends AppListStyleConfig {
* margin of folder open
*/
mFolderOpenMargin = StyleConstants.DEFAULT_OPEN_FOLDER_TITLE_HEIGHT;
mFolderOpenTitle = StyleConstants.DEFAULT_OPEN_FOLDER_TITLE_TOP;
/**
* open folder app size
@ -232,6 +233,7 @@ export default class BigFolderStyleConfig extends AppListStyleConfig {
this.mOpenFolderGridGap = openResult.mOpenFolderGridGap;
this.mOpenFolderGridPadding = openResult.mOpenFolderGridPadding;
this.mFolderOpenMargin = openResult.mFolderOpenMargin;
this.mFolderOpenTitle = openResult.mFolderOpenTitle;
this.mOpenFolderGridIconTopPadding = openResult.mOpenFolderGridIconTopPadding;
this.mAddFolderGridWidth = addResult.mAddFolderGridWidth;

15
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,13 +37,24 @@ 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_NAVIGATION = 0;
static readonly DEFAULT_OPEN_FOLDER_PHONE_HEIGHT = 524;
static readonly DEFAULT_OPEN_FOLDER_PHONE_ICON = 85;
static readonly DEFAULT_OPEN_FOLDER_INDICATOR = 150;
static readonly DEFAULT_DIALOG_OPACITY = 0.95;
static readonly DEFAULT_OPEN_FOLDER_CANCEL_WIDTH = '85%';
static readonly DEFAULT_OPEN_FOLDER_CANCEL_HEIGHT = '40%';
static readonly DEFAULT_APP_GRID_TEXT_FONT_WEIGHT = 600;
static readonly DEFAULT_FOLDER_APP_DIALOG_LIST = 536;
static readonly DEFAULT_FOLDER_APP_GRID_LIST = 424;
static readonly DEFAULT_FOLDER_APP_GRID_MARGIN = 10;
@ -59,6 +71,7 @@ export default class FolderStyleConstants {
static readonly DEFAULT_APP_ADD_TITLE_SIZE = 56;
static readonly DEFAULT_APP_ADD_DIALOG_WIDTH = 394;
static readonly DEFAULT_APP_ADD_DIALOG_HEIGHT = 536;
static readonly DEFAULT_DIVIDER_HEIGHT = 24;
static readonly DEFAULT_BUTTON_HEIGHT = 40;
static readonly DEFAULT_BUTTON_WIDTH = 100;
static readonly DEFAULT_DIALOG_BOTTOM_MARGIN = 16;

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

@ -31,6 +31,8 @@ let folderViewModel: FolderViewModel;
@CustomDialog
export default struct FolderAppListDialog {
@StorageLink('NavigationBarStatusValue') navigationBarStatusValue: boolean = false;
@StorageLink('isPad') isPad: boolean = false;
@StorageLink('allAppListForFolder') allAppInfoList: [] = [];
@StorageLink('folderAppList') folderAppList: [] = [];
@StorageLink('appListChecked') @Watch('onAppListChecked') appListChecked: any = [];
@ -78,122 +80,128 @@ 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: FolderStyleConstants.DEFAULT_APP_TITLE_MARGIN,
mIconNameMargin: this.mFolderStyleConfig.mIconNameMargin
})
}
AppStorage.SetOrCreate('appListChecked', this.appListChecked);
})
Toggle({ type: ToggleType.Checkbox, isOn: item.checked })
.width(this.mFolderStyleConfig.mFolderToggleSize)
.height(this.mFolderStyleConfig.mFolderToggleSize)
.selectedColor(0x007DFF)
.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);
}
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);
.width(this.mFolderStyleConfig.mAddFolderItemSize)
.height(this.mFolderStyleConfig.mAddFolderItemSize)
}, (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 )
}
.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_DIVIDER_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);
}
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)
.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)
if (!this.navigationBarStatusValue){
Stack().width(this.mFolderStyleConfig.mAddFolderDialogWidth).height(FolderStyleConstants.DEFAULT_APP_GRID_TOGGLE_SIZE)
}
}.width('100%').height('100%').justifyContent(this.isPad ? FlexAlign.Center : FlexAlign.End)
}
}

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

@ -23,6 +23,7 @@ export default struct TitleDescriptionComponent {
build() {
Text(this.mTitleDescription)
.fontSize(this.mTextSize)
.fontWeight(FolderStyleConstants.DEFAULT_APP_GRID_TEXT_FONT_WEIGHT)
.margin({
top: FolderStyleConstants.DEFAULT_APP_TITLE_MARGIN,
bottom: FolderStyleConstants.DEFAULT_APP_TITLE_MARGIN,

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

@ -57,6 +57,7 @@ let mGridWidth;
let mGridHeight;
let mGridPadding;
let mGridMarginTop;
let mFolderOpenTitle;
let mGridIconTopPadding;
let isPad = false;
@ -103,6 +104,7 @@ export default struct FolderOpenComponent {
mNameLines = mBigFolderStyleConfig.mNameLines;
mIconNameMargin = mBigFolderStyleConfig.mIconNameMargin;
mGridMarginTop = mBigFolderStyleConfig.mFolderOpenMargin;
mFolderOpenTitle = mBigFolderStyleConfig.mFolderOpenTitle;
mGridIconTopPadding = mBigFolderStyleConfig.mOpenFolderGridIconTopPadding;
}
@ -188,9 +190,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 +205,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: mFolderOpenTitle })
.width(mGridWidth)
.height(mGridMarginTop)
@ -229,7 +247,8 @@ export default struct FolderOpenComponent {
}, (item) => JSON.stringify(item))
}
.indicatorStyle({
selectedColor: StyleConstants.DEFAULT_FONT_COLOR
selectedColor: StyleConstants.DEFAULT_FONT_COLOR,
bottom: FolderStyleConstants.DEFAULT_OPEN_FOLDER_INDICATOR
})
.onClick(() => {
Log.showInfo(TAG, `Swiper click`);

2
feature/form/src/main/ets/default/common/constants/StyleConstants.ts
View File

@ -60,5 +60,5 @@ export default class StyleConstants {
// the dpi of phone should be 480, but it is 320 currently.
// so all dimensions have to be multiplied by 1.5
static readonly DPI_RATIO = 1.5;
static readonly DPI_RATIO = 1;
}

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

@ -175,10 +175,10 @@ 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 +188,7 @@ export default struct FormManagerComponent {
.onChange((index: number) => {
this.mSwiperIndex = index;
})
}
}.alignItems(HorizontalAlign.Center)
.height('60%')
Blank()
Button({type: ButtonType.Capsule}) {

5
product/pad/src/main/ets/common/PadLauncherLayoutStyleConfig.ts
View File

@ -107,6 +107,11 @@ export default class PadLauncherLayoutStyleConfig extends LauncherLayoutStyleCon
*/
mFolderOpenMargin: number = PadPresetStyleConstants.DEFAULT_OPEN_FOLDER_MARGIN_TOP;
/**
* margin top of open folder
*/
mFolderOpenTitle: number = PadPresetStyleConstants.DEFAULT_OPEN_FOLDER_TITLE_TOP;
/**
* gutter of add app
*/

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

@ -93,6 +93,11 @@ export default class PadPresetStyleConstants {
*/
static readonly DEFAULT_OPEN_FOLDER_MARGIN_TOP = 166;
/**
* margin top of open folder top
*/
static readonly DEFAULT_OPEN_FOLDER_TITLE_TOP = 40;
//----------- folder add list ------------------
/**
* max height of container

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

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

@ -109,6 +109,11 @@ export default class PhoneLauncherLayoutStyleConfig extends LauncherLayoutStyleC
*/
mFolderOpenMargin: number = PhonePresetStyleConstants.DEFAULT_OPEN_FOLDER_MARGIN_TOP;
/**
* margin top of open folder
*/
mFolderOpenTitle: number = PhonePresetStyleConstants.DEFAULT_OPEN_FOLDER_TITLE_TOP;
/**
* gutter of add app
*/

12
product/phone/src/main/ets/common/PhoneSmartDockStyleConfig.ts
View File

@ -24,7 +24,7 @@ export default class PhoneSmartDockStyleConfig extends SmartDockStyleConfig {
/**
* dock list height
*/
mDockHeight = 94;
mDockHeight = 78;
/**
* dock list backgroundcolor
@ -54,27 +54,27 @@ export default class PhoneSmartDockStyleConfig extends SmartDockStyleConfig {
/**
* list item width
*/
mListItemWidth = 70;
mListItemWidth = 54;
/**
* list item height
*/
mListItemHeight = 70;
mListItemHeight = 54;
/**
* list item gap
*/
mListItemGap = 60;
mListItemGap = 33;
/**
* list icon size
*/
mIconSize = 70;
mIconSize = 54;
/**
* max display item count in dock list
*/
mMaxDockNum = 5;
mMaxDockNum = 4;
protected constructor() {
super();

43
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-----------
/**
@ -91,7 +91,12 @@ 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;
/**
* margin top of open folder
*/
static readonly DEFAULT_OPEN_FOLDER_TITLE_TOP = 90;
//----------- folder add list ------------------
/**
@ -112,22 +117,22 @@ 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
*/
static readonly DEFAULT_FOLDER_ADD_ICON_TOP_RATIO = 0.075;
static readonly DEFAULT_FOLDER_ADD_ICON_TOP_RATIO = -0.03;
/**
* 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
*/
static readonly DEFAULT_FOLDER_ADD_TITLE_TEXT_SIZE = 30;
static readonly DEFAULT_FOLDER_ADD_TITLE_TEXT_SIZE = 20;
/**
* name lines of item
@ -137,7 +142,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 +179,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 +199,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

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