Skip to content

D
Docs

Tonvia / Docs
与 Fork 源项目一致

Fork自 OpenHarmony / Docs

通知 1
Star 0
Fork 0
D
Docs

体验新版 GitCode，发现更多精彩内容 >>

提交 deb78999 编写于 作者: Y yamila
浏览文件
操作

update semicolon 

Signed-off-by: Nyamila <tianyu55@huawei.com>
上级 c853f403
隐藏空白更改
内联 并排
Showing with 887 addition and 895 deletion
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-gauge.md
浏览文件 @ deb78999
......@@ -64,7 +64,7 @@ struct GaugeExample {
// 参数设置当前值为75，属性设置值为25，属性设置优先级高
Gauge({ value: 75 })
.value(25) //属性和参数都设置时以参数为准
.value(25) // 属性和参数都设置时以参数为准
.width(200).height(200)
.colors([[0x317AF7, 1], [0x5BA854, 1], [0xE08C3A, 1], [0x9C554B, 1]])
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
浏览文件 @ deb78999
......@@ -353,17 +353,17 @@ struct ImageExample3 {
### 渲染沙箱路径图片
```
import fileio from '@ohos.fileio';
import image from '@ohos.multimedia.image';
import fileio from '@ohos.fileio'
import image from '@ohos.multimedia.image'
const EMPTY_PATH = 'file://';
const EMPTY_PATH = 'file://'
@Entry
@Component
struct LoadImageExample {
@State fileContent: string = '';
@State path: string = EMPTY_PATH;
@State accountInfoHeadPic: any = '';
@State fileContent: string = ''
@State path: string = EMPTY_PATH
@State accountInfoHeadPic: any = ''
build() {
Column() {
......@@ -371,22 +371,22 @@ struct LoadImageExample {
.margin({ bottom: 10 })
.onClick(() => {
try {
this.path = EMPTY_PATH;
let context = getContext(this);
let path = context.getApplicationContext().filesDir + '/icon.png';
console.log(`读取沙箱图片=========>${path}`);
let fd = fileio.openSync(path, 0o100, 0o666);
console.log(`create file========>${fd}`);
let srcPath = context.bundleCodeDir + '/entry/resource/base/media/icon.png';
fileio.copyFileSync(srcPath, path);
console.log(`error:=============>${e.message}`);
this.path = EMPTY_PATH
let context = getContext(this)
let path = context.getApplicationContext().filesDir + '/icon.png'
console.log(`读取沙箱图片=========>${path}`)
let fd = fileio.openSync(path, 0o100, 0o666)
console.log(`create file========>${fd}`)
let srcPath = context.bundleCodeDir + '/entry/resource/base/media/icon.png'
fileio.copyFileSync(srcPath, path)
console.log(`error:=============>${e.message}`)
}
})
Button('读取资源图片')
.margin({ bottom: 10 })
.onClick(() => {
this.path = EMPTY_PATH;
this.path += getContext(this.bundleCodeDir + '/entry/resource/base/media/icon.png');
this.path += getContext(this.bundleCodeDir + '/entry/resource/base/media/icon.png')
})
Text(`图片路径:${this.path}`)
.fontSize(20)
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-patternlock.md
浏览文件 @ deb78999
......@@ -66,9 +66,9 @@ reset(): void
@Entry
@Component
struct PatternLockExample {
@State passwords: Number[] = [];
@State message: string = 'please input password!';
private patternLockController: PatternLockController = new PatternLockController();
@State passwords: Number[] = []
@State message: string = 'please input password!'
private patternLockController: PatternLockController = new PatternLockController()
build() {
Column() {
......@@ -85,29 +85,29 @@ struct PatternLockExample {
.onPatternComplete((input: Array<number>) => {
// 输入的密码长度小于5时，提示重新输入
if (input === null || input === undefined || input.length < 5) {
this.message = 'The password length needs to be greater than 5, please enter again.';
return;
this.message = 'The password length needs to be greater than 5, please enter again.'
return
}
// 判断密码长度是否大于0
if (this.passwords.length > 0) {
// 判断两次输入的密码是否相同，相同则提示密码设置成功，否则提示重新输入
if (this.passwords.toString() === input.toString()) {
this.passwords = input;
this.message = 'Set password successfully: ' + this.passwords.toString();
this.passwords = input
this.message = 'Set password successfully: ' + this.passwords.toString()
} else {
this.message = 'Inconsistent passwords, please enter again.';
this.message = 'Inconsistent passwords, please enter again.'
}
} else {
// 提示第二次输入密码
this.passwords = input;
this.message = "Please enter again.";
this.passwords = input
this.message = "Please enter again."
}
})
Button('Reset PatternLock').margin(30).onClick(() => {
// 重置密码锁
this.patternLockController.reset();
this.passwords = [];
this.message = 'Please input password';
this.patternLockController.reset()
this.passwords = []
this.message = 'Please input password'
})
}.width('100%').height('100%')
}
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md
浏览文件 @ deb78999
......@@ -75,9 +75,9 @@ caretPosition(value: number): void
@Entry
@Component
struct SearchExample {
@State changeValue: string = '';
@State submitValue: string = '';
controller: SearchController = new SearchController();
@State changeValue: string = ''
@State submitValue: string = ''
controller: SearchController = new SearchController()
build() {
Column() {
......@@ -92,16 +92,16 @@ struct SearchExample {
.placeholderFont({ size: 14, weight: 400 })
.textFont({ size: 14, weight: 400 })
.onSubmit((value: string) => {
this.submitValue = value;
this.submitValue = value
})
.onChange((value: string) => {
this.changeValue = value;
this.changeValue = value
})
.margin(20)
Button('Set caretPosition 1')
.onClick(() => {
// 设置光标位置到输入的第一个字符后
this.controller.caretPosition(1);
this.controller.caretPosition(1)
})
}.width('100%')
}
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-slider.md
浏览文件 @ deb78999
......@@ -75,14 +75,14 @@ Slider(options?: {value?: number, min?: number, max?: number, step?: number, sty
@Entry
@Component
struct SliderExample {
@State outSetValueOne: number = 40;
@State inSetValueOne: number = 40;
@State outSetValueTwo: number = 40;
@State inSetValueTwo: number = 40;
@State vOutSetValueOne: number = 40;
@State vInSetValueOne: number = 40;
@State vOutSetValueTwo: number = 40;
@State vInSetValueTwo: number = 40;
@State outSetValueOne: number = 40
@State inSetValueOne: number = 40
@State outSetValueTwo: number = 40
@State inSetValueTwo: number = 40
@State vOutSetValueOne: number = 40
@State vInSetValueOne: number = 40
@State vOutSetValueTwo: number = 40
@State vInSetValueTwo: number = 40
build() {
Column({ space: 8 }) {
......@@ -96,8 +96,8 @@ struct SliderExample {
})
.showTips(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.outSetValueOne = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.outSetValueOne = value
console.info('value:' + value + 'mode:' + mode.toString())
})
// toFixed(0)将滑动条返回值处理为整数精度
Text(this.outSetValueOne.toFixed(0)).fontSize(12)
......@@ -111,8 +111,8 @@ struct SliderExample {
})
.showSteps(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.outSetValueTwo = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.outSetValueTwo = value
console.info('value:' + value + 'mode:' + mode.toString())
})
Text(this.outSetValueTwo.toFixed(0)).fontSize(12)
}
......@@ -131,8 +131,8 @@ struct SliderExample {
.selectedColor('#4169E1')
.showTips(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.inSetValueOne = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.inSetValueOne = value
console.info('value:' + value + 'mode:' + mode.toString())
})
Text(this.inSetValueOne.toFixed(0)).fontSize(12)
}
......@@ -148,8 +148,8 @@ struct SliderExample {
.selectedColor('#4169E1')
.showSteps(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.inSetValueTwo = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.inSetValueTwo = value
console.info('value:' + value + 'mode:' + mode.toString())
})
Text(this.inSetValueTwo.toFixed(0)).fontSize(12)
}
......@@ -169,8 +169,8 @@ struct SliderExample {
.selectedColor('#4169E1')
.showTips(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.vOutSetValueOne = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.vOutSetValueOne = value
console.info('value:' + value + 'mode:' + mode.toString())
})
Slider({
value: this.vOutSetValueTwo,
......@@ -183,8 +183,8 @@ struct SliderExample {
.selectedColor('#4169E1')
.showSteps(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.vOutSetValueTwo = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.vOutSetValueTwo = value
console.info('value:' + value + 'mode:' + mode.toString())
})
}
}.width('50%').height(300)
......@@ -200,8 +200,8 @@ struct SliderExample {
})
.showTips(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.vInSetValueOne = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.vInSetValueOne = value
console.info('value:' + value + 'mode:' + mode.toString())
})
Slider({
value: this.vInSetValueTwo,
......@@ -212,8 +212,8 @@ struct SliderExample {
})
.showSteps(true)
.onChange((value: number, mode: SliderChangeMode) => {
this.vInSetValueTwo = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.vInSetValueTwo = value
console.info('value:' + value + 'mode:' + mode.toString())
})
}
}.width('50%').height(300)
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-stepper.md
浏览文件 @ deb78999
......@@ -48,10 +48,10 @@ Stepper(value?: { index?: number })
@Entry
@Component
struct StepperExample {
@State currentIndex: number = 0;
@State firstState: ItemState = ItemState.Normal;
@State secondState: ItemState = ItemState.Normal;
@State thirdState: ItemState = ItemState.Normal;
@State currentIndex: number = 0
@State firstState: ItemState = ItemState.Normal
@State secondState: ItemState = ItemState.Normal
@State thirdState: ItemState = ItemState.Normal
build() {
Stepper({
......@@ -67,7 +67,7 @@ struct StepperExample {
.margin({ top: 250, bottom: 50 })
Button('change status:' + this.firstState)
.onClick(() => {
this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip;
this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip
})
}.width('100%')
}
......@@ -83,7 +83,7 @@ struct StepperExample {
.margin({ top: 250, bottom: 50 })
Button('change status:' + this.secondState)
.onClick(() => {
this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled;
this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled
})
}.width('100%')
}
......@@ -100,7 +100,7 @@ struct StepperExample {
.margin({ top: 250, bottom: 50 })
Button('change status:' + this.thirdState)
.onClick(() => {
this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting;
this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting
})
}.width('100%')
}
......@@ -119,14 +119,14 @@ struct StepperExample {
}
.onFinish(() => {
// 此处可处理点击最后一页的Finish时的逻辑，例如路由跳转等
console.info('onFinish');
console.info('onFinish')
})
.onSkip(() => {
// 此处可处理点击跳过时的逻辑，例如动态修改Stepper的index值使其跳转到某一步骤页等
console.info('onSkip');
console.info('onSkip')
})
.onChange((prevIndex: number, index: number) => {
this.currentIndex = index;
this.currentIndex = index
})
}
}
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
浏览文件 @ deb78999
......@@ -85,7 +85,7 @@ struct TextAreaExample {
build() {
Column() {
TextArea({ placeholder: 'input your word', controller: this.controller })
TextArea({ placeholder: 'The text area can hold an unlimited amount of text. input your word', controller: this.controller })
.placeholderFont({ size: 14, weight: 400 })
.width(400)
.height(50)
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textinput.md
浏览文件 @ deb78999
......@@ -112,8 +112,8 @@ caretPosition(value:&nbsp;number): void
@Entry
@Component
struct TextInputExample {
@State text: string = '';
controller: TextInputController = new TextInputController();
@State text: string = ''
controller: TextInputController = new TextInputController()
build() {
Column() {
......@@ -127,14 +127,14 @@ struct TextInputExample {
.fontSize(14)
.fontColor(Color.Black)
.onChange((value: string) => {
this.text = value;
this.text = value
})
Text(this.text)
Button('Set caretPosition 1')
.margin(15)
.onClick(() => {
// 将光标移动至第一个字符后
this.controller.caretPosition(1);
this.controller.caretPosition(1)
})
// 密码输入框
TextInput({ placeholder: 'input your password...' })
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-web.md
浏览文件 @ deb78999
......@@ -37,7 +37,7 @@ Web(options: { src: ResourceStr, controller: WebController | WebviewController})
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -52,7 +52,7 @@ Web(options: { src: ResourceStr, controller: WebController | WebviewController})
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController();
controller: web_webview.WebviewController = new web_webview.WebviewController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -67,7 +67,7 @@ Web(options: { src: ResourceStr, controller: WebController | WebviewController})
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: $rawfile("index.html"), controller: this.controller })
......@@ -109,7 +109,7 @@ domStorageAccess(domStorageAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -138,7 +138,7 @@ fileAccess(fileAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -167,7 +167,7 @@ fileFromUrlAccess(fileFromUrlAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -195,7 +195,7 @@ imageAccess(imageAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -228,16 +228,16 @@ javaScriptProxy(javaScriptProxy: { object: object, name: string, methodList: Arr
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
testObj = {
test: (data1, data2, data3) => {
console.log("data1:" + data1);
console.log("data2:" + data2);
console.log("data3:" + data3);
return "AceString";
console.log("data1:" + data1)
console.log("data2:" + data2)
console.log("data3:" + data3)
return "AceString"
},
toString: () => {
console.log('toString' + "interface instead.");
console.log('toString' + "interface instead.")
}
}
build() {
......@@ -261,16 +261,16 @@ javaScriptProxy(javaScriptProxy: { object: object, name: string, methodList: Arr
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController();
controller: web_webview.WebviewController = new web_webview.WebviewController()
testObj = {
test: (data1, data2, data3) => {
console.log("data1:" + data1);
console.log("data2:" + data2);
console.log("data3:" + data3);
return "AceString";
console.log("data1:" + data1)
console.log("data2:" + data2)
console.log("data3:" + data3)
return "AceString"
},
toString: () => {
console.log('toString' + "interface instead.");
console.log('toString' + "interface instead.")
}
}
build() {
......@@ -307,7 +307,7 @@ javaScriptAccess(javaScriptAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -336,8 +336,8 @@ mixedMode(mixedMode: MixedMode)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State mode: MixedMode = MixedMode.All;
controller: WebController = new WebController()
@State mode: MixedMode = MixedMode.All
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -366,7 +366,7 @@ onlineImageAccess(onlineImageAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -395,7 +395,7 @@ zoomAccess(zoomAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -424,7 +424,7 @@ overviewModeAccess(overviewModeAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -453,7 +453,7 @@ databaseAccess(databaseAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -482,7 +482,7 @@ geolocationAccess(geolocationAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -511,8 +511,8 @@ mediaPlayGestureAccess(access: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State access: boolean = true;
controller: WebController = new WebController()
@State access: boolean = true
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -541,7 +541,7 @@ multiWindowAccess(multiWindow: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -570,8 +570,8 @@ cacheMode(cacheMode: CacheMode)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State mode: CacheMode = CacheMode.None;
controller: WebController = new WebController()
@State mode: CacheMode = CacheMode.None
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -600,8 +600,8 @@ textZoomRatio(textZoomRatio: number)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State atio: number = 150;
controller: WebController = new WebController()
@State atio: number = 150
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -630,8 +630,8 @@ userAgent(userAgent: string)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State userAgent:string = 'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36';
controller: WebController = new WebController()
@State userAgent:string = 'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36'
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -660,8 +660,8 @@ webDebuggingAccess(webDebuggingAccess: boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State webDebuggingAccess: boolean = true;
controller: WebController = new WebController()
@State webDebuggingAccess: boolean = true
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -706,7 +706,7 @@ onAlert(callback: (event?: { url: string; message: string; result: JsResult }) =
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -730,7 +730,7 @@ onAlert(callback: (event?: { url: string; message: string; result: JsResult }) =
event.result.handleCancel()
}
})
return true;
return true
})
}
}
......@@ -764,14 +764,14 @@ onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResu
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onBeforeUnload((event) => {
console.log("event.url:" + event.url);
console.log("event.message:" + event.message);
console.log("event.url:" + event.url)
console.log("event.message:" + event.message)
AlertDialog.show({
title: 'onBeforeUnload',
message: 'text',
......@@ -791,7 +791,7 @@ onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResu
event.result.handleCancel()
}
})
return true;
return true
})
}
}
......@@ -825,15 +825,15 @@ onConfirm(callback: (event?: { url: string; message: string; result: JsResult })
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onConfirm((event) => {
console.log("event.url:" + event.url);
console.log("event.message:" + event.message);
console.log("event.result:" + event.result);
console.log("event.url:" + event.url)
console.log("event.message:" + event.message)
console.log("event.result:" + event.result)
AlertDialog.show({
title: 'onConfirm',
message: 'text',
......@@ -853,7 +853,7 @@ onConfirm(callback: (event?: { url: string; message: string; result: JsResult })
event.result.handleCancel()
}
})
return true;
return true
})
}
}
......@@ -885,15 +885,15 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onPrompt((event) => {
console.log("url:" + event.url);
console.log("message:" + event.message);
console.log("value:" + event.value);
console.log("url:" + event.url)
console.log("message:" + event.message)
console.log("value:" + event.value)
AlertDialog.show({
title: 'onPrompt',
message: 'text',
......@@ -913,7 +913,7 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul
event.result.handleCancel()
}
})
return true;
return true
})
}
}
......@@ -945,17 +945,17 @@ onConsole(callback: (event?: { message: ConsoleMessage }) => boolean)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onConsole((event) => {
console.log('getMessage:' + event.message.getMessage());
console.log('getSourceId:' + event.message.getSourceId());
console.log('getLineNumber:' + event.message.getLineNumber());
console.log('getMessageLevel:' + event.message.getMessageLevel());
return false;
console.log('getMessage:' + event.message.getMessage())
console.log('getSourceId:' + event.message.getSourceId())
console.log('getLineNumber:' + event.message.getLineNumber())
console.log('getMessageLevel:' + event.message.getMessageLevel())
return false
})
}
}
......@@ -982,17 +982,17 @@ onDownloadStart(callback: (event?: { url: string, userAgent: string, contentDisp
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onDownloadStart((event) => {
console.log('url:' + event.url);
console.log('userAgent:' + event.userAgent);
console.log('contentDisposition:' + event.contentDisposition);
console.log('contentLength:' + event.contentLength);
console.log('mimetype:' + event.mimetype);
console.log('url:' + event.url)
console.log('userAgent:' + event.userAgent)
console.log('contentDisposition:' + event.contentDisposition)
console.log('contentLength:' + event.contentLength)
console.log('mimetype:' + event.mimetype)
})
}
}
......@@ -1019,23 +1019,23 @@ onErrorReceive(callback: (event?: { request: WebResourceRequest, error: WebResou
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onErrorReceive((event) => {
console.log('getErrorInfo:' + event.error.getErrorInfo());
console.log('getErrorCode:' + event.error.getErrorCode());
console.log('url:' + event.request.getRequestUrl());
console.log('isMainFrame:' + event.request.isMainFrame());
console.log('isRedirect:' + event.request.isRedirect());
console.log('isRequestGesture:' + event.request.isRequestGesture());
console.log('getRequestHeader_headerKey:' + event.request.getRequestHeader().toString());
let result = event.request.getRequestHeader();
console.log('The request header result size is ' + result.length);
console.log('getErrorInfo:' + event.error.getErrorInfo())
console.log('getErrorCode:' + event.error.getErrorCode())
console.log('url:' + event.request.getRequestUrl())
console.log('isMainFrame:' + event.request.isMainFrame())
console.log('isRedirect:' + event.request.isRedirect())
console.log('isRequestGesture:' + event.request.isRequestGesture())
console.log('getRequestHeader_headerKey:' + event.request.getRequestHeader().toString())
let result = event.request.getRequestHeader()
console.log('The request header result size is ' + result.length)
for (let i of result) {
console.log('The request header key is : ' + i.headerKey + ', value is : ' + i.headerValue);
console.log('The request header key is : ' + i.headerKey + ', value is : ' + i.headerValue)
}
})
}
......@@ -1063,30 +1063,30 @@ onHttpErrorReceive(callback: (event?: { request: WebResourceRequest, response: W
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onHttpErrorReceive((event) => {
console.log('url:' + event.request.getRequestUrl());
console.log('isMainFrame:' + event.request.isMainFrame());
console.log('isRedirect:' + event.request.isRedirect());
console.log('isRequestGesture:' + event.request.isRequestGesture());
console.log('getResponseData:' + event.response.getResponseData());
console.log('getResponseEncoding:' + event.response.getResponseEncoding());
console.log('getResponseMimeType:' + event.response.getResponseMimeType());
console.log('getResponseCode:' + event.response.getResponseCode());
console.log('getReasonMessage:' + event.response.getReasonMessage());
let result = event.request.getRequestHeader();
console.log('The request header result size is ' + result.length);
console.log('url:' + event.request.getRequestUrl())
console.log('isMainFrame:' + event.request.isMainFrame())
console.log('isRedirect:' + event.request.isRedirect())
console.log('isRequestGesture:' + event.request.isRequestGesture())
console.log('getResponseData:' + event.response.getResponseData())
console.log('getResponseEncoding:' + event.response.getResponseEncoding())
console.log('getResponseMimeType:' + event.response.getResponseMimeType())
console.log('getResponseCode:' + event.response.getResponseCode())
console.log('getReasonMessage:' + event.response.getReasonMessage())
let result = event.request.getRequestHeader()
console.log('The request header result size is ' + result.length)
for (let i of result) {
console.log('The request header key is : ' + i.headerKey + ' , value is : ' + i.headerValue);
console.log('The request header key is : ' + i.headerKey + ' , value is : ' + i.headerValue)
}
let resph = event.response.getResponseHeader();
console.log('The response header result size is ' + resph.length);
let resph = event.response.getResponseHeader()
console.log('The response header result size is ' + resph.length)
for (let i of resph) {
console.log('The response header key is : ' + i.headerKey + ' , value is : ' + i.headerValue);
console.log('The response header key is : ' + i.headerKey + ' , value is : ' + i.headerValue)
}
})
}
......@@ -1114,13 +1114,13 @@ onPageBegin(callback: (event?: { url: string }) => void)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onPageBegin((event) => {
console.log('url:' + event.url);
console.log('url:' + event.url)
})
}
}
......@@ -1147,13 +1147,13 @@ onPageEnd(callback: (event?: { url: string }) => void)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onPageEnd((event) => {
console.log('url:' + event.url);
console.log('url:' + event.url)
})
}
}
......@@ -1179,7 +1179,7 @@ onProgressChange(callback: (event?: { newProgress: number }) => void)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
......@@ -1211,7 +1211,7 @@ onTitleReceive(callback: (event?: { title: string }) => void)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
......@@ -1244,13 +1244,13 @@ onRefreshAccessedHistory(callback: (event?: { url: string, isRefreshed: boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onRefreshAccessedHistory((event) => {
console.log('url:' + event.url + ' isReload:' + event.isRefreshed);
console.log('url:' + event.url + ' isReload:' + event.isRefreshed)
})
}
}
......@@ -1276,13 +1276,13 @@ onRenderExited(callback: (event?: { renderExitReason: RenderExitReason }) => voi
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'chrome://crash/', controller: this.controller })
.onRenderExited((event) => {
console.log('reason:' + event.renderExitReason);
console.log('reason:' + event.renderExitReason)
})
}
}
......@@ -1315,7 +1315,7 @@ onShowFileSelector(callback: (event?: { result: FileSelectorResult, fileSelector
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
......@@ -1338,7 +1338,7 @@ onShowFileSelector(callback: (event?: { result: FileSelectorResult, fileSelector
event.result.handleFileList(fileList)
}
})
return true;
return true
})
}
}
......@@ -1370,14 +1370,14 @@ onUrlLoadIntercept(callback: (event?: { data:string | WebResourceRequest }) => b
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onUrlLoadIntercept((event) => {
console.log('onUrlLoadIntercept ' + event.data.toString())
return true;
return true
})
}
}
......@@ -1409,9 +1409,9 @@ onInterceptRequest(callback: (event?: { request: WebResourceRequest}) => WebReso
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
responseweb: WebResourceResponse = new WebResourceResponse();
heads:Header[] = new Array();
controller: WebController = new WebController()
responseweb: WebResourceResponse = new WebResourceResponse()
heads:Header[] = new Array()
@State webdata: string = "<!DOCTYPE html>\n" +
"<html>\n"+
"<head>\n"+
......@@ -1425,7 +1425,7 @@ onInterceptRequest(callback: (event?: { request: WebResourceRequest}) => WebReso
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onInterceptRequest((event) => {
console.log('url:' + event.request.getRequestUrl());
console.log('url:' + event.request.getRequestUrl())
var head1:Header = {
headerKey:"Connection",
headerValue:"keep-alive"
......@@ -1434,15 +1434,15 @@ onInterceptRequest(callback: (event?: { request: WebResourceRequest}) => WebReso
headerKey:"Cache-Control",
headerValue:"no-cache"
}
var length = this.heads.push(head1);
length = this.heads.push(head2);
this.responseweb.setResponseHeader(this.heads);
this.responseweb.setResponseData(this.webdata);
this.responseweb.setResponseEncoding('utf-8');
this.responseweb.setResponseMimeType('text/html');
this.responseweb.setResponseCode(200);
this.responseweb.setReasonMessage('OK');
return this.responseweb;
var length = this.heads.push(head1)
length = this.heads.push(head2)
this.responseweb.setResponseHeader(this.heads)
this.responseweb.setResponseData(this.webdata)
this.responseweb.setResponseEncoding('utf-8')
this.responseweb.setResponseMimeType('text/html')
this.responseweb.setResponseCode(200)
this.responseweb.setReasonMessage('OK')
return this.responseweb
})
}
}
......@@ -1477,8 +1477,8 @@ onHttpAuthRequest(callback: (event?: { handler: HttpAuthHandler, host: string, r
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
httpAuth: boolean = false;
controller: WebController = new WebController()
httpAuth: boolean = false
build() {
Column() {
......@@ -1490,13 +1490,13 @@ onHttpAuthRequest(callback: (event?: { handler: HttpAuthHandler, host: string, r
primaryButton: {
value: 'cancel',
action: () => {
event.handler.cancel();
event.handler.cancel()
}
},
secondaryButton: {
value: 'ok',
action: () => {
this.httpAuth = event.handler.isHttpAuthInfoSaved();
this.httpAuth = event.handler.isHttpAuthInfoSaved()
if (this.httpAuth == false) {
web_webview.WebDataBase.saveHttpAuthCredentials(
event.host,
......@@ -1504,15 +1504,15 @@ onHttpAuthRequest(callback: (event?: { handler: HttpAuthHandler, host: string, r
"2222",
"2222"
)
event.handler.cancel();
event.handler.cancel()
}
}
},
cancel: () => {
event.handler.cancel();
event.handler.cancel()
}
})
return true;
return true
})
}
}
......@@ -1539,7 +1539,7 @@ onSslErrorEventReceive(callback: (event: { handler: SslErrorHandler, error: SslE
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
......@@ -1551,20 +1551,20 @@ onSslErrorEventReceive(callback: (event: { handler: SslErrorHandler, error: SslE
primaryButton: {
value: 'confirm',
action: () => {
event.handler.handleConfirm();
event.handler.handleConfirm()
}
},
secondaryButton: {
value: 'cancel',
action: () => {
event.handler.handleCancel();
event.handler.handleCancel()
}
},
cancel: () => {
event.handler.handleCancel();
event.handler.handleCancel()
}
})
return true;
return true
})
}
}
......@@ -1594,7 +1594,7 @@ onClientAuthenticationRequest(callback: (event: {handler : ClientAuthenticationH
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
......@@ -1606,20 +1606,20 @@ onClientAuthenticationRequest(callback: (event: {handler : ClientAuthenticationH
primaryButton: {
value: 'confirm',
action: () => {
event.handler.confirm("/system/etc/user.pk8", "/system/etc/chain-user.pem");
event.handler.confirm("/system/etc/user.pk8", "/system/etc/chain-user.pem")
}
},
secondaryButton: {
value: 'cancel',
action: () => {
event.handler.cancel();
event.handler.cancel()
}
},
cancel: () => {
event.handler.ignore();
event.handler.ignore()
}
})
return true;
return true
})
}
}
......@@ -1645,7 +1645,7 @@ onPermissionRequest(callback: (event?: { request: PermissionRequest }) => void)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
......@@ -1656,17 +1656,17 @@ onPermissionRequest(callback: (event?: { request: PermissionRequest }) => void)
primaryButton: {
value: 'deny',
action: () => {
event.request.deny();
event.request.deny()
}
},
secondaryButton: {
value: 'onConfirm',
action: () => {
event.request.grant(event.request.getAccessibleResource());
event.request.grant(event.request.getAccessibleResource())
}
},
cancel: () => {
event.request.deny();
event.request.deny()
}
})
})
......@@ -1701,14 +1701,14 @@ onContextMenuShow(callback: (event?: { param: WebContextMenuParam, result: WebCo
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onContextMenuShow((event) => {
console.info("x coord = " + event.param.x());
console.info("link url = " + event.param.getLinkUrl());
return true;
console.info("x coord = " + event.param.x())
console.info("link url = " + event.param.getLinkUrl())
return true
})
}
}
......@@ -1735,13 +1735,13 @@ onScroll(callback: (event: {xOffset: number, yOffset: number}) => void)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onScroll((event) => {
console.info("x = " + event.xOffset);
console.info("y = " + event.yOffset);
console.info("x = " + event.xOffset)
console.info("y = " + event.yOffset)
})
}
}
......@@ -1768,7 +1768,7 @@ onGeolocationShow(callback: (event?: { origin: string, geolocation: JsGeolocatio
@Entry
@Component
struct WebComponent {
controller:WebController = new WebController();
controller:WebController = new WebController()
build() {
Column() {
Web({ src:'www.example.com', controller:this.controller })
......@@ -1780,11 +1780,11 @@ onGeolocationShow(callback: (event?: { origin: string, geolocation: JsGeolocatio
confirm: {
value: 'onConfirm',
action: () => {
event.geolocation.invoke(event.origin, true, true);
event.geolocation.invoke(event.origin, true, true)
}
},
cancel: () => {
event.geolocation.invoke(event.origin, false, true);
event.geolocation.invoke(event.origin, false, true)
}
})
})
......@@ -1812,14 +1812,14 @@ onFullScreenEnter(callback: (event: { handler: FullScreenExitHandler }) => void)
@Entry
@Component
struct WebComponent {
controller:WebController = new WebController();
handler: FullScreenExitHandler = null;
controller:WebController = new WebController()
handler: FullScreenExitHandler = null
build() {
Column() {
Web({ src:'www.example.com', controller:this.controller })
.onFullScreenEnter((event) => {
console.log("onFullScreenEnter...");
this.handler = event.handler;
console.log("onFullScreenEnter...")
this.handler = event.handler
})
}
}
......@@ -1845,17 +1845,17 @@ onFullScreenExit(callback: () => void)
@Entry
@Component
struct WebComponent {
controller:WebController = new WebController();
handler: FullScreenExitHandler = null;
controller:WebController = new WebController()
handler: FullScreenExitHandler = null
build() {
Column() {
Web({ src:'www.example.com', controller:this.controller })
.onFullScreenExit(() => {
console.log("onFullScreenExit...");
this.handler.exitFullScreen();
console.log("onFullScreenExit...")
this.handler.exitFullScreen()
})
.onFullScreenEnter((event) => {
this.handler = event.handler;
this.handler = event.handler
})
}
}
......@@ -1884,15 +1884,15 @@ onWindowNew(callback: (event: {isAlert: boolean, isUserTrigger: boolean, targetU
@Entry
@Component
struct WebComponent {
controller:WebController = new WebController();
controller:WebController = new WebController()
build() {
Column() {
Web({ src:'www.example.com', controller: this.controller })
.multiWindowAccess(true)
.onWindowNew((event) => {
console.log("onWindowNew...");
var popController: WebController = new WebController();
event.handler.setWebController(popController);
console.log("onWindowNew...")
var popController: WebController = new WebController()
event.handler.setWebController(popController)
})
}
}
......@@ -1918,12 +1918,12 @@ onWindowExit(callback: () => void)
@Entry
@Component
struct WebComponent {
controller:WebController = new WebController();
controller:WebController = new WebController()
build() {
Column() {
Web({ src:'www.example.com', controller: this.controller })
.onWindowExit((event) => {
console.log("onWindowExit...");
console.log("onWindowExit...")
})
}
}
......@@ -2619,13 +2619,13 @@ requestFocus()
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('requestFocus')
.onClick(() => {
this.controller.requestFocus();
this.controller.requestFocus()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2652,14 +2652,14 @@ accessBackward(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('accessBackward')
.onClick(() => {
let result = this.controller.accessBackward();
console.log('result:' + result);
let result = this.controller.accessBackward()
console.log('result:' + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2686,14 +2686,14 @@ accessForward(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('accessForward')
.onClick(() => {
let result = this.controller.accessForward();
console.log('result:' + result);
let result = this.controller.accessForward()
console.log('result:' + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2726,15 +2726,15 @@ accessStep(step: number): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State steps: number = 2;
controller: WebController = new WebController()
@State steps: number = 2
build() {
Column() {
Button('accessStep')
.onClick(() => {
let result = this.controller.accessStep(this.steps);
console.log('result:' + result);
let result = this.controller.accessStep(this.steps)
console.log('result:' + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2755,13 +2755,13 @@ backward(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('backward')
.onClick(() => {
this.controller.backward();
this.controller.backward()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2782,13 +2782,13 @@ forward(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('forward')
.onClick(() => {
this.controller.forward();
this.controller.forward()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2815,14 +2815,14 @@ backOrForward(step: number): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State step: number = -2;
controller: WebController = new WebController()
@State step: number = -2
build() {
Column() {
Button('backOrForward')
.onClick(() => {
this.controller.backOrForward(this.step);
this.controller.backOrForward(this.step)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2849,14 +2849,14 @@ deleteJavaScriptRegister(name: string)
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State name: string = 'Object';
controller: WebController = new WebController()
@State name: string = 'Object'
build() {
Column() {
Button('deleteJavaScriptRegister')
.onClick(() => {
this.controller.deleteJavaScriptRegister(this.name);
this.controller.deleteJavaScriptRegister(this.name)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2883,14 +2883,14 @@ getHitTest(): HitTestType
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getHitTest')
.onClick(() => {
let hitType = this.controller.getHitTest();
console.log("hitType: " + hitType);
let hitType = this.controller.getHitTest()
console.log("hitType: " + hitType)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2916,15 +2916,15 @@ getHitTestValue(): HitTestValue
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getHitTestValue')
.onClick(() => {
let hitValue = this.controller.getHitTestValue();
console.log("hitType: " + hitValue.getType());
console.log("extra: " + hitValue.getExtra());
let hitValue = this.controller.getHitTestValue()
console.log("hitType: " + hitValue.getType())
console.log("extra: " + hitValue.getExtra())
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2950,14 +2950,14 @@ getWebId(): number
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getWebId')
.onClick(() => {
let id = this.controller.getWebId();
console.log("id: " + id);
let id = this.controller.getWebId()
console.log("id: " + id)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -2983,14 +2983,14 @@ getTitle(): string
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getTitle')
.onClick(() => {
let title = this.controller.getTitle();
console.log("title: " + title);
let title = this.controller.getTitle()
console.log("title: " + title)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3016,14 +3016,14 @@ getPageHeight(): number
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getPageHeight')
.onClick(() => {
let pageHeight = this.controller.getPageHeight();
console.log("pageHeight: " + pageHeight);
let pageHeight = this.controller.getPageHeight()
console.log("pageHeight: " + pageHeight)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3049,14 +3049,14 @@ getDefaultUserAgent(): string
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getDefaultUserAgent')
.onClick(() => {
let userAgent = this.controller.getDefaultUserAgent();
console.log("userAgent: " + userAgent);
let userAgent = this.controller.getDefaultUserAgent()
console.log("userAgent: " + userAgent)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3091,7 +3091,7 @@ baseUrl为空时，通过”data“协议加载指定的一段字符串。
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
......@@ -3101,7 +3101,7 @@ baseUrl为空时，通过”data“协议加载指定的一段字符串。
data: "<html><body bgcolor=\"white\">Source:<pre>source</pre></body></html>",
mimeType: "text/html",
encoding: "UTF-8"
});
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3133,13 +3133,13 @@ loadUrl(options: { url: string | Resource, headers?: Array\<Header\> })
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('loadUrl')
.onClick(() => {
this.controller.loadUrl({ url: 'www.example.com' });
this.controller.loadUrl({ url: 'www.example.com' })
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3160,13 +3160,13 @@ onActive(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('onActive')
.onClick(() => {
this.controller.onActive();
this.controller.onActive()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3187,13 +3187,13 @@ onInactive(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('onInactive')
.onClick(() => {
this.controller.onInactive();
this.controller.onInactive()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3219,14 +3219,14 @@ zoom(factor: number): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State factor: number = 1;
controller: WebController = new WebController()
@State factor: number = 1
build() {
Column() {
Button('zoom')
.onClick(() => {
this.controller.zoom(this.factor);
this.controller.zoom(this.factor)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3252,14 +3252,14 @@ zoomIn(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('zoomIn')
.onClick(() => {
let result = this.controller.zoomIn();
console.log("result: " + result);
let result = this.controller.zoomIn()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3285,14 +3285,14 @@ zoomOut(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('zoomOut')
.onClick(() => {
let result = this.controller.zoomOut();
console.log("result: " + result);
let result = this.controller.zoomOut()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3313,13 +3313,13 @@ refresh()
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('refresh')
.onClick(() => {
this.controller.refresh();
this.controller.refresh()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3351,10 +3351,10 @@ registerJavaScriptProxy(options: { object: object, name: string, methodList: Arr
controller: WebController = new WebController()
testObj = {
test: (data) => {
return "ArkUI Web Component";
return "ArkUI Web Component"
},
toString: () => {
console.log('Web Component toString');
console.log('Web Component toString')
}
}
build() {
......@@ -3365,7 +3365,7 @@ registerJavaScriptProxy(options: { object: object, name: string, methodList: Arr
object: this.testObj,
name: "objName",
methodList: ["test", "toString"],
});
})
})
}
Web({ src: $rawfile('index.html'), controller: this.controller })
......@@ -3385,8 +3385,8 @@ registerJavaScriptProxy(options: { object: object, name: string, methodList: Arr
</body>
<script type="text/javascript">
function htmlTest() {
str = objName.test("test function");
console.log('objName.test result:'+ str);
str = objName.test("test function")
console.log('objName.test result:'+ str)
}
</script>
</html>
......@@ -3413,7 +3413,7 @@ runJavaScript(options: { script: string, callback?: (result: string) => void })
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
@State webResult: string = ''
build() {
Column() {
......@@ -3426,8 +3426,8 @@ runJavaScript(options: { script: string, callback?: (result: string) => void })
callback: (result: string)=> {
this.webResult = result
console.info(`The test() return value is: ${result}`)
}});
console.info('url: ', e.url);
}})
console.info('url: ', e.url)
})
}
}
......@@ -3444,7 +3444,7 @@ runJavaScript(options: { script: string, callback?: (result: string) => void })
</body>
<script type="text/javascript">
function test() {
console.log('Ark WebComponent');
console.log('Ark WebComponent')
return "This value is from index.html"
}
</script>
......@@ -3465,13 +3465,13 @@ stop()
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('stop')
.onClick(() => {
this.controller.stop();
this.controller.stop()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3492,13 +3492,13 @@ clearHistory(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('clearHistory')
.onClick(() => {
this.controller.clearHistory();
this.controller.clearHistory()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3519,13 +3519,13 @@ clearSslCache(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('clearSslCache')
.onClick(() => {
this.controller.clearSslCache();
this.controller.clearSslCache()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3546,13 +3546,13 @@ clearClientAuthenticationCache(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('clearClientAuthenticationCache')
.onClick(() => {
this.controller.clearClientAuthenticationCache();
this.controller.clearClientAuthenticationCache()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3579,13 +3579,13 @@ getCookieManager(): WebCookie
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getCookieManager')
.onClick(() => {
let cookieManager = this.controller.getCookieManager();
let cookieManager = this.controller.getCookieManager()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3613,13 +3613,13 @@ createWebMessagePorts(): Array\<WebMessagePort\>
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
ports: WebMessagePort[] = null;
controller: WebController = new WebController()
ports: WebMessagePort[] = null
build() {
Column() {
Button('createWebMessagePorts')
.onClick(() => {
this.ports = this.controller.createWebMessagePorts();
this.ports = this.controller.createWebMessagePorts()
console.log("createWebMessagePorts size:" + this.ports.length)
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -3648,10 +3648,10 @@ postMessage(options: { message: WebMessageEvent, uri: string}): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
ports: WebMessagePort[] = null;
@State sendFromEts: string = 'Send this message from ets to HTML';
@State receivedFromHtml: string = 'Display received message send from HTML';
controller: WebController = new WebController()
ports: WebMessagePort[] = null
@State sendFromEts: string = 'Send this message from ets to HTML'
@State receivedFromHtml: string = 'Display received message send from HTML'
build() {
Column() {
......@@ -3660,41 +3660,41 @@ postMessage(options: { message: WebMessageEvent, uri: string}): void
// 输入框的内容发送到HTML
TextInput({placeholder: 'Send this message from ets to HTML'})
.onChange((value: string) => {
this.sendFromEts = value;
this.sendFromEts = value
})
// 1、创建两个消息端口
Button('1.CreateWebMessagePorts')
.onClick(() => {
this.ports = this.controller.createWebMessagePorts();
this.ports = this.controller.createWebMessagePorts()
console.log("createWebMessagePorts size:" + this.ports.length)
})
// 2、将其中一个消息端口发送到HTML侧，由HTML侧保存并使用。
Button('2.PostMessagePort')
.onClick(() => {
var sendPortArray = new Array(this.ports[1]);
var msgEvent = new WebMessageEvent();
msgEvent.setData("__init_port__");
msgEvent.setPorts(sendPortArray);
this.controller.postMessage({message: msgEvent, uri: "*"});
var sendPortArray = new Array(this.ports[1])
var msgEvent = new WebMessageEvent()
msgEvent.setData("__init_port__")
msgEvent.setPorts(sendPortArray)
this.controller.postMessage({message: msgEvent, uri: "*"})
})
// 3、另一个消息端口在应用侧注册回调事件。
Button('3.RegisterCallback')
.onClick(() => {
this.ports[0].onMessageEvent((result: string) => {
var msg = 'Got msg from HTML: ' + result;
this.receivedFromHtml = msg;
var msg = 'Got msg from HTML: ' + result
this.receivedFromHtml = msg
})
})
// 4、使用应用侧的端口给另一个已经发送到HTML的消息端口发送消息。
Button('4.SendDataToHtml5')
.onClick(() => {
var msg = new WebMessageEvent();
msg.setData(this.sendFromEts);
this.ports[0].postMessageEvent(msg);
var msg = new WebMessageEvent()
msg.setData(this.sendFromEts)
this.ports[0].postMessageEvent(msg)
})
Web({ src: $rawfile("index.html"), controller: this.controller })
.javaScriptAccess(true)
......@@ -3758,12 +3758,12 @@ getUrl(): string
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getUrl')
.onClick(() => {
console.log("url: " + this.controller.getUrl());
console.log("url: " + this.controller.getUrl())
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3826,14 +3826,14 @@ setCookie(url: string, value: string): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('setCookie')
.onClick(() => {
let result = this.controller.getCookieManager().setCookie("www.example.com", "a=b");
console.log("result: " + result);
let result = this.controller.getCookieManager().setCookie("www.example.com", "a=b")
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3859,14 +3859,14 @@ saveCookieSync(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('saveCookieSync')
.onClick(() => {
let result = this.controller.getCookieManager().saveCookieSync();
console.log("result: " + result);
let result = this.controller.getCookieManager().saveCookieSync()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3899,14 +3899,14 @@ getCookie(url: string): string
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getCookie')
.onClick(() => {
let value = webview.WebCookieManager.getCookie('www.example.com');
console.log("value: " + value);
let value = webview.WebCookieManager.getCookie('www.example.com')
console.log("value: " + value)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3940,14 +3940,14 @@ setCookie(url: string, value: string): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('setCookie')
.onClick(() => {
let result = web_webview.WebCookieManager.setCookie('www.example.com', 'a=b');
console.log("result: " + result);
let result = web_webview.WebCookieManager.setCookie('www.example.com', 'a=b')
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -3974,14 +3974,14 @@ saveCookieSync(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('saveCookieSync')
.onClick(() => {
let result = web_webview.WebCookieManager.saveCookieSync();
console.log("result: " + result);
let result = web_webview.WebCookieManager.saveCookieSync()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4008,7 +4008,7 @@ saveCookieAsync(): Promise\<boolean>
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
......@@ -4016,11 +4016,11 @@ saveCookieAsync(): Promise\<boolean>
.onClick(() => {
web_webview.WebCookieManager.saveCookieAsync()
.then (function(result) {
console.log("result: " + result);
console.log("result: " + result)
})
.catch(function(error) {
console.error("error: " + error);
});
console.error("error: " + error)
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4047,15 +4047,15 @@ saveCookieAsync(callback: AsyncCallback\<boolean>): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('saveCookieAsync')
.onClick(() => {
web_webview.WebCookieManager.saveCookieAsync(function(result) {
console.log("result: " + result);
});
console.log("result: " + result)
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4082,14 +4082,14 @@ isCookieAllowed(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('isCookieAllowed')
.onClick(() => {
let result = web_webview.WebCookieManager.isCookieAllowed();
console.log("result: " + result);
let result = web_webview.WebCookieManager.isCookieAllowed()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4116,13 +4116,13 @@ putAcceptCookieEnabled(accept: boolean): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('putAcceptCookieEnabled')
.onClick(() => {
web_webview.WebCookieManager.putAcceptCookieEnabled(false);
web_webview.WebCookieManager.putAcceptCookieEnabled(false)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4149,14 +4149,14 @@ isThirdCookieAllowed(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('isThirdPartyCookieAllowed')
.onClick(() => {
let result = web_webview.WebCookieManager.isThirdPartyCookieAllowed();
console.log("result: " + result);
let result = web_webview.WebCookieManager.isThirdPartyCookieAllowed()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4183,13 +4183,13 @@ putAcceptThirdPartyCookieEnabled(accept: boolean): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('putAcceptThirdPartyCookieEnabled')
.onClick(() => {
web_webview.WebCookieManager.putAcceptThirdPartyCookieEnabled(false);
web_webview.WebCookieManager.putAcceptThirdPartyCookieEnabled(false)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4216,14 +4216,14 @@ existCookie(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('existCookie')
.onClick(() => {
let result = web_webview.WebCookieManager.existCookie();
console.log("result: " + result);
let result = web_webview.WebCookieManager.existCookie()
console.log("result: " + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4244,13 +4244,13 @@ deleteEntireCookie(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('deleteEntireCookie')
.onClick(() => {
web_webview.WebCookieManager.deleteEntireCookie();
web_webview.WebCookieManager.deleteEntireCookie()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4271,13 +4271,13 @@ deleteSessionCookie(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('deleteSessionCookie')
.onClick(() => {
webview.WebCookieManager.deleteSessionCookie();
webview.WebCookieManager.deleteSessionCookie()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4308,14 +4308,14 @@ static existHttpAuthCredentials(): boolean
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('existHttpAuthCredentials')
.onClick(() => {
let result = web_webview.WebDataBase.existHttpAuthCredentials();
console.log('result: ' + result);
let result = web_webview.WebDataBase.existHttpAuthCredentials()
console.log('result: ' + result)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4337,13 +4337,13 @@ static deleteHttpAuthCredentials(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('deleteHttpAuthCredentials')
.onClick(() => {
web_webview.WebDataBase.deleteHttpAuthCredentials();
web_webview.WebDataBase.deleteHttpAuthCredentials()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4378,18 +4378,18 @@ static getHttpAuthCredentials(host: string, realm: string): Array\<string\>
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
host: string = "www.spincast.org";
realm: string = "protected example";
username_password: string[];
controller: WebController = new WebController()
host: string = "www.spincast.org"
realm: string = "protected example"
username_password: string[]
build() {
Column() {
Button('getHttpAuthCredentials')
.onClick(() => {
this.username_password = web_webview.WebDataBase.getHttpAuthCredentials(this.host, this.realm);
console.log('num: ' + this.username_password.length);
this.username_password = web_webview.WebDataBase.getHttpAuthCredentials(this.host, this.realm)
console.log('num: ' + this.username_password.length)
ForEach(this.username_password, (item) => {
console.log('username_password: ' + item);
console.log('username_password: ' + item)
}, item => item)
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -4421,14 +4421,14 @@ static saveHttpAuthCredentials(host: string, realm: string, username: string, pa
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
host: string = "www.spincast.org";
realm: string = "protected example";
controller: WebController = new WebController()
host: string = "www.spincast.org"
realm: string = "protected example"
build() {
Column() {
Button('saveHttpAuthCredentials')
.onClick(() => {
web_webview.WebDataBase.saveHttpAuthCredentials(this.host, this.realm, "Stromgol", "Laroche");
web_webview.WebDataBase.saveHttpAuthCredentials(this.host, this.realm, "Stromgol", "Laroche")
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4456,17 +4456,17 @@ static allowGeolocation(origin: string): void
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "file:///";
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('allowGeolocation')
.onClick(() => {
web_webview.GeolocationPermissions.allowGeolocation(this.origin);
web_webview.GeolocationPermissions.allowGeolocation(this.origin)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4490,17 +4490,17 @@ static deleteGeolocation(origin: string): void
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "file:///";
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('deleteGeolocation')
.onClick(() => {
web_webview.GeolocationPermissions.deleteGeolocation(this.origin);
web_webview.GeolocationPermissions.deleteGeolocation(this.origin)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4518,16 +4518,16 @@ static deleteAllGeolocation(): void
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('deleteAllGeolocation')
.onClick(() => {
web_webview.GeolocationPermissions.deleteAllGeolocation();
web_webview.GeolocationPermissions.deleteAllGeolocation()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4552,23 +4552,23 @@ static getAccessibleGeolocation(origin: string, callback: AsyncCallback\<boolean
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "file:///";
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('getAccessibleGeolocationAsync')
.onClick(() => {
web_webview.GeolocationPermissions.getAccessibleGeolocation(this.origin, (error, result) => {
if (error) {
console.log('getAccessibleGeolocationAsync error: ' + JSON.stringify(error));
return;
console.log('getAccessibleGeolocationAsync error: ' + JSON.stringify(error))
return
}
console.log('getAccessibleGeolocationAsync result: ' + result);
});
console.log('getAccessibleGeolocationAsync result: ' + result)
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4598,21 +4598,21 @@ static getAccessibleGeolocation(origin: string): Promise\<boolean\>
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "file:///";
controller: WebController = new WebController()
origin: string = "file:///"
build() {
Column() {
Button('getAccessibleGeolocationPromise')
.onClick(() => {
web_webview.GeolocationPermissions.getAccessibleGeolocation(this.origin).then(result => {
console.log('getAccessibleGeolocationPromise result: ' + result);
console.log('getAccessibleGeolocationPromise result: ' + result)
}).catch(error => {
console.log('getAccessibleGeolocationPromise error: ' + JSON.stringify(error));
});
console.log('getAccessibleGeolocationPromise error: ' + JSON.stringify(error))
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4636,23 +4636,23 @@ static getStoredGeolocation(callback: AsyncCallback\<Array\<string\>\>): void
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getStoredGeolocationAsync')
.onClick(() => {
web_webview.GeolocationPermissions.getStoredGeolocation((error, origins) => {
if (error) {
console.log('getStoredGeolocationAsync error: ' + JSON.stringify(error));
return;
console.log('getStoredGeolocationAsync error: ' + JSON.stringify(error))
return
}
let origins_str: string = origins.join();
console.log('getStoredGeolocationAsync origins: ' + origins_str);
});
let origins_str: string = origins.join()
console.log('getStoredGeolocationAsync origins: ' + origins_str)
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4682,21 +4682,21 @@ static getStoredGeolocation(): Promise\<Array\<string\>\>
```ts
// xxx.ets
import web_webview from '@ohos.web.webview';
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('getStoredGeolocationPromise')
.onClick(() => {
web_webview.GeolocationPermissions.getStoredGeolocation().then(origins => {
let origins_str: string = origins.join();
console.log('getStoredGeolocationPromise origins: ' + origins_str);
let origins_str: string = origins.join()
console.log('getStoredGeolocationPromise origins: ' + origins_str)
}).catch(error => {
console.log('getStoredGeolocationPromise error: ' + JSON.stringify(error));
});
console.log('getStoredGeolocationPromise error: ' + JSON.stringify(error))
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -4719,12 +4719,12 @@ static deleteAllData(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('deleteAllData')
.onClick(() => {
web_webview.WebStorage.deleteAllData();
web_webview.WebStorage.deleteAllData()
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
......@@ -4752,13 +4752,13 @@ static deleteOrigin(origin : string): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin";
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getHttpAuthCredentials')
.onClick(() => {
web_webview.WebStorage.deleteOrigin(this.origin);
web_webview.WebStorage.deleteOrigin(this.origin)
})
Web({ src: 'www.example.com', controller: this.controller })
.databaseAccess(true)
......@@ -4786,21 +4786,21 @@ static getOrigins(callback: AsyncCallback\<Array\<WebStorageOrigin>>) : void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin";
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getOrigins')
.onClick(() => {
web_webview.WebStorage.getOrigins((error, origins) => {
if (error) {
console.log('error: ' + error);
return;
console.log('error: ' + error)
return
}
for (let i = 0; i < origins.length; i++) {
console.log('origin: ' + origins[i].origin);
console.log('usage: ' + origins[i].usage);
console.log('quota: ' + origins[i].quota);
console.log('origin: ' + origins[i].origin)
console.log('usage: ' + origins[i].usage)
console.log('quota: ' + origins[i].quota)
}
})
})
......@@ -4830,8 +4830,8 @@ static getOrigins() : Promise\<Array\<WebStorageOrigin>>
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin";
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getOrigins')
......@@ -4839,13 +4839,13 @@ static getOrigins() : Promise\<Array\<WebStorageOrigin>>
web_webview.WebStorage.getOrigins()
.then(origins => {
for (let i = 0; i < origins.length; i++) {
console.log('origin: ' + origins[i].origin);
console.log('usage: ' + origins[i].usage);
console.log('quota: ' + origins[i].quota);
console.log('origin: ' + origins[i].origin)
console.log('usage: ' + origins[i].usage)
console.log('quota: ' + origins[i].quota)
}
})
.catch(error => {
console.log('error: ' + error);
console.log('error: ' + error)
})
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -4875,18 +4875,18 @@ static getOriginQuota(origin : string, callback : AsyncCallback\<number>) : void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin";
controller: WebController = new WebController()
origin: string = "origin"
build() {
Column() {
Button('getOriginQuota')
.onClick(() => {
web_webview.WebStorage.getOriginQuota(this.origin, (error, quota) => {
if (error) {
console.log('error: ' + error);
return;
console.log('error: ' + error)
return
}
console.log('quota: ' + quota);
console.log('quota: ' + quota)
})
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -4922,17 +4922,17 @@ static getOriginQuota(origin : string) : Promise\<number>
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin";
origin: string = "origin"
build() {
Column() {
Button('getOriginQuota')
.onClick(() => {
web_webview.WebStorage.getOriginQuota(this.origin)
.then(quota => {
console.log('quota: ' + quota);
console.log('quota: ' + quota)
})
.catch(error => {
console.log('error: ' + error);
console.log('error: ' + error)
})
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -4963,17 +4963,17 @@ static getOriginUsage(origin : string, callback : AsyncCallback\<number>) : void
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin";
origin: string = "origin"
build() {
Column() {
Button('getOriginUsage')
.onClick(() => {
web_webview.WebStorage.getOriginUsage(this.origin, (error, usage) => {
if (error) {
console.log('error: ' + error);
return;
console.log('error: ' + error)
return
}
console.log('usage: ' + usage);
console.log('usage: ' + usage)
})
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -5009,17 +5009,17 @@ static getOriginUsage(origin : string) : Promise\<number>
@Component
struct WebComponent {
controller: WebController = new WebController();
origin: string = "origin";
origin: string = "origin"
build() {
Column() {
Button('getOriginQuota')
.onClick(() => {
web_webview.WebStorage.getOriginUsage(this.origin)
.then(usage => {
console.log('usage: ' + usage);
console.log('usage: ' + usage)
})
.catch(error => {
console.log('error: ' + error);
console.log('error: ' + error)
})
})
Web({ src: 'www.example.com', controller: this.controller })
......@@ -5047,27 +5047,27 @@ searchAllAsync(searchString: string): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
@State searchString: string = "xxx";
controller: WebController = new WebController()
@State searchString: string = "xxx"
build() {
Column() {
Button('searchString')
.onClick(() => {
this.controller.searchAllAsync(this.searchString);
this.controller.searchAllAsync(this.searchString)
})
Button('clearMatches')
.onClick(() => {
this.controller.clearMatches();
this.controller.clearMatches()
})
Button('searchNext')
.onClick(() => {
this.controller.searchNext(true);
this.controller.searchNext(true)
})
Web({ src: 'www.example.com', controller: this.controller })
.onSearchResultReceive(ret => {
console.log("on search result receive:" + "[cur]" + ret.activeMatchOrdinal +
"[total]" + ret.numberOfMatches + "[isDone]"+ ret.isDoneCounting);
"[total]" + ret.numberOfMatches + "[isDone]"+ ret.isDoneCounting)
})
}
}
......@@ -5087,13 +5087,13 @@ clearMatches(): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('clearMatches')
.onClick(() => {
this.controller.clearMatches();
this.controller.clearMatches()
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -5121,13 +5121,13 @@ searchNext(forward: boolean): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('searchNext')
.onClick(() => {
this.controller.searchNext(true);
this.controller.searchNext(true)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -5156,14 +5156,14 @@ onSearchResultReceive(callback: (event?: {activeMatchOrdinal: number, numberOfMa
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Web({ src: 'www.example.com', controller: this.controller })
.onSearchResultReceive(ret => {
console.log("on search result receive:" + "[cur]" + ret.activeMatchOrdinal +
"[total]" + ret.numberOfMatches + "[isDone]"+ ret.isDoneCounting);
"[total]" + ret.numberOfMatches + "[isDone]"+ ret.isDoneCounting)
})
}
}
......@@ -5290,17 +5290,17 @@ storeWebArchive(baseName: string, autoName: boolean, callback: AsyncCallback<str
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
controller: WebController = new WebController()
build() {
Column() {
Button('saveWebArchive')
.onClick(() => {
let webAsyncController = new web_webview.WebAsyncController(this.controller);
let webAsyncController = new web_webview.WebAsyncController(this.controller)
webAsyncController.storeWebArchive("/data/storage/el2/base/", true, (filename) => {
if (filename != null) {
console.info(`save web archive success: ${filename}`)
}
});
})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -5381,16 +5381,16 @@ postMessageEvent(message: WebMessageEvent): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
ports: WebMessagePort[] = null;
controller: WebController = new WebController()
ports: WebMessagePort[] = null
build() {
Column() {
Button('postMessageEvent')
.onClick(() => {
var msg = new WebMessageEvent();
msg.setData("post message from ets to html5");
this.ports[0].postMessageEvent(msg);
var msg = new WebMessageEvent()
msg.setData("post message from ets to html5")
this.ports[0].postMessageEvent(msg)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -5416,8 +5416,8 @@ onMessageEvent(callback: (result: string) => void): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
ports: WebMessagePort[] = null;
controller: WebController = new WebController()
ports: WebMessagePort[] = null
build() {
Column() {
......@@ -5461,9 +5461,9 @@ getData(): string
Button('getPorts')
.onClick(() => {
var msgEvent = new WebMessageEvent();
msgEvent.setData("message event data");
var messageData = msgEvent.getData();
console.log("message is:" + messageData);
msgEvent.setData("message event data")
var messageData = msgEvent.getData()
console.log("message is:" + messageData)
})
}
}
......@@ -5488,16 +5488,16 @@ setData(data: string): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
ports: WebMessagePort[] = null;
controller: WebController = new WebController()
ports: WebMessagePort[] = null
build() {
Column() {
Button('setData')
.onClick(() => {
var msg = new WebMessageEvent();
msg.setData("post message from ets to HTML5");
this.ports[0].postMessageEvent(msg);
var msg = new WebMessageEvent()
msg.setData("post message from ets to HTML5")
this.ports[0].postMessageEvent(msg)
})
Web({ src: 'www.example.com', controller: this.controller })
}
......@@ -5522,16 +5522,16 @@ getPorts(): Array\<WebMessagePort\>
@Entry
@Component
struct WebComponent {
ports: WebMessagePort[] = null;
ports: WebMessagePort[] = null
build() {
Column() {
Button('getPorts')
.onClick(() => {
var sendPortArray = new Array(this.ports[0]);
var msgEvent = new WebMessageEvent();
msgEvent.setPorts(sendPortArray);
var getPorts = msgEvent.getPorts();
console.log("Ports is:" + getPorts);
var sendPortArray = new Array(this.ports[0])
var msgEvent = new WebMessageEvent()
msgEvent.setPorts(sendPortArray)
var getPorts = msgEvent.getPorts()
console.log("Ports is:" + getPorts)
})
}
}
......@@ -5556,18 +5556,18 @@ setPorts(ports: Array\<WebMessagePort\>): void
@Entry
@Component
struct WebComponent {
controller: WebController = new WebController();
ports: WebMessagePort[] = null;
controller: WebController = new WebController()
ports: WebMessagePort[] = null
build() {
Column() {
Button('setPorts')
.onClick(() => {
var sendPortArray = new Array(this.ports[1]);
var msgEvent = new WebMessageEvent();
msgEvent.setData("__init_ports__");
msgEvent.setPorts(sendPortArray);
this.controller.postMessage({message: msgEvent, uri: "*"});
var sendPortArray = new Array(this.ports[1])
var msgEvent = new WebMessageEvent()
msgEvent.setData("__init_ports__")
msgEvent.setPorts(sendPortArray)
this.controller.postMessage({message: msgEvent, uri: "*"})
})
Web({ src: 'www.example.com', controller: this.controller })
}
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-xcomponent.md
浏览文件 @ deb78999
......@@ -107,7 +107,7 @@ getXComponentContext()
```ts
// xxx.ets
import camera from '@ohos.multimedia.camera';
import camera from '@ohos.multimedia.camera'
@Entry
@Component
struct PreviewArea {
......@@ -122,9 +122,9 @@ struct PreviewArea {
})
.onLoad(() => {
this.xcomponentController.setXComponentSurfaceSize({surfaceWidth:1920,surfaceHeight:1080});
this.surfaceId = this.xcomponentController.getXComponentSurfaceId();
this.surfaceId = this.xcomponentController.getXComponentSurfaceId()
camera.createPreviewOutput(this.surfaceId).then((previewOutput) => {
console.log('Promise returned with the PreviewOutput instance');
console.log('Promise returned with the PreviewOutput instance')
})
})
.width('640px')
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-longpressgesture.md
浏览文件 @ deb78999
......@@ -36,7 +36,7 @@ LongPressGesture(value?: { fingers?: number, repeat?: boolean, duration?: number
@Entry
@Component
struct LongPressGestureExample {
@State count: number = 0;
@State count: number = 0
build() {
Column() {
......@@ -47,12 +47,12 @@ struct LongPressGestureExample {
// 由于repeat设置为true，长按动作存在时会连续触发，触发间隔为duration（默认值500ms）
.onAction((event: GestureEvent) => {
if (event.repeat) {
this.count++;
this.count++
}
})
// 长按动作一结束触发
.onActionEnd(() => {
this.count = 0;
this.count = 0
})
)
}
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md
浏览文件 @ deb78999
......@@ -75,11 +75,11 @@ PanGestureOptions(value?: { fingers?: number; direction?: PanDirection; distance
@Entry
@Component
struct PanGestureExample {
@State offsetX: number = 0;
@State offsetY: number = 0;
@State positionX: number = 0;
@State positionY: number = 0;
private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Left | PanDirection.Right });
@State offsetX: number = 0
@State offsetY: number = 0
@State positionX: number = 0
@State positionY: number = 0
private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Left | PanDirection.Right })
build() {
Column() {
......@@ -96,24 +96,24 @@ struct PanGestureExample {
.gesture(
PanGesture(this.panOption)
.onActionStart((event: GestureEvent) => {
console.info('Pan start');
console.info('Pan start')
})
.onActionUpdate((event: GestureEvent) => {
this.offsetX = this.positionX + event.offsetX;
this.offsetY = this.positionY + event.offsetY;
this.offsetX = this.positionX + event.offsetX
this.offsetY = this.positionY + event.offsetY
})
.onActionEnd(() => {
this.positionX = this.offsetX;
this.positionY = this.offsetY;
console.info('Pan end');
this.positionX = this.offsetX
this.positionY = this.offsetY
console.info('Pan end')
})
)
Button('修改PanGesture触发条件')
.onClick(() => {
// 将PanGesture手势事件触发条件改为双指以任意方向拖动
this.panOption.setDirection(PanDirection.All);
this.panOption.setFingers(2);
this.panOption.setDirection(PanDirection.All)
this.panOption.setFingers(2)
})
}
}
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pinchgesture.md
浏览文件 @ deb78999
......@@ -36,10 +36,10 @@ PinchGesture(value?: { fingers?: number, distance?: number })
@Entry
@Component
struct PinchGestureExample {
@State scaleValue: number = 1;
@State pinchValue: number = 1;
@State pinchX: number = 0;
@State pinchY: number = 0;
@State scaleValue: number = 1
@State pinchValue: number = 1
@State pinchX: number = 0
@State pinchY: number = 0
build() {
Column() {
......@@ -57,16 +57,16 @@ struct PinchGestureExample {
.gesture(
PinchGesture({ fingers: 3 })
.onActionStart((event: GestureEvent) => {
console.info('Pinch start');
console.info('Pinch start')
})
.onActionUpdate((event: GestureEvent) => {
this.scaleValue = this.pinchValue * event.scale;
this.pinchX = event.pinchCenterX;
this.pinchY = event.pinchCenterY;
this.scaleValue = this.pinchValue * event.scale
this.pinchX = event.pinchCenterX
this.pinchY = event.pinchCenterY
})
.onActionEnd(() => {
this.pinchValue = this.scaleValue;
console.info('Pinch end');
this.pinchValue = this.scaleValue
console.info('Pinch end')
})
)
}.width('100%')
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-rotationgesture.md
浏览文件 @ deb78999
......@@ -36,8 +36,8 @@ RotationGesture(value?: { fingers?: number, angle?: number })
@Entry
@Component
struct RotationGestureExample {
@State angle: number = 0;
@State rotateValue: number = 0;
@State angle: number = 0
@State rotateValue: number = 0
build() {
Column() {
......@@ -54,14 +54,14 @@ struct RotationGestureExample {
.gesture(
RotationGesture()
.onActionStart((event: GestureEvent) => {
console.info('Rotation start');
console.info('Rotation start')
})
.onActionUpdate((event: GestureEvent) => {
this.angle = this.rotateValue + event.angle;
this.angle = this.rotateValue + event.angle
})
.onActionEnd(() => {
this.rotateValue = this.angle;
console.info('Rotation end');
this.rotateValue = this.angle
console.info('Rotation end')
})
)
}.width('100%')
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-swipegesture.md
浏览文件 @ deb78999
......@@ -42,8 +42,8 @@ SwipeGesture(value?: { fingers?: number; direction?: SwipeDirection; speed?: num
@Entry
@Component
struct SwipeGestureExample {
@State rotateAngle: number = 0;
@State speed: number = 1;
@State rotateAngle: number = 0
@State speed: number = 1
build() {
Column() {
......@@ -60,8 +60,8 @@ struct SwipeGestureExample {
.gesture(
SwipeGesture({ direction: SwipeDirection.Vertical })
.onAction((event: GestureEvent) => {
this.speed = event.speed;
this.rotateAngle = event.angle;
this.speed = event.speed
this.rotateAngle = event.angle
})
)
}.width('100%')
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md
浏览文件 @ deb78999
......@@ -33,7 +33,7 @@ TapGesture(value?: { count?: number, fingers?: number })
@Entry
@Component
struct TapGestureExample {
@State value: string = '';
@State value: string = ''
build() {
Column() {
......@@ -42,7 +42,7 @@ struct TapGestureExample {
.gesture(
TapGesture({ count: 2 })
.onAction((event: GestureEvent) => {
this.value = JSON.stringify(event.fingerList[0]);
this.value = JSON.stringify(event.fingerList[0])
})
)
Text(this.value)
......
zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md
浏览文件 @ deb78999
......@@ -66,8 +66,8 @@ RenderingContextSettings(antialias?: boolean)
@Entry
@Component
struct FillStyleExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -96,8 +96,8 @@ struct FillStyleExample {
@Entry
@Component
struct LineWidthExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -126,8 +126,8 @@ struct LineWidthExample {
@Entry
@Component
struct StrokeStyleExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -158,8 +158,8 @@ struct StrokeStyleExample {
@Entry
@Component
struct LineCapExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -192,8 +192,8 @@ struct LineCapExample {
@Entry
@Component
struct LineJoinExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -227,8 +227,8 @@ struct LineJoinExample {
@Entry
@Component
struct MiterLimit {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -262,8 +262,8 @@ struct MiterLimit {
@Entry
@Component
struct Fonts {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -292,8 +292,8 @@ struct Fonts {
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -337,8 +337,8 @@ struct CanvasExample {
@Entry
@Component
struct TextBaseline {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -382,8 +382,8 @@ struct TextBaseline {
@Entry
@Component
struct GlobalAlpha {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -415,8 +415,8 @@ struct GlobalAlpha {
@Entry
@Component
struct LineDashOffset {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -427,8 +427,8 @@ struct LineDashOffset {
.onReady(() =>{
this.context.arc(100, 75, 50, 0, 6.28)
this.context.setLineDash([10,20])
this.context.lineDashOffset = 10.0;
this.context.stroke();
this.context.lineDashOffset = 10.0
this.context.stroke()
})
}
.width('100%')
......@@ -461,8 +461,8 @@ struct LineDashOffset {
@Entry
@Component
struct GlobalCompositeOperation {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -499,8 +499,8 @@ struct GlobalCompositeOperation {
@Entry
@Component
struct ShadowBlur {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -531,8 +531,8 @@ struct ShadowBlur {
@Entry
@Component
struct ShadowColor {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -563,8 +563,8 @@ struct ShadowColor {
@Entry
@Component
struct ShadowOffsetX {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -596,8 +596,8 @@ struct ShadowOffsetX {
@Entry
@Component
struct ShadowOffsetY {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
Canvas(this.context)
......@@ -628,9 +628,9 @@ struct ShadowOffsetY {
@Entry
@Component
struct ImageSmoothingEnabled {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg");
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg")
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -677,8 +677,8 @@ fillRect(x: number, y: number, w: number, h: number): void
@Entry
@Component
struct FillRect {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -721,8 +721,8 @@ strokeRect(x: number, y: number, w: number, h: number): void
@Entry
@Component
struct StrokeRect {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -765,8 +765,8 @@ clearRect(x: number, y: number, w: number, h: number): void
@Entry
@Component
struct ClearRect {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -811,8 +811,8 @@ fillText(text: string, x: number, y: number, maxWidth?: number): void
@Entry
@Component
struct FillText {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -856,8 +856,8 @@ strokeText(text: string, x: number, y: number, maxWidth?:number): void
@Entry
@Component
struct StrokeText {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -925,8 +925,8 @@ measureText(text: string): TextMetrics
@Entry
@Component
struct MeasureText {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -968,8 +968,8 @@ stroke(path?: Path2D): void
@Entry
@Component
struct Stroke {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1008,8 +1008,8 @@ beginPath(): void
@Entry
@Component
struct BeginPath {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1055,8 +1055,8 @@ moveTo(x: number, y: number): void
@Entry
@Component
struct MoveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1100,8 +1100,8 @@ lineTo(x: number, y: number): void
@Entry
@Component
struct LineTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1138,8 +1138,8 @@ closePath(): void
@Entry
@Component
struct ClosePath {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1176,7 +1176,7 @@ createPattern(image: ImageBitmap, repetition: string | null): CanvasPattern | nu
| 参数 | 类型 | 必填 | 描述 |
| ---------- | -------------------------------------------------- | ---- | ------------------------------------------------------------ |
| image | [ImageBitmap](ts-components-canvas-imagebitmap.md) | 是 | 图源对象，具体参考ImageBitmap对象。 |
| repetition | string | 是 | 设置图像重复的方式，取值为：'repeat'、'repeat-x'、&nbsp;'repeat-y'、'no-repeat'。<br/>默认值：'' |
| repetition | string | 是 | 设置图像重复的方式，取值为：'repeat'、'repeat-x'、&nbsp'repeat-y'、'no-repeat'。<br/>默认值：'' |
**返回值：**：
......@@ -1191,9 +1191,9 @@ createPattern(image: ImageBitmap, repetition: string | null): CanvasPattern | nu
@Entry
@Component
struct CreatePattern {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg");
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg")
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1240,8 +1240,8 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
@Entry
@Component
struct BezierCurveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1287,8 +1287,8 @@ quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void
@Entry
@Component
struct QuadraticCurveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1297,10 +1297,10 @@ quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.beginPath();
this.context.moveTo(20, 20);
this.context.quadraticCurveTo(100, 100, 200, 20);
this.context.stroke();
this.context.beginPath()
this.context.moveTo(20, 20)
this.context.quadraticCurveTo(100, 100, 200, 20)
this.context.stroke()
})
}
.width('100%')
......@@ -1336,8 +1336,8 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
@Entry
@Component
struct Arc {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1383,8 +1383,8 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
@Entry
@Component
struct ArcTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1393,9 +1393,9 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.moveTo(100, 20);
this.context.arcTo(150, 20, 150, 70, 50);
this.context.stroke();
this.context.moveTo(100, 20)
this.context.arcTo(150, 20, 150, 70, 50)
this.context.stroke()
})
}
.width('100%')
......@@ -1433,8 +1433,8 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1479,8 +1479,8 @@ rect(x: number, y: number, w: number, h: number): void
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1522,8 +1522,8 @@ fill(fillRule?: CanvasFillRule): void
@Entry
@Component
struct Fill {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1574,17 +1574,17 @@ struct Fill {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
let region = new Path2D();
region.moveTo(30, 90);
region.lineTo(110, 20);
region.lineTo(240, 130);
region.lineTo(60, 130);
region.lineTo(190, 20);
region.lineTo(270, 90);
region.closePath();
let region = new Path2D()
region.moveTo(30, 90)
region.lineTo(110, 20)
region.lineTo(240, 130)
region.lineTo(60, 130)
region.lineTo(190, 20)
region.lineTo(270, 90)
region.closePath()
// Fill path
this.context.fillStyle = 'green';
this.context.fill(region, "evenodd");
this.context.fillStyle = 'green'
this.context.fill(region, "evenodd")
})
}
.width('100%')
......@@ -1615,8 +1615,8 @@ clip(fillRule?: CanvasFillRule): void
@Entry
@Component
struct Clip {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1669,9 +1669,9 @@ struct Clip {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
let region = new Path2D();
region.rect(80,10,20,130);
region.rect(40,50,100,50);
let region = new Path2D()
region.rect(80,10,20,130)
region.rect(40,50,100,50)
this.context.clip(region,"evenodd")
this.context.fillStyle = "rgb(255,0,0)"
this.context.fillRect(0, 0, this.context.width, this.context.height)
......@@ -1739,8 +1739,8 @@ rotate(angle: number): void
@Entry
@Component
struct Rotate {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1782,8 +1782,8 @@ scale(x: number, y: number): void
@Entry
@Component
struct Scale {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1838,8 +1838,8 @@ transform方法对应一个变换矩阵，想对一个图形进行变化的时
@Entry
@Component
struct Transform {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1891,8 +1891,8 @@ setTransform方法使用的参数和transform()方法相同，但setTransform()
@Entry
@Component
struct SetTransform {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1942,8 +1942,8 @@ translate(x: number, y: number): void
@Entry
@Component
struct Translate {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -1998,9 +1998,9 @@ drawImage(image: ImageBitmap | PixelMap, sx: number, sy: number, sw: number, sh:
@Entry
@Component
struct ImageExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private img:ImageBitmap = new ImageBitmap("common/images/example.jpg");
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private img:ImageBitmap = new ImageBitmap("common/images/example.jpg")
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -2009,7 +2009,7 @@ drawImage(image: ImageBitmap | PixelMap, sx: number, sy: number, sw: number, sh:
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.drawImage( this.img,0,0,500,500,0,0,400,200);
this.context.drawImage( this.img,0,0,500,500,0,0,400,200)
})
}
.width('100%')
......@@ -2102,8 +2102,8 @@ getImageData(sx: number, sy: number, sw: number, sh: number): ImageData
@Entry
@Component
struct GetImageData {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private img:ImageBitmap = new ImageBitmap("/common/images/1234.png")
build() {
......@@ -2113,9 +2113,9 @@ struct GetImageData {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.drawImage(this.img,0,0,130,130);
var imagedata = this.context.getImageData(50,50,130,130);
this.context.putImageData(imagedata,150,150);
this.context.drawImage(this.img,0,0,130,130)
var imagedata = this.context.getImageData(50,50,130,130)
this.context.putImageData(imagedata,150,150)
})
}
.width('100%')
......@@ -2154,8 +2154,8 @@ putImageData(imageData: ImageData, dx: number, dy: number, dirtyX: number, dirty
@Entry
@Component
struct PutImageData {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -2268,7 +2268,7 @@ struct CanvasGetLineDash {
.onReady(() => {
this.context.arc(100, 75, 50, 0, 6.28)
this.context.setLineDash([10,20])
this.context.stroke();
this.context.stroke()
let res = this.context.getLineDash()
})
}
......@@ -2382,7 +2382,7 @@ struct ToDataURL {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
var dataURL = this.context.toDataURL();
var dataURL = this.context.toDataURL()
})
}
.width('100%')
......@@ -2405,8 +2405,8 @@ restore(): void
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -2415,11 +2415,11 @@ restore(): void
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.save(); // save the default state
this.context.fillStyle = "green";
this.context.fillRect(20, 20, 100, 100);
this.context.restore(); // restore to the default state
this.context.fillRect(150, 75, 100, 100);
this.context.save() // save the default state
this.context.fillStyle = "green"
this.context.fillRect(20, 20, 100, 100)
this.context.restore() // restore to the default state
this.context.fillRect(150, 75, 100, 100)
})
}
.width('100%')
......@@ -2443,8 +2443,8 @@ save(): void
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -2453,11 +2453,11 @@ save(): void
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.save(); // save the default state
this.context.fillStyle = "green";
this.context.fillRect(20, 20, 100, 100);
this.context.restore(); // restore to the default state
this.context.fillRect(150, 75, 100, 100);
this.context.save() // save the default state
this.context.fillStyle = "green"
this.context.fillRect(20, 20, 100, 100)
this.context.restore() // restore to the default state
this.context.fillRect(150, 75, 100, 100)
})
}
.width('100%')
......@@ -2490,8 +2490,8 @@ createLinearGradient(x0: number, y0: number, x1: number, y1: number): void
@Entry
@Component
struct CreateLinearGradient {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -2541,8 +2541,8 @@ createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number,
@Entry
@Component
struct CreateRadialGradient {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......
zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md
浏览文件 @ deb78999
......@@ -39,12 +39,12 @@ GestureGroup(mode: GestureMode, ...gesture: GestureType[])
@Entry
@Component
struct GestureGroupExample {
@State count: number = 0;
@State offsetX: number = 0;
@State offsetY: number = 0;
@State positionX: number = 0;
@State positionY: number = 0;
@State borderStyles: BorderStyle = BorderStyle.Solid;
@State count: number = 0
@State offsetX: number = 0
@State offsetY: number = 0
@State positionX: number = 0
@State positionY: number = 0
@State borderStyles: BorderStyle = BorderStyle.Solid
build() {
Column() {
......@@ -57,37 +57,37 @@ struct GestureGroupExample {
.margin(20)
.border({ width: 3, style: this.borderStyles })
.gesture(
//以下组合手势为顺序识别，当长按手势事件未正常触发时则不会触发拖动手势事件
// 以下组合手势为顺序识别，当长按手势事件未正常触发时则不会触发拖动手势事件
GestureGroup(GestureMode.Sequence,
LongPressGesture({ repeat: true })
.onAction((event: GestureEvent) => {
if (event.repeat) {
this.count++;
this.count++
}
console.info('LongPress onAction');
console.info('LongPress onAction')
})
.onActionEnd(() => {
console.info('LongPress end');
console.info('LongPress end')
}),
PanGesture()
.onActionStart(() => {
this.borderStyles = BorderStyle.Dashed;
console.info('pan start');
this.borderStyles = BorderStyle.Dashed
console.info('pan start')
})
.onActionUpdate((event: GestureEvent) => {
this.offsetX = this.positionX + event.offsetX;
this.offsetY = this.positionY + event.offsetY;
console.info('pan update');
this.offsetX = this.positionX + event.offsetX
this.offsetY = this.positionY + event.offsetY
console.info('pan update')
})
.onActionEnd(() => {
this.positionX = this.offsetX;
this.positionY = this.offsetY;
this.borderStyles = BorderStyle.Solid;
console.info('pan end');
this.positionX = this.offsetX
this.positionY = this.offsetY
this.borderStyles = BorderStyle.Solid
console.info('pan end')
})
)
.onCancel(() => {
console.info('sequence gesture canceled');
console.info('sequence gesture canceled')
})
)
}
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md
浏览文件 @ deb78999
......@@ -10,10 +10,10 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
## 属性
| 属性 | 类型 | 描述 |
| 属性 | 类型 | 描述 |
| -------- | -------- | -------- |
| width | number | ImageBitmap的像素宽度。 |
| height | number | ImageBitmap的像素高度。 |
| width | number | ImageBitmap的像素宽度。 |
| height | number | ImageBitmap的像素高度。 |
**示例：**
......@@ -22,9 +22,9 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
@Entry
@Component
struct ImageExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private img:ImageBitmap = new ImageBitmap("common/images/example.jpg");
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private img:ImageBitmap = new ImageBitmap("common/images/example.jpg")
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
......@@ -33,7 +33,7 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.drawImage( this.img,0,0,500,500,0,0,400,200);
this.context.drawImage( this.img,0,0,500,500,0,0,400,200)
})
}
.width('100%')
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagedata.md
浏览文件 @ deb78999
......@@ -10,11 +10,11 @@ ImageData对象可以存储canvas渲染的像素数据。
## 属性
| 属性 | 类型 | 描述 |
| 属性 | 类型 | 描述 |
| -------- | -------- | -------- |
| width | number | 矩形区域实际像素宽度。 |
| height | number | 矩形区域实际像素高度。 |
| data | Uint8ClampedArray | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |
| width | number | 矩形区域实际像素宽度。 |
| height | number | 矩形区域实际像素高度。 |
| data | Uint8ClampedArray | 一维数组，保存了相应的颜色数据，数据值范围为0到255。 |
**示例：**
......@@ -23,8 +23,8 @@ ImageData对象可以存储canvas渲染的像素数据。
@Entry
@Component
struct Translate {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private img:ImageBitmap = new ImageBitmap("/common/images/1234.png")
build() {
......@@ -34,9 +34,9 @@ struct Translate {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.context.drawImage(this.img,0,0,130,130);
var imagedata = this.context.getImageData(50,50,130,130);
this.context.putImageData(imagedata,150,150);
this.context.drawImage(this.img,0,0,130,130)
var imagedata = this.context.getImageData(50,50,130,130)
this.context.putImageData(imagedata,150,150)
})
}
.width('100%')
......
zh-cn/application-dev/reference/arkui-ts/ts-container-ability-component.md
浏览文件 @ deb78999
......@@ -65,10 +65,10 @@ struct MyComponent {
},
})
.onConnect(() => {
console.log('AbilityComponent connect');
console.log('AbilityComponent connect')
})
.onDisconnect(() => {
console.log('AbilityComponent disconnect');
console.log('AbilityComponent disconnect')
})
}
}
......
zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
浏览文件 @ deb78999
......@@ -6,10 +6,6 @@
> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
## 子组件
可以包含子组件。
......@@ -24,10 +20,10 @@ Counter()
不支持通用事件和手势， 仅支持如下事件：
| 名称 | 功能描述 |
| 名称 | 功能描述 |
| -------- | -------- |
| onInc(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值增加事件。 |
| onDec(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值减少事件。 |
| onInc(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值增加事件。 |
| onDec(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值减少事件。 |
## 示例
......
zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md
浏览文件 @ deb78999
......@@ -168,8 +168,8 @@ scrollBy(dx: Length, dy: Length): void
@Entry
@Component
struct ScrollExample {
scroller: Scroller = new Scroller();
private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
scroller: Scroller = new Scroller()
private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
build() {
Stack({ alignContent: Alignment.TopStart }) {
......@@ -193,33 +193,33 @@ struct ScrollExample {
.scrollBarWidth(30) // 滚动条宽度
.edgeEffect(EdgeEffect.None)
.onScroll((xOffset: number, yOffset: number) => {
console.info(xOffset + ' ' + yOffset);
console.info(xOffset + ' ' + yOffset)
})
.onScrollEdge((side: Edge) => {
console.info('To the edge');
console.info('To the edge')
})
.onScrollEnd(() => {
console.info('Scroll Stop');
console.info('Scroll Stop')
})
Button('scroll 150')
.onClick(() => { // 点击后下滑指定距离150.0vp
this.scroller.scrollBy(0,150);
this.scroller.scrollBy(0,150)
})
.margin({ top: 10, left: 20 })
Button('scroll 100')
.onClick(() => { // 点击后滑动到指定位置，即下滑100.0vp的距离
this.scroller.scrollTo({ xOffset: 0, yOffset: this.scroller.currentOffset().yOffset + 100 });
this.scroller.scrollTo({ xOffset: 0, yOffset: this.scroller.currentOffset().yOffset + 100 })
})
.margin({ top: 60, left: 20 })
Button('back top')
.onClick(() => { // 点击后回到顶部
this.scroller.scrollEdge(Edge.Top);
this.scroller.scrollEdge(Edge.Top)
})
.margin({ top: 110, left: 20 })
Button('next page')
.onClick(() => { // 点击后滑到下一页
this.scroller.scrollPage({ next: true });
this.scroller.scrollPage({ next: true })
})
.margin({ top: 170, left: 20 })
}.width('100%').height('100%').backgroundColor(0xDCDCDC)
......@@ -235,8 +235,8 @@ struct ScrollExample {
@Component
struct NestedScroll {
@State listPosition: number = 0; // 0代表滚动到List顶部，1代表中间值，2代表滚动到List底部。
private arr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
private scroller: Scroller = new Scroller();
private arr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
private scroller: Scroller = new Scroller()
build() {
Flex() {
......@@ -257,17 +257,17 @@ struct NestedScroll {
}
.width("100%").height("50%").edgeEffect(EdgeEffect.None)
.onReachStart(() => {
this.listPosition = 0;
this.listPosition = 0
})
.onReachEnd(() => {
this.listPosition = 2;
this.listPosition = 2
})
.onScrollBegin((dx: number, dy: number) => {
if ((this.listPosition == 0 && dy >= 0) || (this.listPosition == 2 && dy <= 0)) {
this.scroller.scrollBy(0, -dy);
return { dxRemain: dx, dyRemain: 0 };
this.scroller.scrollBy(0, -dy)
return { dxRemain: dx, dyRemain: 0 }
}
this.listPosition = 1;
this.listPosition = 1
return { dxRemain: dx, dyRemain: dy };
})
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-shape.md
浏览文件 @ deb78999
......@@ -152,12 +152,12 @@ struct ShapeExample {
@Entry
@Component
struct ShapeMeshExample {
@State columnVal: number = 0;
@State rowVal: number = 0;
@State count: number = 0;
@State verts: Array<number> = [];
@State shapeWidth: number = 600;
@State shapeHeight: number = 600;
@State columnVal: number = 0
@State rowVal: number = 0
@State count: number = 0
@State verts: Array<number> = []
@State shapeWidth: number = 600
@State shapeHeight: number = 600
build() {
Column() {
......@@ -186,34 +186,34 @@ struct ShapeMeshExample {
.height(this.shapeHeight + 'px')
// 手指触摸Shape组件时会显示mesh扭曲效果
.onTouch((event: TouchEvent) => {
var touchX = event.touches[0].x * 2;
var touchY = event.touches[0].y * 2;
this.columnVal = 20;
this.rowVal = 20;
this.count = (this.columnVal + 1) * (this.rowVal + 1);
var orig = [this.count * 2];
var index = 0;
var touchX = event.touches[0].x * 2
var touchY = event.touches[0].y * 2
this.columnVal = 20
this.rowVal = 20
this.count = (this.columnVal + 1) * (this.rowVal + 1)
var orig = [this.count * 2]
var index = 0
for (var i = 0; i <= this.rowVal; i++) {
var fy = this.shapeWidth * i / this.rowVal;
var fy = this.shapeWidth * i / this.rowVal
for (var j = 0; j <= this.columnVal; j++) {
var fx = this.shapeWidth * j / this.columnVal;
orig[index * 2 + 0] = this.verts[index * 2 + 0] = fx;
orig[index * 2 + 1] = this.verts[index * 2 + 1] = fy;
var fx = this.shapeWidth * j / this.columnVal
orig[index * 2 + 0] = this.verts[index * 2 + 0] = fx
orig[index * 2 + 1] = this.verts[index * 2 + 1] = fy
index++;
}
}
for (var k = 0; k < this.count * 2; k += 2) {
var dx = touchX - orig[k + 0];
var dy = touchY - orig[k + 1];
var dd = dx * dx + dy * dy;
var d = Math.sqrt(dd);
var pull = 80000 / (dd * d);
var dx = touchX - orig[k + 0]
var dy = touchY - orig[k + 1]
var dd = dx * dx + dy * dy
var d = Math.sqrt(dd)
var pull = 80000 / (dd * d)
if (pull >= 1) {
this.verts[k + 0] = touchX;
this.verts[k + 1] = touchY;
this.verts[k + 0] = touchX
this.verts[k + 1] = touchY
} else {
this.verts[k + 0] = orig[k + 0] + dx * pull;
this.verts[k + 1] = orig[k + 1] + dy * pull;
this.verts[k + 0] = orig[k + 0] + dx * pull
this.verts[k + 1] = orig[k + 1] + dy * pull
}
}
})
......
zh-cn/application-dev/reference/arkui-ts/ts-gesture-settings.md
浏览文件 @ deb78999
......@@ -85,8 +85,8 @@
@Entry
@Component
struct GestureSettingsExample {
@State priorityTestValue: string = '';
@State parallelTestValue: string = '';
@State priorityTestValue: string = ''
@State parallelTestValue: string = ''
build() {
Column() {
......@@ -95,7 +95,7 @@ struct GestureSettingsExample {
.gesture(
TapGesture()
.onAction(() => {
this.priorityTestValue += '\nText';
this.priorityTestValue += '\nText'
}))
}
.height(200)
......@@ -107,7 +107,7 @@ struct GestureSettingsExample {
.priorityGesture(
TapGesture()
.onAction((event: GestureEvent) => {
this.priorityTestValue += '\nColumn';
this.priorityTestValue += '\nColumn'
}), GestureMask.IgnoreInternal)
Column() {
......@@ -115,7 +115,7 @@ struct GestureSettingsExample {
.gesture(
TapGesture()
.onAction(() => {
this.parallelTestValue += '\nText';
this.parallelTestValue += '\nText'
}))
}
.height(200)
......@@ -127,7 +127,7 @@ struct GestureSettingsExample {
.parallelGesture(
TapGesture()
.onAction((event: GestureEvent) => {
this.parallelTestValue += '\nColumn';
this.parallelTestValue += '\nColumn'
}), GestureMask.Normal)
}
}
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md
浏览文件 @ deb78999
......@@ -41,13 +41,13 @@ struct TimePickerDialogExample {
onAccept: (value: TimePickerResult) => {
// 设置selectTime为按下确定按钮时的时间，这样当弹窗再次弹出时显示选中的为上一次确定的时间
this.selectTime.setHours(value.hour, value.minute)
console.info("TimePickerDialog:onAccept()" + JSON.stringify(value));
console.info("TimePickerDialog:onAccept()" + JSON.stringify(value))
},
onCancel: () => {
console.info("TimePickerDialog:onCancel()");
console.info("TimePickerDialog:onCancel()")
},
onChange: (value: TimePickerResult) => {
console.info("TimePickerDialog:onChange()" + JSON.stringify(value));
console.info("TimePickerDialog:onChange()" + JSON.stringify(value))
}
})
})
......@@ -59,13 +59,13 @@ struct TimePickerDialogExample {
useMilitaryTime: true,
onAccept: (value: TimePickerResult) => {
this.selectTime.setHours(value.hour, value.minute)
console.info("TimePickerDialog:onAccept()" + JSON.stringify(value));
console.info("TimePickerDialog:onAccept()" + JSON.stringify(value))
},
onCancel: () => {
console.info("TimePickerDialog:onCancel()");
console.info("TimePickerDialog:onCancel()")
},
onChange: (value: TimePickerResult) => {
console.info("TimePickerDialog:onChange()" + JSON.stringify(value));
console.info("TimePickerDialog:onChange()" + JSON.stringify(value))
}
})
})
......
zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
浏览文件 @ deb78999
......@@ -67,8 +67,8 @@ struct FillStyleExample {
.onReady(() =>{
this.offContext.fillStyle = '#0000ff'
this.offContext.fillRect(20, 160, 150, 100)
var image = this.offContext.transferToImageBitmap();
this.context.transferFromImageBitmap(image);
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
}
.width('100%')
......@@ -445,8 +445,8 @@ struct LineDashOffset {
.onReady(() =>{
this.offContext.arc(100, 75, 50, 0, 6.28)
this.offContext.setLineDash([10,20])
this.offContext.lineDashOffset = 10.0;
this.offContext.stroke();
this.offContext.lineDashOffset = 10.0
this.offContext.stroke()
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......@@ -1016,7 +1016,7 @@ stroke(path?: Path2D): void
| path | [Path2D](ts-components-canvas-path2d.md) | 否 | null | 需要绘制的Path2D。 |
**示例：**
```ts
// xxx.ets
@Entry
......@@ -1373,10 +1373,10 @@ quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.offContext.beginPath();
this.offContext.moveTo(20, 20);
this.offContext.quadraticCurveTo(100, 100, 200, 20);
this.offContext.stroke();
this.offContext.beginPath()
this.offContext.moveTo(20, 20)
this.offContext.quadraticCurveTo(100, 100, 200, 20)
this.offContext.stroke()
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......@@ -1475,9 +1475,9 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.offContext.moveTo(100, 20);
this.offContext.arcTo(150, 20, 150, 70, 50);
this.offContext.stroke();
this.offContext.moveTo(100, 20)
this.offContext.arcTo(150, 20, 150, 70, 50)
this.offContext.stroke()
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......@@ -1664,17 +1664,17 @@ struct Fill {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
let region = new Path2D();
region.moveTo(30, 90);
region.lineTo(110, 20);
region.lineTo(240, 130);
region.lineTo(60, 130);
region.lineTo(190, 20);
region.lineTo(270, 90);
region.closePath();
let region = new Path2D()
region.moveTo(30, 90)
region.lineTo(110, 20)
region.lineTo(240, 130)
region.lineTo(60, 130)
region.lineTo(190, 20)
region.lineTo(270, 90)
region.closePath()
// Fill path
this.offContext.fillStyle = 'green';
this.offContext.fill(region, "evenodd");
this.offContext.fillStyle = 'green'
this.offContext.fill(region, "evenodd")
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......@@ -1766,9 +1766,9 @@ struct Clip {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
let region = new Path2D();
region.rect(80,10,20,130);
region.rect(40,50,100,50);
let region = new Path2D()
region.rect(80,10,20,130)
region.rect(40,50,100,50)
this.offContext.clip(region,"evenodd")
this.offContext.fillStyle = "rgb(255,0,0)"
this.offContext.fillRect(0, 0, 600, 600)
......@@ -2214,8 +2214,8 @@ getImageData(sx: number, sy: number, sw: number, sh: number): ImageData
@Entry
@Component
struct GetImageData {
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
private settings: RenderingContextSettings = new RenderingContextSettings(true)
private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings)
private img:ImageBitmap = new ImageBitmap("/common/images/1234.png")
......@@ -2226,9 +2226,9 @@ struct GetImageData {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.offContext.drawImage(this.img,0,0,130,130);
var imagedata = this.offContext.getImageData(50,50,130,130);
this.offContext.putImageData(imagedata,150,150);
this.offContext.drawImage(this.img,0,0,130,130)
var imagedata = this.offContext.getImageData(50,50,130,130)
this.offContext.putImageData(imagedata,150,150)
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......@@ -2330,7 +2330,7 @@ struct SetLineDash {
.onReady(() =>{
this.offContext.arc(100, 75, 50, 0, 6.28)
this.offContext.setLineDash([10,20])
this.offContext.stroke();
this.offContext.stroke()
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......@@ -2384,7 +2384,7 @@ struct OffscreenCanvasGetLineDash {
.onReady(() => {
this.offContext.arc(100, 75, 50, 0, 6.28)
this.offContext.setLineDash([10,20])
this.offContext.stroke();
this.offContext.stroke()
let res = this.offContext.getLineDash()
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
......@@ -2437,7 +2437,7 @@ struct ToDataURL {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
var dataURL = this.offContext.toDataURL();
var dataURL = this.offContext.toDataURL()
})
}
.width('100%')
......@@ -2534,11 +2534,11 @@ struct CanvasExample {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.offContext.save(); // save the default state
this.offContext.fillStyle = "green";
this.offContext.fillRect(20, 20, 100, 100);
this.offContext.restore(); // restore to the default state
this.offContext.fillRect(150, 75, 100, 100);
this.offContext.save() // save the default state
this.offContext.fillStyle = "green"
this.offContext.fillRect(20, 20, 100, 100)
this.offContext.restore() // restore to the default state
this.offContext.fillRect(150, 75, 100, 100)
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......@@ -2575,11 +2575,11 @@ struct CanvasExample {
.height('100%')
.backgroundColor('#ffff00')
.onReady(() =>{
this.offContext.save(); // save the default state
this.offContext.fillStyle = "green";
this.offContext.fillRect(20, 20, 100, 100);
this.offContext.restore(); // restore to the default state
this.offContext.fillRect(150, 75, 100, 100);
this.offContext.save() // save the default state
this.offContext.fillStyle = "green"
this.offContext.fillRect(20, 20, 100, 100)
this.offContext.restore() // restore to the default state
this.offContext.fillRect(150, 75, 100, 100)
var image = this.offContext.transferToImageBitmap()
this.context.transferFromImageBitmap(image)
})
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md
浏览文件 @ deb78999
......@@ -41,7 +41,7 @@
@Entry
@Component
struct Index {
@State outSetValue: number = 40;
@State outSetValue: number = 40
build() {
Row() {
......@@ -63,8 +63,8 @@ struct Index {
})
.margin({ top: 30 })
.onChange((value: number, mode: SliderChangeMode) => {
this.outSetValue = value;
console.info('value:' + value + 'mode:' + mode.toString());
this.outSetValue = value
console.info('value:' + value + 'mode:' + mode.toString())
})
}
.width('100%')
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-focus.md
浏览文件 @ deb78999
......@@ -63,7 +63,7 @@ struct FocusableExample {
.width(165)
.height(40)
.fontColor(Color.White)
.focusOnTouch(true) //该Button组件点击后可获焦
.focusOnTouch(true) // 该Button组件点击后可获焦
Row({ space: 5 }) {
Button()
.width(80)
......@@ -73,7 +73,7 @@ struct FocusableExample {
.width(80)
.height(40)
.fontColor(Color.White)
.focusOnTouch(true) //该Button组件点击后可获焦
.focusOnTouch(true) // 该Button组件点击后可获焦
}
Row({ space: 5 }) {
Button()
......@@ -86,7 +86,7 @@ struct FocusableExample {
.fontColor(Color.White)
}
}.borderWidth(2).borderColor(Color.Red).borderStyle(BorderStyle.Dashed)
.tabIndex(1) //该Column组件为按TAB键走焦的第一个获焦的组件
.tabIndex(1) // 该Column组件为按TAB键走焦的第一个获焦的组件
Column({ space: 5 }) {
Button('Group2')
.width(165)
......@@ -101,7 +101,7 @@ struct FocusableExample {
.width(80)
.height(40)
.fontColor(Color.White)
.groupDefaultFocus(true) //该Button组件上级Column组件获焦时获焦
.groupDefaultFocus(true) // 该Button组件上级Column组件获焦时获焦
}
Row({ space: 5 }) {
Button()
......@@ -114,14 +114,14 @@ struct FocusableExample {
.fontColor(Color.White)
}
}.borderWidth(2).borderColor(Color.Green).borderStyle(BorderStyle.Dashed)
.tabIndex(2) //该Column组件为按TAB键走焦的第二个获焦的组件
.tabIndex(2) // 该Column组件为按TAB键走焦的第二个获焦的组件
}
Column({ space: 5 }) {
TextInput({placeholder: 'input', text: this.inputValue})
.onChange((value: string) => {
this.inputValue = value
})
.defaultFocus(true) //该TextInput组件为页面的初始默认焦点
.defaultFocus(true) // 该TextInput组件为页面的初始默认焦点
Button('Group3')
.width(165)
.height(40)
......@@ -165,7 +165,7 @@ struct FocusableExample {
.fontColor(Color.White)
}
}.borderWidth(2).borderColor(Color.Orange).borderStyle(BorderStyle.Dashed)
.tabIndex(3) //该Column组件为按TAB键走焦的第三个获焦的组件
.tabIndex(3) // 该Column组件为按TAB键走焦的第三个获焦的组件
}.alignItems(VerticalAlign.Top)
}
}
......@@ -200,7 +200,7 @@ focusControl.requestFocus示例代码：
使用focusContrl.requestFocus接口使指定组件获取焦点。
```ts
// requestFocus.ets
import prompt from '@system.prompt';
import prompt from '@ohos.prompt'
@Entry
@Component
......@@ -250,7 +250,7 @@ struct RequestFocusExample {
Button("RequestFocus")
.width(200).height(70).fontColor(Color.White)
.onClick(() => {
var res = focusControl.requestFocus(this.selectId) //使选中的this.selectId的组件获焦
var res = focusControl.requestFocus(this.selectId) // 使选中的this.selectId的组件获焦
if (res) {
prompt.showToast({message: 'Request success'})
} else {
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-image-effect.md
浏览文件 @ deb78999
......@@ -34,7 +34,7 @@
struct BlurEffectsExample {
build() {
Column({ space: 10 }) {
// 对字体进行模糊
// 对字体进行模糊
Text('font blur').fontSize(15).fontColor(0xCCCCCC).width('90%')
Flex({ alignItems: ItemAlign.Center }) {
Text('original text').margin(10)
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md
浏览文件 @ deb78999
......@@ -20,8 +20,6 @@
| -------------------------| ------------------------------------------------| -----| ----------------------------------------- |
| message | string | 是 | 弹窗信息内容。 |
| placementOnTop | boolean | 否 | 是否在组件上方显示，默认值为false。 |
| arrowOffset<sup>9+</sup> | [Length](ts-types.md#length) | 否 | popup箭头在弹窗处的偏移。箭头在气泡上下方时，数值为0表示箭头居最左侧，偏移量为箭头至最左侧的距离，默认居中。箭头在气泡左右侧时，偏移量为箭头至最上侧的距离，默认居中。 |
| showInSubWindow<sup>9+</sup> | boolean | 否 | 是否在子窗口显示气泡，默认值为false。 |
| primaryButton | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | 第一个按钮。<br/>value:&nbsp;弹窗里主按钮的文本。<br/>action:&nbsp;点击主按钮的回调函数。 |
| secondaryButton | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | 第二个按钮。<br/>value:&nbsp;弹窗里辅助按钮的文本。<br/>action:&nbsp;点击辅助按钮的回调函数。 |
| onStateChange | (event:&nbsp;{&nbsp;isVisible:&nbsp;boolean&nbsp;})&nbsp;=&gt;&nbsp;void | 否 | 弹窗状态变化事件回调，参数isVisible为弹窗当前的显示状态。 |
......@@ -34,8 +32,6 @@
| -------------------------| ------------------------- | ---- | ---------------------------------------------------- |
| builder | [CustomBuilder](ts-types.md#custombuilder8) | 是 | 提示气泡内容的构造器。 |
| placement | [Placement](ts-appendix-enums.md#placement8) | 否 | 气泡组件优先显示的位置，当前位置显示不下时，会自动调整位置。<br/>默认值：Placement.Bottom |
| arrowOffset<sup>9+</sup> | [Length](ts-types.md#length) | 否 | popup箭头在弹窗处的偏移。箭头在气泡上下方时，数值为0表示箭头居最左侧，偏移量为箭头至最左侧的距离，默认居中。箭头在气泡左右侧时，偏移量为箭头至最上侧的距离，默认居中。 |
| showInSubWindow<sup>9+</sup> | boolean | 否 | 是否在子窗口显示气泡，默认值为false。 |
| maskColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 提示气泡遮障层的颜色。 |
| popupColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 提示气泡的颜色。 |
| enableArrow | boolean | 否 | 是否显示箭头。<br/>从API Version 9开始，如果箭头所在方位侧的气泡长度不足以显示下箭头，则会默认不显示箭头。比如：placement设置为Left，但气泡高度小于箭头的宽度（32vp），则实际不会显示箭头。<br/>默认值：true |
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md
浏览文件 @ deb78999
......@@ -50,12 +50,12 @@
@Entry
@Component
struct DragExample {
@State numbers: string[] = ['one', 'two', 'three', 'four', 'five', 'six'];
@State text: string = '';
@State bool: boolean = false;
@State appleVisible: Visibility = Visibility.Visible;
@State orangeVisible: Visibility = Visibility.Visible;
@State bananaVisible: Visibility = Visibility.Visible;
@State numbers: string[] = ['one', 'two', 'three', 'four', 'five', 'six']
@State text: string = ''
@State bool: boolean = false
@State appleVisible: Visibility = Visibility.Visible
@State orangeVisible: Visibility = Visibility.Visible
@State bananaVisible: Visibility = Visibility.Visible
// 自定义拖拽过程中显示的内容
@Builder pixelMapBuilder() {
......@@ -87,10 +87,10 @@ struct DragExample {
.backgroundColor(0xAFEEEE)
.visibility(this.appleVisible)
.onDragStart(() => {
this.bool = true;
this.text = 'apple';
this.appleVisible = Visibility.None;
return this.pixelMapBuilder;
this.bool = true
this.text = 'apple'
this.appleVisible = Visibility.None
return this.pixelMapBuilder
})
Text('orange')
.width('25%')
......@@ -100,10 +100,10 @@ struct DragExample {
.backgroundColor(0xAFEEEE)
.visibility(this.orangeVisible)
.onDragStart(() => {
this.bool = true;
this.text = 'orange';
this.orangeVisible = Visibility.None;
return this.pixelMapBuilder;
this.bool = true
this.text = 'orange'
this.orangeVisible = Visibility.None
return this.pixelMapBuilder
})
Text('banana')
.width('25%')
......@@ -113,11 +113,11 @@ struct DragExample {
.backgroundColor(0xAFEEEE)
.visibility(this.bananaVisible)
.onDragStart((event: DragEvent, extraParams: string) => {
console.log('Text onDragStart, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
this.bool = true;
this.text = 'banana';
this.bananaVisible = Visibility.None;
return this.pixelMapBuilder;
console.log('Text onDragStart, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
this.bool = true
this.text = 'banana'
this.bananaVisible = Visibility.None
return this.pixelMapBuilder
})
}.padding({ top: 10, bottom: 10 }).margin(10)
......@@ -147,20 +147,20 @@ struct DragExample {
.padding(15)
.divider({ strokeWidth: 2, color: 0xFFFFFF, startMargin: 20, endMargin: 20 })
.onDragEnter((event: DragEvent, extraParams: string) => {
console.log('List onDragEnter, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
console.log('List onDragEnter, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
})
.onDragMove((event: DragEvent, extraParams: string) => {
console.log('List onDragMove, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
console.log('List onDragMove, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
})
.onDragLeave((event: DragEvent, extraParams: string) => {
console.log('List onDragLeave, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY());
console.log('List onDragLeave, ' + extraParams + 'X:' + event.getX() + 'Y:' + event.getY())
})
.onDrop((event: DragEvent, extraParams: string) => {
var jsonString = JSON.parse(extraParams);
if (this.bool) {
// 通过splice方法插入元素
this.numbers.splice(jsonString.insertIndex, 0, this.text);
this.bool = false;
this.numbers.splice(jsonString.insertIndex, 0, this.text)
this.bool = false
}
})
}.width('100%').height('100%').padding({ top: 20 }).margin({ top: 20 })
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-events-key.md
浏览文件 @ deb78999
......@@ -36,20 +36,20 @@
@Entry
@Component
struct KeyEventExample {
@State text: string = '';
@State eventType: string = '';
@State text: string = ''
@State eventType: string = ''
build() {
Column() {
Button('KeyEvent')
.onKeyEvent((event: KeyEvent) => {
if (event.type === KeyType.Down) {
this.eventType = 'Down';
this.eventType = 'Down'
}
if (event.type === KeyType.Up) {
this.eventType = 'Up';
this.eventType = 'Up'
}
this.text = 'KeyType:' + this.eventType + '\nkeyCode:' + event.keyCode + '\nkeyText:' + event.keyText;
this.text = 'KeyType:' + this.eventType + '\nkeyCode:' + event.keyCode + '\nkeyText:' + event.keyText
})
Text(this.text).padding(15)
}.height(300).width('100%').padding(35)
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-events-show-hide.md
浏览文件 @ deb78999
......@@ -19,32 +19,32 @@
```ts
// xxx.ets
import prompt from '@ohos.prompt';
import prompt from '@ohos.prompt'
@Entry
@Component
struct AppearExample {
@State isShow: boolean = true;
@State changeAppear: string = 'Hide Text';
private myText: string = 'Text for onAppear';
@State isShow: boolean = true
@State changeAppear: string = 'Hide Text'
private myText: string = 'Text for onAppear'
build() {
Column() {
Button(this.changeAppear)
.onClick(() => {
this.isShow = !this.isShow;
this.isShow = !this.isShow
}).margin(15)
if (this.isShow) {
Text(this.myText).fontSize(26).fontWeight(FontWeight.Bold)
.onAppear(() => {
this.changeAppear = 'Hide Text';
this.changeAppear = 'Hide Text'
prompt.showToast({
message: 'The text is shown',
duration: 2000
})
})
.onDisAppear(() => {
this.changeAppear = 'Show Text';
this.changeAppear = 'Show Text'
prompt.showToast({
message: 'The text is hidden',
duration: 2000
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-events-touch.md
浏览文件 @ deb78999
......@@ -45,42 +45,42 @@
@Entry
@Component
struct TouchExample {
@State text: string = '';
@State eventType: string = '';
@State text: string = ''
@State eventType: string = ''
build() {
Column() {
Button('Touch').height(40).width(100)
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.eventType = 'Down';
this.eventType = 'Down'
}
if (event.type === TouchType.Up) {
this.eventType = 'Up';
this.eventType = 'Up'
}
if (event.type === TouchType.Move) {
this.eventType = 'Move';
this.eventType = 'Move'
}
this.text = 'TouchType:' + this.eventType + '\nDistance between touch point and touch element:\nx: '
+ event.touches[0].x + '\n' + 'y: ' + event.touches[0].y + '\nComponent globalPos:('
+ event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\nwidth:'
+ event.target.area.width + '\nheight:' + event.target.area.height;
+ event.target.area.width + '\nheight:' + event.target.area.height
})
Button('Touch').height(50).width(200).margin(20)
.onTouch((event: TouchEvent) => {
if (event.type === TouchType.Down) {
this.eventType = 'Down';
this.eventType = 'Down'
}
if (event.type === TouchType.Up) {
this.eventType = 'Up';
this.eventType = 'Up'
}
if (event.type === TouchType.Move) {
this.eventType = 'Move';
this.eventType = 'Move'
}
this.text = 'TouchType:' + this.eventType + '\nDistance between touch point and touch element:\nx: '
+ event.touches[0].x + '\n' + 'y: ' + event.touches[0].y + '\nComponent globalPos:('
+ event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\nwidth:'
+ event.target.area.width + '\nheight:' + event.target.area.height;
+ event.target.area.width + '\nheight:' + event.target.area.height
})
Text(this.text)
}.width('100%').padding(30)
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或