鸿蒙 Next 安全控件与系统 Picker 深度剖析
SameX
Posted on November 28, 2024
本文旨在深入探讨华为鸿蒙HarmonyOS Next系统(截止目前 API12)在开发多语言电商平台方面的技术细节,基于实际开发实践进行总结。主要作为技术分享与交流载体,难免错漏,欢迎各位同仁提出宝贵意见和问题,以便共同进步。本文为原创内容,任何形式的转载必须注明出处及原作者。
在鸿蒙 Next 系统的安全与用户交互体系中,位置控件和系统 Picker 发挥着独特且重要的作用。它们分别从定位获取和资源选择方面,为应用提供了便捷且安全的功能实现方式。接下来,让我们深入探究它们的功能与使用方法。
一、位置控件:精准定位的临时授权助手
(一)位置控件的作用
位置控件为应用提供了一种直观且用户可控的方式来获取位置信息。在当今众多应用中,位置服务的需求日益多样化,但并非所有应用都需要长时间或在后台持续获取精准位置。位置控件的出现,使得应用能够在用户明确知晓并同意的情况下,仅在前台期间获取精准定位授权,从而获取位置信息完成相应服务功能。这不仅满足了应用的功能需求,更重要的是充分尊重了用户的隐私,让用户能够自主决定何时何地分享自己的位置信息。
(二)使用位置控件获取临时精准定位授权的方法
- 引入位置服务依赖 首先,在应用的代码文件中引入与位置服务相关的依赖模块。例如:
import { geoLocationManager } from '@kit.LocationKit';
这一步就像是为获取位置信息搭建了桥梁,确保应用能够与系统的位置服务进行交互。
- 添加位置控件并处理点击事件 在应用的用户界面布局中添加位置控件,并处理其点击事件。位置控件同样由图标、文本和背景组成,开发者可以根据需求选择合适的样式。例如:
import { geoLocationManager } from '@kit.LocationKit';
import { promptAction } from '@kit.ArkUI';
import { BusinessError } from '@kit.BasicServicesKit';
// 获取当前位置信息的函数
function getCurrentLocationInfo() {
const requestInfo: geoLocationManager.LocationRequest = {
'priority': geoLocationManager.LocationRequestPriority.FIRST_FIX,
'scenario': geoLocationManager.LocationRequestScenario.UNSET,
'timeInterval': 1,
'distanceInterval': 0,
'maxAccuracy': 0
};
try {
geoLocationManager.getCurrentLocation(requestInfo)
.then((location: geoLocationManager.Location) => {
promptAction.showToast({ message: JSON.stringify(location) });
})
.catch((err: BusinessError) => {
console.error(`Failed to get current location. Code is ${err.code}, message is ${err.message}`);
});
} catch (err) {
console.error(`Failed to get current location. Code is ${err.code}, message is ${err.message}`);
}
}
@Entry
@Component
struct Index {
build() {
Row() {
Column({ space: 10 }) {
LocationButton({
icon: LocationIconStyle.LINES,
text: LocationDescription.CURRENT_LOCATION,
buttonType: ButtonType.Normal
})
.padding({ top: 12, bottom: 12, left: 24, right: 24 })
.onClick((event: ClickEvent, result: LocationButtonOnClickResult) => {
if (result === LocationButtonOnClickResult.SUCCESS) {
// 点击位置控件成功后,调用获取当前位置信息的函数
getCurrentLocationInfo();
} else {
promptAction.showToast({ message: '获取位置信息失败!' });
}
})
}
.width('100%')
}
.height('100%')
.backgroundColor(0xF1F3F5)
}
}
在上述代码中,我们在界面中添加了位置控件,并在其点击事件处理函数中,当用户点击位置控件且授权成功时,调用getCurrentLocationInfo()
函数来获取当前位置信息。
-
获取并处理位置信息
在
getCurrentLocationInfo()
函数中,通过配置LocationRequest
参数,向系统位置服务请求获取当前位置信息。获取成功后,可以根据实际需求对位置信息进行处理,如在上述示例中,通过promptAction.showToast()
将位置信息以弹窗形式展示给用户。
(三)位置控件使用限制和开发步骤表格展示
使用限制 | 开发步骤 |
---|---|
当用户首次点击应用中的位置控件,系统将弹窗请求用户授权,若点击“取消”,再次点击会重新弹窗;点击“允许”,应用将被授予临时位置权限,此后点击不再弹窗。 精准定位的临时授权会持续到灭屏、应用切后台、应用退出等任一情况发生,然后恢复到临时授权之前的授权状态。 应用在授权期间没有调⽤次数限制。 为保障用户隐私,应用需确保安全控件可见且用户能识别,避免因控件样式问题导致授权失败。 |
1. 引入位置服务依赖。 2. 添加位置控件和获取当前位置信息的处理逻辑到界面。 3. 在位置控件点击事件处理函数中,获取并处理位置信息。 |
(四)示例代码:使用位置控件获取当前位置
以下是一个完整的使用位置控件获取当前位置的示例代码:
import { geoLocationManager } from '@kit.LocationKit';
import { promptAction } from '@kit.ArkUI';
import { BusinessError } from '@kit.BasicServicesKit';
@Entry
@Component
struct Index {
build() {
Row() {
Column({ space: 10 }) {
LocationButton({
icon: LocationIconStyle.LINES,
text: LocationDescription.CURRENT_LOCATION,
buttonType: ButtonType.Normal
})
.padding({ top: 12, bottom: 12, left: 24, right: 24 })
.onClick((event: ClickEvent, result: LocationButtonOnClickResult) => {
if (result === LocationButtonOnClickResult.SUCCESS) {
const requestInfo: geoLocationManager.LocationRequest = {
'priority': geoLocationManager.LocationRequestPriority.FIRST_FIX,
'scenario': geoLocationManager.LocationRequestScenario.UNSET,
'timeInterval': 1,
'distanceInterval': 0,
'maxAccuracy': 0
};
try {
geoLocationManager.getCurrentLocation(requestInfo)
.then((location: geoLocationManager.Location) => {
promptAction.showToast({ message: JSON.stringify(location) });
})
.catch((err: BusinessError) => {
console.error(`Failed to get current location. Code is ${err.code}, message is ${err.message}`);
});
} catch (err) {
console.error(`Failed to get current location. Code is ${err.code}, message is ${err.message}`);
}
} else {
promptAction.showToast({ message: '获取位置信息失败!' });
}
})
}
.width('100%')
}
.height('100%')
.backgroundColor(0xF1F3F5)
}
}
在这个示例中,用户点击位置控件后,如果授权成功,应用将获取当前位置信息并以弹窗形式展示给用户。
二、系统 Picker:资源选择的安全利器
(一)系统 Picker 的概念与功能
系统 Picker 是鸿蒙 Next 提供的一种系统级组件,由独立进程实现。其核心功能是允许应用在不直接获取相关权限的情况下,通过用户交互的方式选择特定的资源,如文件、照片、联系人等。它就像是一个智能的资源中介,在用户和应用之间搭建了一座安全的桥梁。当应用需要访问这些资源时,只需拉起系统 Picker,由用户在 Picker 界面上进行选择操作,应用即可获取用户选择的资源结果,而无需申请读取整个资源库的权限。这极大地提高了资源访问的安全性和灵活性,同时也优化了用户体验。
(二)使用系统 Picker 选择不同资源的方法
- 选择用户文件(FilePicker) 当应用需要获取用户文件时,可以使用 FilePicker。例如,一款文档编辑应用需要打开用户指定的文档进行编辑,可按以下方式操作:
// 假设已经导入了相关的 Picker 模块
import { filePicker } from '@kit.SomeFilePickerKit';
async function openUserFile() {
try {
const fileUri = await filePicker.showOpenDialog({
// 可以设置文件类型过滤器等参数,这里仅为示例
filters: [
{
name: 'Documents',
extensions: ['txt', 'pdf', 'docx']
}
]
});
if (fileUri) {
// 用户选择了文件,应用可以根据 fileUri 进行后续操作,如读取文件内容等
console.log('用户选择的文件路径:', fileUri);
}
} catch (error) {
console.error('打开文件选择器失败:', error);
}
}
在上述代码中,通过调用filePicker.showOpenDialog()
方法,弹出文件选择器对话框,用户可以在对话框中选择符合指定过滤器的文件,应用获取到用户选择的文件路径(fileUri
)后,即可进行后续的文件操作,如读取文件内容进行编辑。
- 选择照片(PhotoViewPicker) 对于需要获取用户照片的应用,如图片编辑应用或社交分享应用,可以使用 PhotoViewPicker。以下是一个简单的示例:
import { photoViewPicker } from '@kit.SomePhotoPickerKit';
async function selectUserPhoto() {
try {
const photoUri = await photoViewPicker.showPhotoPicker();
if (photoUri) {
// 用户选择了照片,应用可以根据 photoUri 进行显示、编辑或分享等操作
console.log('用户选择的照片路径:', photoUri);
}
} catch (error) {
console.error('打开照片选择器失败:', error);
}
}
通过调用photoViewPicker.showPhotoPicker()
方法,应用可以拉起照片选择器,用户选择照片后,应用获取照片的路径(photoUri
)用于后续处理,如在图片编辑应用中加载照片进行编辑,或在社交分享应用中分享所选照片。
- 选择联系人(联系人 Picker) 当应用需要获取联系人信息时,例如通讯类应用添加联系人或发送消息时选择收件人,可以使用联系人 Picker。示例代码如下:
import { contactPicker } from '@kit.SomeContactPickerKit';
async function selectContact() {
try {
const contact = await contactPicker.showContactPicker();
if (contact) {
// 用户选择了联系人,应用可以获取联系人的相关信息,如姓名、电话号码等
console.log('用户选择的联系人:', contact);
}
} catch (error) {
console.error('打开联系人选择器失败:', error);
}
}
调用contactPicker.showContactPicker()
方法后,用户可以在联系人选择器中选择所需联系人,应用获取联系人对象(contact
)并进行相应操作,如在通讯应用中填充收件人信息或获取联系人详细资料进行展示。
(三)系统 Picker 使用限制和开发步骤表格展示
使用限制 | 开发步骤 |
---|---|
系统 Picker 已获取对应权限的预授权,但开发者仍需遵循系统安全规范使用。 | 1. 根据需要选择合适的 Picker(如 FilePicker、PhotoViewPicker、联系人 Picker 等)。 2. 按照相应 Picker 的 API 调用方式,拉起选择器并处理用户选择结果。 |
(四)示例代码:使用照片选择器选择照片
以下是一个使用照片选择器选择照片的示例代码:
import { photoViewPicker } from '@kit.SomePhotoPickerKit';
@Entry
@Component
struct Index {
build() {
Row() {
Column({ space: 10 }) {
Button('选择照片')
.onClick(async () => {
try {
const photoUri = await photoViewPicker.showPhotoPicker();
if (photoUri) {
console.log('用户选择的照片路径:', photoUri);
// 在这里可以进行后续对所选照片的处理,如显示照片、上传照片等
}
} catch (error) {
console.error('打开照片选择器失败:', error);
}
})
}
.width('100%')
}
.height('100%')
}
}
在这个示例中,用户点击“选择照片”按钮后,应用将拉起照片选择器,用户选择照片后,应用获取照片路径并在控制台打印出来,开发者可以根据实际需求在获取照片路径后进行进一步的处理,如在界面上显示所选照片或上传照片到服务器等操作。
综上所述,位置控件和系统 Picker 在鸿蒙 Next 系统中为应用提供了强大且安全的功能扩展能力。我们熟练掌握它们的使用方法和注意事项,能够在提升应用功能的同时,更好地保护用户隐私和确保系统安全。希望通过本文的介绍,能帮助各位同仁更加高效地运用这些功能组件,打造出更加优质的鸿蒙 Next 应用。
Posted on November 28, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
November 29, 2024
November 29, 2024
November 29, 2024
November 29, 2024