修改首页布局以及添加本地签名

This commit is contained in:
DevWiki 2024-04-16 19:41:51 +08:00
parent fe18fa1ca6
commit 4eaf337930
16 changed files with 266 additions and 81 deletions

View File

@ -1,8 +1,28 @@
import { ComponentConst, ScreenUtil, TitleBar } from '@devwiki/common_ui';
import { TitleBarMenuType } from '@devwiki/common_ui/src/main/ets/component/TitleBar';
import web_webview from '@ohos.web.webview';
import { TitleBarMenuType } from '@devwiki/common_ui';
import { WebPage } from './WebPage';
import { window } from '@kit.ArkUI';
import { router, window } from '@kit.ArkUI';
import { WebPageDialog } from './WebPageDialog'
import promptAction from '@ohos.promptAction';
import { BusinessError } from '@ohos.base';
@CustomDialog
struct WebViewDialog {
webUrl: string = "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/password"
private webviewController: web_webview.WebviewController = new web_webview.WebviewController();
dialogController: CustomDialogController;
@StorageLink(ScreenUtil.isPortraitKey)isPortrait: boolean = true;
build() {
Row() {
Web({ src: this.webUrl, controller: this.webviewController })
.javaScriptAccess(true)// 允许使用 js
.width('100%')
.height('100%');
}.height(this.isPortrait ? '95%' : '90%').width(this.isPortrait ? '100%' : '50%')
}
}
@Entry
@Component
@ -11,7 +31,7 @@ struct Index {
@State title: string = "Home";
dialogController: CustomDialogController = new CustomDialogController({
builder: WebPageDialog(),
builder: WebViewDialog(),
alignment: DialogAlignment.BottomEnd,
customStyle: true
})
@ -24,75 +44,70 @@ struct Index {
ScreenUtil.getInstance().setPreferredOrientation(window.Orientation.AUTO_ROTATION);
}
onTitleBarLeftClick(_event: ClickEvent) {
this.getUIContext().getRouter().back();
pageTransition() {
// 定义页面进入时的效果无论页面栈发生push还是pop操作均可生效
PageTransitionEnter({ type: RouteType.None, duration: 100 }).opacity(1)
// 定义页面退出时的效果无论页面栈发生push还是pop操作均可生效
PageTransitionExit({ type: RouteType.None, duration: 100 }).opacity(0)
}
onButtonClicked() {
this.dialogController.open();
getContext(this).filesDir
onBackPress(): boolean | void {
// 弹出自定义的询问框
promptAction.showDialog({
message: '确定要退出吗?',
buttons: [
{
text: '取消',
color: '#FF0000'
},
{
text: '确认',
color: '#0099FF'
}
]
}).then((result: promptAction.ShowDialogSuccessResponse) => {
if (result.index === 0) {
// 用户点击了“取消”按钮
console.info('User canceled the operation.');
} else if (result.index === 1) {
// 用户点击了“确认”按钮
console.info('User confirmed the operation.');
// 调用router.back()方法,返回上一个页面
router.back();
}
}).catch((err: Error) => {
let message = (err as BusinessError).message
let code = (err as BusinessError).code
console.error(`Invoke showDialog failed, code is ${code}, message is ${message}`);
})
return true;
}
// router.pushUrl({
// // 两种方式都可以加载Page, 一个是和 resources/base/profile/main_pages.ets中的配置相同
// // 一个是绝对路径
// // url: "pages/WebPage",
// url: PageRouter.WebPage
// }, router.RouterMode.Single);
async onTitleBarLeftClick(_event: ClickEvent) {
this.onBackPress;
}
build() {
Column() {
Row() {}.width('100%')
.backgroundColor('#F08080')
.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
RelativeContainer() {
TitleBar({
title: this.title,
onLeftClicked: this.onTitleBarLeftClick,
rightMenuType: TitleBarMenuType.None
})
.width('100%')
.alignRules({
top: { anchor: ComponentConst.ContainerId, align: VerticalAlign.Top },
left: { anchor: ComponentConst.ContainerId, align: HorizontalAlign.Start },
}).id("title_bar"); //必须要设置id 否则不显示
TitleBar({
title: this.title,
onLeftClicked: ()=> {this.onBackPress()},
rightMenuType: TitleBarMenuType.None
}).width('100%')
Divider().alignRules({
top: { anchor: "title_bar", align: VerticalAlign.Bottom },
left: { anchor: ComponentConst.ContainerId, align: HorizontalAlign.Start }
}).width('100%').id("divider") //必须要设置id 否则不显示
Column() {
Row() {
Button("WebDialog").width(100).height('100%').type(ButtonType.Normal)
.onClick(() => { this.dialogController.open() });
Grid() {
GridItem() {
Button("Layout").type(ButtonType.Capsule).height(32).width(80);
}.rowStart(0).rowEnd(0).columnStart(0).columnEnd(0)
Button("Layout").width(100).height('100%').type(ButtonType.Normal).onClick(() =>{
router.pushUrl({url: "pages/layout/LinearLayoutPage"});
});
GridItem() {
Button("WebPage").type(ButtonType.Capsule).height(32).width(80)
.onClick(() => { this.dialogController.open() });
}.rowStart(0).rowEnd(0).columnStart(1).columnEnd(1)
Button().width(100).height('100%').type(ButtonType.Normal);
GridItem() {
Button("3").type(ButtonType.Capsule).height(32).width(80);
}.rowStart(0).rowEnd(0).columnStart(2).columnEnd(2)
GridItem() {
Button("4").type(ButtonType.Capsule).height(32).width(80);
}.rowStart(0).rowEnd(0).columnStart(3).columnEnd(3)
GridItem() {
Button("1").type(ButtonType.Capsule).height(32).width(80);
}.rowStart(1).rowEnd(1).columnStart(0).columnEnd(0)
}
.width('100%')
.columnsTemplate('1fr 1fr 1fr 1fr').columnsGap(8)
.rowsTemplate('repeat(auto-fill, 36)').rowsGap(8)
.alignRules({
top: { anchor: "divider", align: VerticalAlign.Bottom },
left: { anchor: ComponentConst.ContainerId, align: HorizontalAlign.Start },
bottom: { anchor: ComponentConst.ContainerId, align: VerticalAlign.Bottom }
}).id("host_web") //必须要设置id 否则不显示
}.width('100%').height('100%')
}.width('100%').height('100%').backgroundImage($r("app.media.bg_sky")).backgroundImageSize(ImageSize.Cover)
}.width('100%').height(48).justifyContent(FlexAlign.SpaceEvenly)
}.justifyContent(FlexAlign.Center).width('100%')
}.width('100%').height('100%')
}
}

View File

@ -0,0 +1,64 @@
import { TitleBar } from '@devwiki/common_ui/Index';
import picker from '@ohos.file.picker';
import { BusinessError } from '@kit.BasicServicesKit';
import fs, { ReadOptions } from '@ohos.file.fs';
import common from '@ohos.app.ability.common';
import buffer from '@ohos.buffer';
@Entry
@Component
struct PhotoPage {
build() {
Column() {
TitleBar({
title: "PhotoPage",
onLeftClicked: ()=> {
this.getUIContext().getRouter().back();
}}).width('100%')
Divider();
Button("Open").onClick(() =>{
}).margin(5);
}.width('100%').height('100%')
}
openPhotoSelector() {
let selectOptions = new picker.PhotoSelectOptions();
selectOptions.maxSelectNumber = 1;
let viewPicker = new picker.PhotoViewPicker()
viewPicker.select(selectOptions).then((result) => {
let uri = result.photoUris;
let file = fs.openSync(uri[0], fs.OpenMode.READ_ONLY);
// 打开文件流
let inputStream = fs.createStreamSync(uri[0], 'r+');
let outputStream = buffer.alloc(fs.statSync(uri[0]).size);
// 以流的形式读取源文件内容并写入目的文件
let bufSize = 4096;
let readSize = 0;
let buf = new ArrayBuffer(bufSize);
let readOptions: ReadOptions = {
offset: readSize,
length: bufSize
};
new String(buf);
let readLen = inputStream.readSync(buf, readOptions);
readSize += readLen;
while (readLen > 0) {
for (let index = 0; index < readSize; index++) {
outputStream[readSize] = buf.slice(index);
}
readOptions.offset = readSize;
readLen = inputStream.readSync(buf, readOptions);
readSize += readLen;
}
// 关闭文件流
inputStream.closeSync();
console.info('PhotoViewPicker.select to file succeed and uri is:' + uri);
}).catch((err: BusinessError) => {
console.error(`Invoke documentViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
})
}
}

View File

@ -1,5 +1,4 @@
import { WebView, ComponentConst, CommonRes, TitleBar, WebViewController, ScreenUtil } from '@devwiki/common_ui';
import { WebViewParam } from '@devwiki/common_ui/src/main/ets/component/web/WebView';
import { WebView, WebViewParam, ComponentConst, CommonRes, TitleBar, WebViewController, ScreenUtil } from '@devwiki/common_ui';
@Entry
@Component

View File

@ -3,21 +3,51 @@
@Component
struct LinearLayoutPage {
@State space: number = 10;
columnMargin:number = 8
columnBgColor:string = '#26c6da'
@State columnJustifyContent: FlexAlign = FlexAlign.SpaceEvenly;
@State columnAlignItems :HorizontalAlign = HorizontalAlign.Center;
pageTransition() {
// 定义页面进入时的效果无论页面栈发生push还是pop操作均可生效
PageTransitionEnter({ type: RouteType.None, duration: 200 }).opacity(1)
// 定义页面退出时的效果无论页面栈发生push还是pop操作均可生效
PageTransitionExit({ type: RouteType.None, duration: 200 }).opacity(0)
}
build() {
Column({ space: '5' }) {
Text(`space:${this.space}`)
Row({ space: this.space}){
Column().height('100%').width('25%').backgroundColor("#ff5577")
Column().height('100%').width('25%').backgroundColor("#ff5577")
Column().height('100%').width('20%').backgroundColor("#ff5577")
Column().height('100%').width('20%').backgroundColor("#ff5577")
}.width('90%').height('10%').backgroundColor("#11ff4455")
Row().width('90%').height('10%').backgroundColor("#ff4455")
Row().width('90%').height('10%').backgroundColor("#ff4455")
Row().width('90%').height('10%').backgroundColor("#ff4455")
Row().width('90%').height('10%').backgroundColor("#ff4455")
}.width('100%')
// Column的子元素垂直排列, 即1列N行
Column() {
Row() {
Text(`Column的子元素垂直排列, 即1列N行, 当前为第1行 \n Column的margin:${this.columnMargin}`)
.width('100%')
}.width('80%').height(96).alignItems(VerticalAlign.Center).justifyContent(FlexAlign.SpaceEvenly)
.borderWidth(1)
Column() {
Text("当前为第2行,不同的justifyContent会影响行之间的间隔");
Button("切换justifyContent").onClick((event: ClickEvent) => {
if (this.columnJustifyContent < FlexAlign.SpaceEvenly) {
this.columnJustifyContent++;
} else {
this.columnJustifyContent = 0;
}
})
}.width('80%').height(96).alignItems(HorizontalAlign.Center).justifyContent(FlexAlign.SpaceEvenly)
.borderWidth(1)
Column() {
Text("当前为第3行, 不同的alignItems会影响在水平方向上的对其方式");
Button("切换alignItems").onClick((event: ClickEvent) => {
if (this.columnAlignItems < HorizontalAlign.End) {
this.columnAlignItems++
} else {
this.columnAlignItems = 0;
}
})
}.width('80%').height(96).alignItems(HorizontalAlign.Center).justifyContent(FlexAlign.SpaceEvenly)
.borderWidth(1)
}.height('100%').width('100%').alignItems(this.columnAlignItems).justifyContent(this.columnJustifyContent)
.backgroundColor('#26c6da')
}
}

View File

@ -1,6 +1,7 @@
{
"src": [
"pages/Index",
"pages/WebPage"
"pages/WebPage",
"pages/layout/LinearLayoutPage"
]
}

View File

@ -3,6 +3,19 @@
"app": {
//签名配置
"signingConfigs": [
{
"name": "default",
"type": "HarmonyOS",
"material": {
"certpath": "build_script/sign/HM4Demo.cer",
"storePassword": "0000001B9C6223E8C618FEFD3D871B066F744A4E9C03C09D8ED7E7C7ECE6C1F53A54A6748EC341B960E492",
"keyAlias": "debugKey",
"keyPassword": "0000001B63515E7120BC166D17A66B98A717DE9B06276194E4317B5317F70EA2835B8AD262B9DD4FD6AB55",
"profile": "build_script/sign/HM4Demo.p7b",
"signAlg": "SHA256withECDSA",
"storeFile": "build_script/sign/HM4Demo.p12"
}
}
],
//产品配置
"products": [

View File

@ -0,0 +1,50 @@
-----BEGIN CERTIFICATE-----
MIICGjCCAaGgAwIBAgIIShhpn519jNAwCgYIKoZIzj0EAwMwUzELMAkGA1UEBhMC
Q04xDzANBgNVBAoMBkh1YXdlaTETMBEGA1UECwwKSHVhd2VpIENCRzEeMBwGA1UE
AwwVSHVhd2VpIENCRyBSb290IENBIEcyMB4XDTIwMDMxNjAzMDQzOVoXDTQ5MDMx
NjAzMDQzOVowUzELMAkGA1UEBhMCQ04xDzANBgNVBAoMBkh1YXdlaTETMBEGA1UE
CwwKSHVhd2VpIENCRzEeMBwGA1UEAwwVSHVhd2VpIENCRyBSb290IENBIEcyMHYw
EAYHKoZIzj0CAQYFK4EEACIDYgAEWidkGnDSOw3/HE2y2GHl+fpWBIa5S+IlnNrs
GUvwC1I2QWvtqCHWmwFlFK95zKXiM8s9yV3VVXh7ivN8ZJO3SC5N1TCrvB2lpHMB
wcz4DA0kgHCMm/wDec6kOHx1xvCRo0IwQDAOBgNVHQ8BAf8EBAMCAQYwDwYDVR0T
AQH/BAUwAwEB/zAdBgNVHQ4EFgQUo45a9Vq8cYwqaiVyfkiS4pLcIAAwCgYIKoZI
zj0EAwMDZwAwZAIwMypeB7P0IbY7c6gpWcClhRznOJFj8uavrNu2PIoz9KIqr3jn
BlBHJs0myI7ntYpEAjBbm8eDMZY5zq5iMZUC6H7UzYSix4Uy1YlsLVV738PtKP9h
FTjgDHctXJlC5L7+ZDY=
-----END CERTIFICATE-----
-----BEGIN CERTIFICATE-----
MIIDATCCAoigAwIBAgIIXmuDXbWpOB8wCgYIKoZIzj0EAwMwUzELMAkGA1UEBhMC
Q04xDzANBgNVBAoMBkh1YXdlaTETMBEGA1UECwwKSHVhd2VpIENCRzEeMBwGA1UE
AwwVSHVhd2VpIENCRyBSb290IENBIEcyMB4XDTIwMDcwOTAyMDQyNFoXDTMwMDcw
NzAyMDQyNFowYjELMAkGA1UEBgwCQ04xDzANBgNVBAoMBkh1YXdlaTETMBEGA1UE
CwwKSHVhd2VpIENCRzEtMCsGA1UEAwwkSHVhd2VpIENCRyBEZXZlbG9wZXIgUmVs
YXRpb25zIENBIEcyMHYwEAYHKoZIzj0CAQYFK4EEACIDYgAE65LdoIZh1hlpZ2gP
bJ6gPhHsvYSRe22KETgdqeVeYnrbRHI9wsPT6RGYS+pU4mPl6wxzgDMqN6SY/BoZ
luhkE1PzaHoPoNIWIq0O33hpyKyyYwAacIUEjYurkw1E9r9no4IBGDCCARQwHwYD
VR0jBBgwFoAUo45a9Vq8cYwqaiVyfkiS4pLcIAAwHQYDVR0OBBYEFNtek7Ij6NDk
/nF6Zumkc0dbf/NeMEYGA1UdIAQ/MD0wOwYEVR0gADAzMDEGCCsGAQUFBwIBFiVo
dHRwOi8vY3BraS1jYXdlYi5odWF3ZWkuY29tL2Nwa2kvY3BzMBIGA1UdEwEB/wQI
MAYBAf8CAQAwDgYDVR0PAQH/BAQDAgEGMGYGA1UdHwRfMF0wW6BZoFeGVWh0dHA6
Ly9jcGtpLWNhd2ViLmh1YXdlaS5jb20vY3BraS9zZXJ2bGV0L2NybEZpbGVEb3du
LmNybD9jZXJ0eXBlPTEwJi9yb290X2cyX2NybC5jcmwwCgYIKoZIzj0EAwMDZwAw
ZAIwWO1X5q2MdfpR1Q237GpUHGbL1C13rGyFg2p3AYo44FpZ2/A9ss0wOHKM4KDl
ZPqdAjBLkf8NPZy7KVog98+iCTLq35DJ2ZVxkCxknA9YhiHVyXf4HPm4JlT7rW7o
Q+FzM3c=
-----END CERTIFICATE-----
-----BEGIN CERTIFICATE-----
MIICxDCCAkugAwIBAgIOCfqy0519H29B/WqaHGQwCgYIKoZIzj0EAwMwYjELMAkG
A1UEBgwCQ04xDzANBgNVBAoMBkh1YXdlaTETMBEGA1UECwwKSHVhd2VpIENCRzEt
MCsGA1UEAwwkSHVhd2VpIENCRyBEZXZlbG9wZXIgUmVsYXRpb25zIENBIEcyMB4X
DTI0MDQwNzEyMjAyNFoXDTI1MDQwNzEyMjAyNFowdTELMAkGA1UEBhMCQ04xEjAQ
BgNVBAoMCeW8oOS6muW3njEcMBoGA1UECwwTMTM3NDY1NTI5MTc3NzQwNjA4MTE0
MDIGA1UEAwwr5byg5Lqa5beeKDEzNzQ2NTUyOTE3Nzc0MDYwODEpXCxEZXZlbG9w
bWVudDBZMBMGByqGSM49AgEGCCqGSM49AwEHA0IABCV0e7DEk8fQHqVIJ+R6PvbJ
3mVFomYb96YvmrERrcM4au/yGtFdw5lWyrXxnECaRSgOAsKv9HuCbUl3OYv4XKmj
gdEwgc4wDAYDVR0TAQH/BAIwADBZBgNVHR8EUjBQME6gTKBKhkhodHRwOi8vaDVo
b3N0aW5nLWRyY24uZGJhbmtjZG4uY24vY2NoNS9jcmwvaGRyY2FnMi9IdWF3ZWlD
QkdIRFJHMmNybC5jcmwwHwYDVR0jBBgwFoAU216TsiPo0OT+cXpm6aRzR1t/814w
HQYDVR0OBBYEFBPcTdaYFqIJtv+sLVTRzlwzs6mqMA4GA1UdDwEB/wQEAwIHgDAT
BgNVHSUEDDAKBggrBgEFBQcDAzAKBggqhkjOPQQDAwNnADBkAjBGziW/rzZFa4z2
sPEI5AYrCWV87jwO3aJjQMDcmysqFd446ICI4FDjGqhplj2FCuQCMCk2jQPIfxI+
j2vUYfzp7SC0J/lURWksxfKawdAQMrotqnHRvg+ZMSg5aNjlTnfApQ==
-----END CERTIFICATE-----

View File

@ -0,0 +1,9 @@
-----BEGIN NEW CERTIFICATE REQUEST-----
MIIBNTCB3AIBADBKMQkwBwYDVQQGEwAxCTAHBgNVBAgTADEJMAcGA1UEBxMAMQkw
BwYDVQQKEwAxCTAHBgNVBAsTADERMA8GA1UEAxMIRGVidWdLZXkwWTATBgcqhkjO
PQIBBggqhkjOPQMBBwNCAAQldHuwxJPH0B6lSCfkej72yd5lRaJmG/emL5qxEa3D
OGrv8hrRXcOZVsq18ZxAmkUoDgLCr/R7gm1JdzmL+FypoDAwLgYJKoZIhvcNAQkO
MSEwHzAdBgNVHQ4EFgQUE9xN1pgWogm2/6wtVNHOXDOzqaowCgYIKoZIzj0EAwID
SAAwRQIhAL/kaUfXrrPcLs3wtZwMUnTfOV7m60SyTds5jyziXfhJAiBV0ONZyq8o
JInBx6WW2upR12Hdtx3qYylrQXhoP95VwQ==
-----END NEW CERTIFICATE REQUEST-----

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1 @@
€)e4ê´ íç^þÿÔ±

View File

@ -0,0 +1 @@
<EFBFBD>N<EFBFBD>(<28>a<EFBFBD>=]<5D><><EFBFBD><EFBFBD>}4<>

View File

@ -0,0 +1 @@
W„uQűÓ©]CzwĐHH

View File

@ -0,0 +1 @@
HиЙmKо<0E>d<EFBFBD>ов<D0BE>Ё

View File

@ -1,8 +1,8 @@
export { TitleBar } from './src/main/ets/component/TitleBar'
export { TitleBar, TitleBarMenuType } from './src/main/ets/component/TitleBar'
export { ComponentConst } from './src/main/ets/component/ComponentConst'
export { WebViewEventKey } from './src/main/ets/event/EventKey'
export { Emitter } from './src/main/ets/event/Emitter'
export { WebView, WebViewController } from './src/main/ets/component/web/WebView'
export { WebView, WebViewController, WebViewParam } from './src/main/ets/component/web/WebView'
export { CommonRes } from './src/main/ets/utils/CommonRes'
export { ScreenUtil } from './src/main/ets/utils/ScreenUtil'