• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2023 Fujian Newland Auto-ID Tech.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 */
15import BatteryInfoUtil from '../util/BatteryInfoUtil'
16import { logger } from '@ohos/common/src/main/ets/util/Logger';
17import { getString } from '@ohos/common/src/main/ets/util/ResourceUtil';
18
19/**
20 * 电池信息组件
21 * 用于显示电池基础信息，包括：电池剩余电量、充电状态、健康状态、充电器类型、电压、技术型号、温度、电量等级、充电类型
22 */
23
24const TAG: string = '[Sample_BatteryView]'
25
26@Component
27struct BatteryInfoView {
28  private mName: string | Resource = '';
29  private mIsLine?: boolean = true
30  private mViewID?: string = ''
31  @Prop mValue: string
32
33  @Builder CustomDivider() {
34    Divider()
35      .strokeWidth('1px')
36      .color($r('sys.color.ohos_id_color_subheading_separator'))
37      .margin({
38        bottom: px2vp(8)
39      })
40  }
41
42  build() {
43    Column() {
44      Row() {
45        Text(this.mName)
46          .fontColor($r('sys.color.ohos_id_color_text_primary'))
47          .fontSize($r('sys.float.ohos_id_text_size_sub_title2'))
48          .fontWeight(FontWeight.Regular)
49          .width('30%')
50          .maxLines(2)
51          .textOverflow({
52            overflow: TextOverflow.Ellipsis
53          })
54          .id(this.mViewID)
55        Blank()
56        Text(this.mValue)
57          .fontColor($r('app.color.battery_info_value_text'))
58          .fontSize($r('sys.float.ohos_id_text_size_sub_title3'))
59          .width('40%')
60          .textAlign(TextAlign.End)
61      }
62      .width('100%')
63      .height(47)
64      .justifyContent(FlexAlign.Start)
65      .alignItems(VerticalAlign.Center)
66
67      if (this.mIsLine) {
68        Blank()
69        this.CustomDivider()
70      }
71    }
72    .width('100%')
73    .height(48)
74  }
75}
76
77@Preview
78@Component
79export struct BatteryView {
80  @StorageLink('BatteryPresent') isBatteryPresent: boolean = true // 是否支持电池或电池是否在位
81  @StorageLink('BatterySOC') mBatterySOC: string = '0' // 电池电量
82  @StorageLink('ChargingStatus') mChargingStatus: string = '' // 电池充电状态
83  @StorageLink('HealthStatus') mHealthStatus: string = '' // 电池健康状态
84  @StorageLink('PluggedType') mPluggedType: string = '' // 电池充电器类型
85  @StorageLink('Voltage') mVoltage: string = '' // 电池电压
86  @StorageLink('Technology') mTechnology: string = '' // 电池技术型号
87  @StorageLink('Temperature') mTemperature: string = '' // 电池温度
88  @StorageLink('CapacityLevel') mCapacityLevel: string = '' // 电池电量等级
89  private BATTERY_VOLTAGE_SYMBOL: string = ''
90  private BATTERY_TEMPERATURE_SYMBOL: string = ''
91
92  async aboutToAppear() {
93    logger.info(`${TAG} aboutToAppear`)
94    this.BATTERY_VOLTAGE_SYMBOL = getString($r('app.string.battery_voltage_symbol'))
95    this.BATTERY_TEMPERATURE_SYMBOL = getString($r('app.string.battery_temperature_symbol'))
96    // 注册电池电量数据变化监听器
97    BatteryInfoUtil.registerEventBatteryChanged()
98    // 获取电池相关信息
99    this.getInfo()
100  }
101
102  private getInfo() {
103    logger.info(`${TAG} aboutToAppear isBatteryPresent: ${this.isBatteryPresent}`)
104    // 初始化电量信息
105    if (this.isBatteryPresent) {
106      BatteryInfoUtil.getBatterySOC()
107      BatteryInfoUtil.getChargingStatus()
108      BatteryInfoUtil.getHealthStatus()
109      BatteryInfoUtil.getPluggedType()
110      BatteryInfoUtil.getVoltage()
111      BatteryInfoUtil.getTechnology()
112      BatteryInfoUtil.getBatteryTemperature()
113      BatteryInfoUtil.getBatteryCapacityLevel()
114    }
115  }
116
117  aboutToDisappear() {
118    logger.info(`${TAG} aboutToDisappear`)
119    BatteryInfoUtil.unregisterEventBatteryChanged()
120  }
121
122  build() {
123    Scroll() {
124      Column() {
125        Stack({
126          alignContent: Alignment.Center
127        }) {
128          DataPanel({
129            values: [this.isBatteryPresent ? Number(this.mBatterySOC) : 0],
130            max: 100,
131            type: DataPanelType.Circle }
132          )
133            .id('batterySOC')
134            .width(280)
135            .height(280)
136
137
138          Column() {
139            Row() {
140              Text(this.isBatteryPresent ? this.mBatterySOC : $r('app.string.battery_soc_0'))
141                .fontColor($r('app.color.battery_soc_text'))
142                .fontSize($r('sys.float.ohos_id_text_size_headline3'))
143              Text($r('app.string.battery_soc_100'))
144                .fontColor($r('sys.color.ohos_id_color_text_primary'))
145                .fontSize($r('sys.float.ohos_id_text_size_headline8'))
146                .padding({
147                  bottom: px2vp(15)
148                })
149            }
150            .alignItems(VerticalAlign.Bottom)
151            .justifyContent(FlexAlign.Center)
152            .margin({
153              bottom: px2vp(4)
154            })
155
156            if (this.isBatteryPresent) {
157              Text(this.mHealthStatus)
158                .fontColor($r('sys.color.ohos_id_color_text_secondary'))
159                .fontSize($r('sys.float.ohos_id_text_size_body1'))
160            }
161          }
162        }
163        .width('100%')
164        .height(px2vp(390))
165
166        if (this.isBatteryPresent) {
167          Column({
168            space: px2vp(8)
169          }) {
170            BatteryInfoView({
171              mName: $r('app.string.battery_charging_status'),
172              mValue: this.mChargingStatus.toString(),
173              mViewID: 'batteryChargingStatus'
174            })
175
176            BatteryInfoView({
177              mName: $r('app.string.battery_plugged_type'),
178              mValue: this.mPluggedType.toString(),
179              mViewID: 'batteryPluggedType'
180            })
181
182            BatteryInfoView({
183              mName: $r('app.string.battery_voltage'),
184              mValue: `${this.mVoltage} ${this.BATTERY_VOLTAGE_SYMBOL}`,
185              mViewID: 'batteryVoltage'
186            })
187
188            BatteryInfoView({
189              mName: $r('app.string.battery_technology'),
190              mValue: this.mTechnology.toString(),
191              mViewID: 'batteryTechnology'
192            })
193
194            BatteryInfoView({
195              mName: $r('app.string.battery_temperature'),
196              mValue: `${this.mTemperature} ${this.BATTERY_TEMPERATURE_SYMBOL}`,
197              mViewID: 'batteryTemperature'
198            })
199
200            BatteryInfoView({
201              mName: $r('app.string.battery_capacity_level'),
202              mIsLine: false,
203              mValue: this.mCapacityLevel.toString(),
204              mViewID: 'batteryCapacityLevel'
205            })
206          }
207          .padding(px2vp(24))
208          .margin(px2vp(24))
209          .backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
210          .border({
211            radius: $r('sys.float.ohos_id_corner_radius_default_l')
212          })
213          .id('batteryContext')
214        } else {
215          Row({ space: 10 }) {
216            Image($r('app.media.icon_search_fail'))
217              .width(px2vp(32))
218              .height(px2vp(32))
219              .objectFit(ImageFit.Fill)
220              .id('batteryFailIcon')
221            Text($r('app.string.battery_information_error'))
222              .fontColor($r('sys.color.ohos_id_color_text_secondary'))
223              .fontSize($r('sys.float.ohos_id_text_size_body1'))
224              .id('batteryErrorText')
225          }
226          .height('40%')
227          .id('batterySearchFail')
228        }
229      }
230      .width('100%')
231      .height('100%')
232    }
233    .height('100%')
234  }
235}