# 基础开发工具包 ```shell ohpm install @szyx/sdk_base ``` ## 0.初始化 > 在UIAbility的onWindowStageCreate方法中初始化该方法 ```tsx // 初始化 import { WindowHelper } from '@szyx/sdk_base'; export default class AppAbility extends UIAbility { onWindowStageCreate(windowStage: window.WindowStage): void { windowStage.loadContent('pages/Index', (err) => { if (err.code) { hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? ''); return; } }); // 这行代码 GlobalContext.setContext(this.context) } } ``` ## 1.[utils](./src/main/ets/utils) ### 1.1.[AppStorageHelper](./src/main/ets/utils/AppStorageHelper.ets) > 缓存工具类,运行时存储,应用停止运行后清空 ```tsx import { AppStorageHelper } from '@szyx/sdk_base/Index' // 存储string数据 AppStorageHelper.save(StorageKeys.CLIENT_ID, d) // 获取存储的strign数据 let d = AppStorageHelper.get(StorageKeys.CLIENT_ID) // 删除指定存储 AppStorageHelper.delete(StorageKeys.CLIENT_ID) ``` ### 1.2.[PreferencesHelper](./src/main/ets/utils/PreferencesHelper.ets) > 永久存储类,应用停止后也不会清空 > 需要验证,更新应用会不会被清理 > 可存储类型 `number | string | boolean | Array | Array | Array | Uint8Array` ```tsx import { PreferencesHelper } from '@szyx/sdk_base/Index' // 存储数据 PreferencesHelper.put(StorageKeys.CLIENT_ID, value) // 获取存储的数据 PreferencesHelper.get(StorageKeys.CLIENT_ID).then(res => { console.log('>>>>>', res) }) // 删除存储的数据 PreferencesHelper.delete(StorageKeys.CLIENT_ID).then(() => { console.log('>>>>>') }) ``` ### 1.3.[ToolsHelper](./src/main/ets/utils/ToolsHelper.ets) > 常用方法工具栏 > 基础方法 #### 1.3.1.弹出Toast提示 ```tsx import { ToolsHelper } from '@szyx/sdk_base'; ToolsHelper.showMessage('Hello Word!') ``` #### 1.3.2.打印日志 > 打印格式:`========>${顶层调用栈}::` ```tsx import { ToolsHelper } from '@szyx/sdk_base'; ToolsHelper.log('Hello Word!') ``` #### 1.3.3.获取调用栈第一个 ```tsx import { ToolsHelper } from '@szyx/sdk_base'; ToolsHelper.getStackKey() ``` #### 1.3.4.获取设备信息 ```tsx import { ToolsHelper } from '@szyx/sdk_base'; ToolsHelper.getDeviceInfo() ``` ### 1.4.[ValidatorHelper](./src/main/ets/utils/ValidatorHelper.ets) > 常用正则 #### 1.4.1.验证手机号 ```tsx import { ValidatorHelper } from '@szyx/sdk_base'; ValidatorHelper.isPhone('13800000000') ``` #### 1.4.2.是否为身份证号 ```tsx import { ValidatorHelper } from '@szyx/sdk_base'; ValidatorHelper.isIdcardNum() ``` ### 1.5.[AlgorithmHelper](./src/main/ets/utils/AlgorithmHelper.ets) > 计算相关 #### 1.5.1.计算两点间距离 ```tsx import { AlgorithmHelper } from '@szyx/sdk_base'; AlgorithmHelper.calculateDistance(x1, y1, x2, y2) ``` ### 1.6.[XWebHelper](./src/main/ets/utils/XWebHelper.ets) > 打开webview页面 ```tsx import { XWebHelper } from '@szyx/sdk_base'; // 必须先引入,否则无法跳转 const XWebview = import('../pages/XWebview'); XWebHelper.openWeb({ url: 'https://www.baidu.com', title: '百度一下', }) ``` ### 1.7.[PickerDateTimeHelper](./src/main/ets/utils/PickerDateTimeHelper.ets) > 时间日期选择弹窗相关 > #### 1.7.1 选择日期 ```tsx import { PickerDateTimeHelper } from '@szyx/sdk_base' PickerDateTimeHelper.showDateDialog({ onConfirm: (date) => { ToolsHelper.log(date) } }, this) ``` ## 2.[Dialog](./src/main/ets/dialog) ### 2.1.弹出list选中弹窗 ```tsx import { XDialogController } from '../dialog/XDialogController'; import { XDialogList } from '../dialog/XDialogList'; @Component struct MyView{ // 控制器,控制开关 dialogController: XDialogController = {} as XDialogController build() { Column() { Button ({ buttonStyle: ButtonStyleMode.TEXTUAL }) { Image($r('sys.media.ohos_ic_public_more')) .width(26).height(26) } . width(65) .onClick(() => { if (this.dialogController != null) { this.dialogController.open() } }) XDialogList({ // 控制器 controller: this.dialogController, // 标题(可选) title: '选择您的操作', // 选择内容列表 values: ['刷新', '浏览器打开', '分享', '复制地址'], // 用户选择事件 onSelected: (index: number, value: string) => { ToolsHelper.showMessage(`用户选择了第${index}个,内容为:${value}`) }, // 用户取消事件 onCancel: () => { ToolsHelper.showMessage('用户取消操作') }, // 是否可取消(点击空白处,或者物理返回键) autoCancel: true }) } . width('100%').height('100%') } } ``` ## 3.[网络请求](./src/main/ets/http/HttpHelper.ets) > 使用时建议二次封装 > > 参数定义 > ```tsx > /** > * > * @param url url地址 > * @param data 请求参数 > * @param headers 请求头 > * @param apiNo 请求标识,取消请求或者去重使用|考虑做自动重试使用 > * @returns > */ > ``` ### 3.1.get请求 ```tsx HttpHelper.get() .get>(url.url.startsWith('http') ? url.url : GlobalValue.getInstance().envUrl + url.url, data ? JSON.stringify(data) : undefined, { userId: GlobalValue.getInstance().userIds, clientId: GlobalValue.getInstance().getClientIds(), version: ConstantValue.VERSION, deviceType: '01', timeStamp: timeStamp + '', sign: sign, phoneModel: 'sign', phoneVersion: 'sign', phoneBrand: 'HarmonyOS' }, url.apiNo) .then((res: HttpResult) => { if (res.status === '0') { resolve(res.data as T) } else { reject(new Error(res.message)) } }) .catch((error: Error) => { reject(error) }) ``` ### 3.2.postJson ```tsx HttpHelper.get() .post>(url.url.startsWith('http') ? url.url : GlobalValue.getInstance().envUrl + url.url, data ? JSON.stringify(data) : undefined, { userId: GlobalValue.getInstance().userIds, clientId: GlobalValue.getInstance().getClientIds(), version: ConstantValue.VERSION, deviceType: '01', timeStamp: timeStamp + '', sign: sign, phoneModel: 'sign', phoneVersion: 'sign', phoneBrand: 'HarmonyOS' }, url.apiNo) .then((res: HttpResult) => { if (res.status === '0') { resolve(res.data as T) } else { reject(new Error(res.message)) } }) .catch((error: Error) => { reject(error) }) ``` ## 4.[自定义view](./src/main/ets/view) ### 4.1.[LoadingView](./src/main/ets/view/LoadingView.ets) > 封装了loading的根布局 ```tsx import { LoadingView } from '@szyx/sdk_base' @State isLoading: boolean = false build() { Stack() { LoadingView({ isLoading: this.isLoading }) { Column() { Text('正常布局') } .width('100%') .height('100%') } } } ``` ### 4.2.[SafeView](./src/main/ets/view/SafeView.ets) > 基础布局 ```tsx import { SafeView } from '@szyx/sdk_base' @State isLoading: boolean = false build() { SafeView({ isLoading: this.isLoading, titleText: '注册', onClickLeft:{img:$r("app.media.base_back"), onClick:()=>{} }, onClickRight:{ text:'添加', color:'#ff1d9999', onClick:()=>{} } }){ // 自己的布局 } } ``` ### 4.3.[RefreshView](./src/main/ets/view/RefreshView.ets) > 下拉刷新,上拉加载更多 ```tsx import { RefreshView } from '@szyx/sdk_base' @State isLoading: boolean = false @Builder buildItem(item: Item, index: number) { Column() { } .width('100%') } build() { // ...... RefreshView({ isLoading: this.isLoading, keyGenerator: (item: Item) => { return item.id }, pageSize: 10, data: this.list ?? [], // 这里要用箭头函数,否则buildItem里面的this指向不对 customBuilderParam: (item: Item, index: number) => { this.buildItem(item, index) }, onRefresh: () => { this.refresh() }, onLoadMore: (pageNum) => { this.refresh(pageNum) } }) // ...... } ``` ## 5.[Windows](./src/main/ets/utils/WindowHelper.ets) ### 5.1.弹出自定义窗口 > 弹出自定义窗口 ```tsx import { WindowHelper } from '@szyx/sdk_base' WindowHelper.open({ name: '登录弹窗', router:'login' }) WindowHelper.close() ``` ### 5.2.设置沉浸式相关 ```tsx // 需要的界面 // 设置是否全屏 WindowHelper.setWindowLayoutFullScreen(true) // 隐藏状态栏 WindowHelper.hideStatusBar() // 显示状态栏 WindowHelper.showStatusBar() // 顶部安全区高度 WindowHelper.topRectHeight() // 底部安全区高度 WindowHelper.bottomRectHeight() ``` # **** 常见问题