鸿蒙：跳转至图库或文件并显示在 Image 控件中

利用 HarmonyOS 轻松实现图片选择与显示功能

引言

在移动应用开发中，经常需要用户从设备存储或相册中选择图片并将其显示在应用界面上。HarmonyOS 提供了强大的工具，让您能够轻松实现这一功能。本文将逐步指导您完成在 HarmonyOS 应用程序中实现图片选择和显示的步骤，并提供完整的代码示例。

准备工作

创建 HarmonyOS 项目

1. 打开 HarmonyOS 开发工具，选择“新建项目”。
2. 选择“空项目”模板并命名项目。
3. 选择项目存储位置并单击“创建”。

添加依赖项

在项目的 build.gradle 文件中添加以下依赖项：

implementation 'com.huawei.hms:imagepicker:6.1.0.300'

布局文件

在 res/layout 目录下创建一个名为 activity_main.xml 的布局文件，并添加以下代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <Button
        android:id="@+id/btn_select_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="选择图片" />

    <com.huawei.hms.imagepicker.PickerEditImageView
        android:id="@+id/iv_image"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

• btn_select_image：选择图片按钮。
• iv_image：显示所选图片的 Image 控件。

主活动文件

在 src/main/java 目录下创建一个名为 MainActivity.java 的主活动文件，并添加以下代码：

package com.example.imagepicker;

import android.app.Activity;
import android.content.Intent;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

import com.huawei.hms.imagepicker.ImagePicker;
import com.huawei.hms.imagepicker.ImagePickerActivity;
import com.huawei.hms.imagepicker.ImagePickerRequest;
import com.huawei.hms.imagepicker.ImagePickerResult;

public class MainActivity extends Activity {

    private static final int REQUEST_CODE_SELECT_IMAGE = 100;
    private ImagePicker imagePicker;
    private Button btnSelectImage;
    private PickerEditImageView ivImage;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        btnSelectImage = findViewById(R.id.btn_select_image);
        ivImage = findViewById(R.id.iv_image);

        imagePicker = ImagePicker.create(this);
        btnSelectImage.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 调用系统相册
                ImagePickerRequest request = new ImagePickerRequest()
                        .setSelectLimit(1) // 最多选择一张图片
                        .setCropSaveAspectRatio(true) // 保持裁剪后的图片比例与原图一致
                        .setSkipCrop(true); // 跳过裁剪步骤

                imagePicker.pickImage(request, REQUEST_CODE_SELECT_IMAGE);
            }
        });
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == REQUEST_CODE_SELECT_IMAGE && resultCode == RESULT_OK) {
            ImagePickerResult imagePickerResult = ImagePicker.obtainResult(data);
            Bitmap bitmap = imagePickerResult.getBitmap();
            ivImage.setImageBitmap(bitmap);
        }
    }
}

• btnSelectImage：选择图片按钮的点击事件监听器。
• ivImage：显示所选图片的 Image 控件。
• imagePicker：Image Picker 对象，用于调用系统相册。

运行应用程序

• 编译并运行应用程序。
• 点击“选择图片”按钮，将弹出系统相册。
• 选择一张图片并点击“确定”。
• 所选图片将显示在 Image 控件中。

总结

恭喜您！您已经成功地在 HarmonyOS 应用程序中实现了图片选择和显示功能。通过利用 Image Picker 库，您可以轻松地从系统相册中获取图像并将其显示在您的应用界面上。这为您的应用添加了交互性和用户友好性。

常见问题解答

• 如何更改最大选择图片数量？

imagePickerRequest.setSelectLimit(int limit); // 设置最大选择图片数量

• 如何禁用裁剪功能？

imagePickerRequest.setSkipCrop(true); // 禁用裁剪功能

• 如何获取所选图片的路径？

ImagePickerResult imagePickerResult = ImagePicker.obtainResult(data);
String imagePath = imagePickerResult.getImagePath(); // 获取所选图片的路径

• 如何自定义裁剪比例？

imagePickerRequest.setCropSaveAspectRatio(float width, float height); // 设置裁剪比例

• 如何从特定目录中选择图片？

imagePickerRequest.setImageSource(ImagePickerRequest.IMAGE_SOURCE_DIRECTORY);
imagePickerRequest.setDirectory(String directory); // 设置特定目录