1/* 2 * Copyright (c) 2023-2024 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16import { Action } from '@ohos/common/src/main/ets/default/redux/actions/Action'; 17import { EventBus } from '@ohos/common/src/main/ets/default/worker/eventbus/EventBus'; 18import { EventBusManager } from '@ohos/common/src/main/ets/default/worker/eventbus/EventBusManager'; 19import { Dispatch, getStore, OhCombinedState } from '@ohos/common/src/main/ets/default/redux/store'; 20import { Log } from '@ohos/common/src/main/ets/default/utils/Log'; 21import { 22 PersistType, 23 PreferencesService 24} from '@ohos/common/src/main/ets/default/featurecommon/preferences/PreferencesService'; 25 26class StateStruct { 27 isThirdPartyCall: boolean = false; 28 thirdCallAction: string = ''; 29 isFaCall: boolean = false; 30 action: string = ''; 31 uiEnable: boolean = true; 32 modeIndex: number = 0; 33 mode: string = 'PHOTO'; 34 isShowMoreList: boolean = false; 35} 36 37class ControlDispatcher { 38 public setDispatch(dispatch: Dispatch) { 39 this.mDispatch = dispatch; 40 } 41 42 public changeToMode(mode: string): void { 43 this.mDispatch(Action.uiState(false)); 44 this.mDispatch(Action.changeMode(mode)); 45 this.mDispatch(Action.updateShowBigTextFlag(true)); 46 } 47 48 public updateModeIndex(index: number): void { 49 this.mDispatch(Action.updateModeIndex(index)); 50 } 51 52 public updateShowMoreList(isShowMoreList: boolean): void { 53 this.mDispatch(Action.updateShowMoreList(isShowMoreList)); 54 } 55 56 public initAction(action: string): void { 57 this.mDispatch(Action.initAction(action)); 58 } 59 60 public initMode(mode: string): void { 61 this.mDispatch(Action.initMode(mode)); 62 } 63 64 public updateListStatus(enable: boolean): void { 65 this.mDispatch(Action.uiState(enable)); 66 } 67 68 private mDispatch: Dispatch = (data) => data; 69} 70 71class SwipeModeIndexStruct { 72 swipeModeIndex: number = 0; 73} 74 75 76@Component 77export struct Control { 78 appEventBus: EventBus = EventBusManager.getInstance().getEventBus(); 79 @State state: StateStruct = new StateStruct(); 80 @State startScroll: number = 0; 81 @State endScroll: number = 0; 82 @State index: number = 0; 83 protected mPreferencesService: PreferencesService = PreferencesService.getInstance(); 84 private TAG: string = '[Control]'; 85 private scroller: Scroller = new Scroller(); 86 private modeArray: Array<string> = ['PHOTO', 'VIDEO']; 87 private itemWidth: number = 56; 88 private mAction: ControlDispatcher = new ControlDispatcher(); 89 90 aboutToAppear(): void { 91 Log.info(`${this.TAG} aboutToAppear E`); 92 getStore().subscribe((state: OhCombinedState) => { 93 this.state = { 94 isThirdPartyCall: state.contextReducer.isThirdPartyCall, 95 thirdCallAction: state.contextReducer.thirdCallAction, 96 isFaCall: state.contextReducer.isFaCall, 97 action: state.contextReducer.action, 98 uiEnable: state.contextReducer.uiEnable, 99 modeIndex: state.modeReducer.modeIndex, 100 mode: state.modeReducer.mode, 101 isShowMoreList: state.modeReducer.isShowMoreList 102 }; 103 }, (dispatch: Dispatch) => { 104 this.mAction.setDispatch(dispatch); 105 }); 106 107 this.appEventBus.on(Action.ACTION_SWIPE_MODE, (data: SwipeModeIndexStruct) => this.swipeChangeMode(data)); 108 Log.info(`${this.TAG} aboutToAppear X`); 109 } 110 111 aboutToDisappear(): void { 112 Log.info(`${this.TAG} aboutToDisappear E`); 113 this.appEventBus.off(Action.ACTION_SWIPE_MODE, (data: SwipeModeIndexStruct) => this.swipeChangeMode(data)); 114 Log.info(`${this.TAG} aboutToDisappear X`); 115 } 116 117 build() { 118 Column() { 119 Stack({ alignContent: Alignment.BottomStart }) { 120 if ((this.state.isThirdPartyCall || this.state.isFaCall) && this.state.mode === 'PHOTO' && 121 (this.state.thirdCallAction != 'ALL')) { 122 Row() { 123 Text($r('app.string.photo_mode')) 124 .width('100%') 125 .height('100%') 126 .fontSize(14) 127 .fontColor(Color.White) 128 .fontWeight(FontWeight.Bold) 129 .textAlign(TextAlign.Center) 130 }.width('100%').height('100%').offset({ x: -156, y: 0 }) 131 } else if ((this.state.isThirdPartyCall || this.state.isFaCall) && this.state.mode === 'VIDEO' && 132 (this.state.thirdCallAction != 'ALL')) { 133 Row() { 134 Text($r('app.string.video_mode')) 135 .width('100%') 136 .height('100%') 137 .fontSize(14) 138 .fontColor(Color.White) 139 .fontWeight(FontWeight.Bold) 140 .textAlign(TextAlign.Center) 141 }.width('100%').height('100%').offset({ x: -156, y: 0 }) 142 } else { 143 List({ initialIndex: this.state.modeIndex, scroller: this.scroller }) { 144 ListItem() { 145 }.width(56).height('100%') 146 147 ListItem() { 148 Text($r('app.string.photo_mode')) 149 .width('100%') 150 .height('100%') 151 .fontColor('#fff') 152 .fontSize($r('sys.float.ohos_id_text_size_sub_title3')) 153 .fontWeight(this.getModeFontWeight(0)) 154 .textAlign(TextAlign.Center) 155 .enabled(this.state.uiEnable) 156 .onClick(() => { 157 this.changeToMode(0) 158 }) 159 }.width(56).height('100%') 160 161 ListItem() { 162 Text($r('app.string.video_mode')) 163 .width('100%') 164 .height('100%') 165 .fontColor('#fff') 166 .fontSize($r('sys.float.ohos_id_text_size_sub_title3')) 167 .fontWeight(this.getModeFontWeight(1)) 168 .textAlign(TextAlign.Center) 169 .enabled(this.state.uiEnable) 170 .onClick(() => { 171 this.changeToMode(1) 172 }) 173 }.width(56).height('100%') 174 175 ListItem() { 176 }.width(56).height('100%') 177 } 178 .width(this.itemWidth * 3) 179 .height('100%') 180 .scrollBar(BarState.Off) 181 .listDirection(Axis.Horizontal) 182 .edgeEffect(EdgeEffect.None) 183 .chainAnimation(false) 184 .enabled(this.state.uiEnable) 185 .onScrollIndex((firstIndex: number, lastIndex: number, centerIndex: number) => { 186 Log.info(`${this.TAG} Control scroll index first: ${firstIndex}, centerIndex: ${centerIndex}, last: ${lastIndex}`) 187 this.index = firstIndex; 188 this.mAction.updateModeIndex(firstIndex); 189 Log.info(`${this.TAG} onScrollIndex this.state.modeIndex: ${this.state.modeIndex}`) 190 }) 191 .onScrollStop(() => { 192 Log.info(`${this.TAG} onScrollStop`); 193 this.changeToMode(this.index); 194 }) 195 } 196 Column() { 197 Column() { 198 }.width(6).height(6).borderRadius(3).backgroundColor('#007DFF') 199 }.width('100%').height(18).offset({ x: -156, y: 0 }) 200 }.width('100%').height(58) 201 } 202 } 203 204 private changeToMode(modeIndex: number): void { 205 Log.info(`${this.TAG} changeToMode modeIndex: ${modeIndex} E`); 206 this.scroller.scrollToIndex(modeIndex); 207 if (this.modeArray[modeIndex] !== this.state.mode) { 208 Log.info(`${this.TAG} this.state.changeToMode(${this.modeArray[modeIndex]})`); 209 this.mAction.changeToMode(this.modeArray[modeIndex]); 210 this.mPreferencesService.putModeValue(PersistType.FOR_AWHILE, modeIndex); 211 this.mPreferencesService.flushMode(); 212 } else { 213 this.mAction.updateListStatus(true); 214 } 215 Log.info(`${this.TAG} changeToMode X`); 216 } 217 218 private getModeFontWeight(modeIndex: number): FontWeight { 219 if (this.state.mode === this.modeArray[modeIndex]) { 220 return FontWeight.Bold; 221 } else { 222 return FontWeight.Regular; 223 } 224 } 225 226 private swipeChangeMode(data: SwipeModeIndexStruct): void { 227 this.changeToMode(data.swipeModeIndex); 228 } 229}