1# 根据卡片状态刷新不同内容 2 3 4相同的卡片可以添加到桌面上实现不同的功能,比如添加两张桌面的卡片,一张显示杭州的天气,一张显示北京的天气,设置每天早上7点触发定时刷新,卡片需要感知当前的配置是杭州还是北京,然后将对应城市的天气信息刷新到卡片上,以下示例介绍了如何根据卡片的状态动态选择需要刷新的内容。 5 6 7- 卡片配置文件:配置每天早上7点触发定时刷新 8 9 ```json 10 { 11 "forms": [ 12 { 13 "name": "widget", 14 "description": "This is a service widget.", 15 "src": "./ets/widget/pages/WidgetCard.ets", 16 "uiSyntax": "arkts", 17 "window": { 18 "designWidth": 720, 19 "autoDesignWidth": true 20 }, 21 "colorMode": "auto", 22 "isDefault": true, 23 "updateEnabled": true,"scheduledUpdateTime": "07:00", 24 "updateDuration": 0, 25 "defaultDimension": "2*2", 26 "supportDimensions": ["2*2"] 27 } 28 ] 29 } 30 ``` 31 32- 卡片页面:卡片具备不同的状态选择,在不同的状态下需要刷新不同的内容,因此在状态发生变化时通过postCardAction通知EntryFormAbility。 33 34 ```ts 35 let storage = new LocalStorage(); 36 @Entry(storage) 37 @Component 38 struct WidgetCard { 39 @LocalStorageProp('textA') textA: string = '待刷新...'; 40 @LocalStorageProp('textB') textB: string = '待刷新...'; 41 @State selectA: boolean = false; 42 @State selectB: boolean = false; 43 44 build() { 45 Column() { 46 Row() { 47 Checkbox({ name: 'checkbox1', group: 'checkboxGroup' }) 48 .select(false) 49 .onChange((value: boolean) => { 50 this.selectA = value; 51 postCardAction(this, { 52 'action': 'message', 53 'params': { 54 'selectA': JSON.stringify(value) 55 } 56 }); 57 }) 58 Text('状态A') 59 } 60 61 Row() { 62 Checkbox({ name: 'checkbox2', group: 'checkboxGroup' }) 63 .select(false) 64 .onChange((value: boolean) => { 65 this.selectB = value; 66 postCardAction(this, { 67 'action': 'message', 68 'params': { 69 'selectB': JSON.stringify(value) 70 } 71 }); 72 }) 73 Text('状态B') 74 } 75 76 Row() { // 选中状态A才会进行刷新的内容 77 Text('状态A: ') 78 Text(this.textA) 79 } 80 81 Row() { // 选中状态B才会进行刷新的内容 82 Text('状态B: ') 83 Text(this.textB) 84 } 85 }.padding('10%') 86 } 87 } 88 ``` 89 90- EntryFormAbility:将卡片的状态存储在本地数据库中,在刷新事件回调触发时,通过formId获取当前卡片的状态,然后根据卡片的状态选择不同的刷新内容。 91 92 ```ts 93 import formInfo from '@ohos.app.form.formInfo' 94 import formProvider from '@ohos.app.form.formProvider'; 95 import formBindingData from '@ohos.app.form.formBindingData'; 96 import FormExtensionAbility from '@ohos.app.form.FormExtensionAbility'; 97 import dataStorage from '@ohos.data.storage' 98 99 export default class EntryFormAbility extends FormExtensionAbility { 100 onAddForm(want) { 101 let formId = want.parameters[formInfo.FormParam.IDENTITY_KEY]; 102 let isTempCard: boolean = want.parameters[formInfo.FormParam.TEMPORARY_KEY]; 103 if (isTempCard === false) { // 如果为常态卡片,直接进行信息持久化 104 console.info('Not temp card, init db for:' + formId); 105 let storeDB = dataStorage.getStorageSync(this.context.filesDir + 'myStore') 106 storeDB.putSync('A' + formId, 'false'); 107 storeDB.putSync('B' + formId, 'false'); 108 storeDB.flushSync(); 109 } 110 let formData = {}; 111 return formBindingData.createFormBindingData(formData); 112 } 113 114 onRemoveForm(formId) { 115 console.info('onRemoveForm, formId:' + formId); 116 let storeDB = dataStorage.getStorageSync(this.context.filesDir + 'myStore') 117 storeDB.deleteSync('A' + formId); 118 storeDB.deleteSync('B' + formId); 119 } 120 121 // 如果在添加时为临时卡片,则建议转为常态卡片时进行信息持久化 122 onCastToNormalForm(formId) { 123 console.info('onCastToNormalForm, formId:' + formId); 124 let storeDB = dataStorage.getStorageSync(this.context.filesDir + 'myStore') 125 storeDB.putSync('A' + formId, 'false'); 126 storeDB.putSync('B' + formId, 'false'); 127 storeDB.flushSync(); 128 } 129 130 onUpdateForm(formId) { 131 let storeDB = dataStorage.getStorageSync(this.context.filesDir + 'myStore') 132 let stateA = storeDB.getSync('A' + formId, 'false').toString() 133 let stateB = storeDB.getSync('B' + formId, 'false').toString() 134 // A状态选中则更新textA 135 if (stateA === 'true') { 136 let formInfo = formBindingData.createFormBindingData({ 137 'textA': 'AAA' 138 }) 139 formProvider.updateForm(formId, formInfo) 140 } 141 // B状态选中则更新textB 142 if (stateB === 'true') { 143 let formInfo = formBindingData.createFormBindingData({ 144 'textB': 'BBB' 145 }) 146 formProvider.updateForm(formId, formInfo) 147 } 148 } 149 150 onFormEvent(formId, message) { 151 // 存放卡片状态 152 console.info('onFormEvent formId:' + formId + 'msg:' + message); 153 let storeDB = dataStorage.getStorageSync(this.context.filesDir + 'myStore') 154 let msg = JSON.parse(message) 155 if (msg.selectA != undefined) { 156 console.info('onFormEvent selectA info:' + msg.selectA); 157 storeDB.putSync('A' + formId, msg.selectA); 158 } 159 if (msg.selectB != undefined) { 160 console.info('onFormEvent selectB info:' + msg.selectB); 161 storeDB.putSync('B' + formId, msg.selectB); 162 } 163 storeDB.flushSync(); 164 } 165 }; 166 ``` 167 168 169> **说明:** 170> 171> 通过本地数据库进行卡片信息的持久化时,建议先在[**onAddForm**](../reference/apis/js-apis-app-form-formExtensionAbility.md#onaddform)生命周期中通过[**TEMPORARY_KEY**](../reference/apis/js-apis-app-form-formInfo.md#formparam)判断当前添加的卡片是否为常态卡片:如果是常态卡片,则直接进行卡片信息持久化;如果为临时卡片,则可以在卡片转为常态卡片(**[onCastToNormalForm](../reference/apis/js-apis-app-form-formExtensionAbility.md#oncasttonormalform)**)时进行持久化;同时需要在卡片销毁(**[onRemoveForm](../reference/apis/js-apis-app-form-formExtensionAbility.md#onremoveform)**)时删除当前卡片存储的持久化信息,避免反复添加删除卡片导致数据库文件持续变大。 172 173