Web组件在某些场景下我们不会全屏显示,且给左上角右上角设置圆角不会生效。可以用下面的demo来进行验证。
import web_webview from '@ohos.web.webview';
import business_error from '@ohos.base';
@Entry
@Component
struct Page2 {
controller: web_webview.WebviewController = new web_webview.WebviewController();
@State progress: number = 0;
@State src: string = 'https://www.huawei.com/u/bmmain/helpsale/evaluate?random=1000&channel=BM_0933&needHideHead=3&cateId=101&type=B&plainSceneId=B2COld2New&modelId=125986&brandId=10532&modelName=%E5%8D%8E%E4%B8%BA%20Mate%2060%20Pro&skip2NextUrl=https%3A%2F%2Fm.zhuanzhuan.com%2Fzlj%2Fold_for_new_service_h5%2Fvaluation%3FneedHideHead%3D3%26needNewWebview%3D1%26serviceIds%3D%26productId%3D1779861808894005248%26metric%3D%26from%3Dc2b%26isUserEval%3D1';
;
build() {
Column() {
Row().height('30%')
Stack() {
Web({ src: this.src, controller: this.controller })
.borderRadius({ topLeft: 100, topRight: 100, bottomLeft: 0, bottomRight: 0 })
.javaScriptAccess(true)
.domStorageAccess(true)
.onProgressChange((event) => {
this.progress = event?.newProgress || 0;
// console.log(`progress: ${this.progress}`);
})
.height('100%')
Column({ space: 20 }) {
Text(`progress: ${this.progress}`).fontSize(30).fontColor(Color.Black)
Button('loadUrl')
.onClick(() => {
try {
this.controller.setCustomUserAgent("zzVersion/8.18.20 zzT/16 zzDevice/1_44.0_3.0 zzApp/58ZhuanZhuan");
const customUa = this.controller.getCustomUserAgent();
const ua = this.controller.getUserAgent();
console.log(`customUa: ${customUa}, ua: ${ua}`);
} catch (error) {
let e: business_error.BusinessError = error as business_error.BusinessError;
console.error(`ErrorCode: ${e.code}, Message: ${e.message}`);
}
})
}
}
.height('70%')
}.backgroundColor(Color.Black)
}
}
设置clip为true可以实现。关于clip参考文档https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-sharp-clipping-V5