在鸿蒙上使用 desktop_photo_search Flutter Package

desktop_photo_search是一款基于Flutter开发的跨平台照片搜索应用，支持Windows、macOS、Linux和鸿蒙系统。该应用通过Unsplash API提供高质量照片搜索功能，具有Material和Fluent UI两种界面风格。主要功能包括关键词搜索、照片下载及多参数筛选（如方向、数量等）。在鸿蒙系统上使用时，需以git方式引入依赖，配置Unsplash API密钥，并

yaoyaoxingzhe

982人浏览 · 2025-12-18 15:45:49

yaoyaoxingzhe · 2025-12-18 15:45:49 发布

插件介绍

desktop_photo_search 是一个基于 Flutter 开发的照片搜索应用，它允许用户通过 Unsplash API 搜索并获取高质量的免费照片。该应用提供了 Material 和 Fluent UI 两种界面风格实现，支持桌面平台（Windows、macOS、Linux），并已适配鸿蒙系统。

主要功能特点：

通过 Unsplash API 搜索高质量照片
支持多种搜索参数（关键词、页码、每页数量、照片方向等）
提供 Material 和 Fluent UI 两种界面风格
支持下载照片到本地文件系统
适配鸿蒙系统，实现跨平台使用

如何在鸿蒙上使用

1. 引入依赖

由于这是一个自定义修改版本的三方库，需要以 git 形式引入。在你的鸿蒙项目的 pubspec.yaml 文件中添加以下依赖：

dependencies:
  desktop_photo_search:
    git:
      url: "https://github.com/flutter/samples.git"
      path: "desktop_photo_search"
  # 其他依赖
  http: ^1.1.0
  provider: ^6.0.5
  transparent_image: ^2.0.1
  url_launcher: ^6.1.12
  uuid: ^4.0.0

2. 获取 Unsplash API 访问密钥

要使用该插件，你需要从 Unsplash API 获取访问密钥：

访问 Unsplash 开发者平台
注册或登录你的账号
创建一个新的应用
复制生成的 Access Key

3. 配置 API 密钥

在你的项目中创建一个名为 unsplash_access_key.dart 的文件，内容如下：

// lib/unsplash_access_key.dart

const unsplashAccessKey = 'YOUR_UNSPLASH_ACCESS_KEY';

将 YOUR_UNSPLASH_ACCESS_KEY 替换为你从 Unsplash 获取的访问密钥。

4. API 调用示例

初始化 Unsplash 客户端

import 'package:desktop_photo_search/src/unsplash/unsplash.dart';
import 'unsplash_access_key.dart';

// 初始化 Unsplash 客户端
final unsplash = Unsplash(accessKey: unsplashAccessKey);

搜索照片

import 'package:desktop_photo_search/src/unsplash/photo.dart';
import 'package:desktop_photo_search/src/unsplash/search_photos_response.dart';

Future<void> searchPhotosExample() async {
  try {
    // 搜索关键词为 "nature" 的照片，每页 15 张
    final response = await unsplash.searchPhotos(
      query: 'nature',
      perPage: 15,
      orientation: SearchPhotosOrientation.landscape,
    );

    // 处理搜索结果
    if (response != null && response.results != null) {
      for (Photo photo in response.results!) {
        print('照片 ID: ${photo.id}');
        print('照片描述: ${photo.description}');
        print('照片宽度: ${photo.width}');
        print('照片高度: ${photo.height}');
        print('下载次数: ${photo.downloads}');
        print('点赞次数: ${photo.likes}');
        print('照片 URL: ${photo.urls?.regular}');
        print('-----------------------------------');
      }
    }
  } catch (e) {
    print('搜索照片时出错: $e');
  }
}

下载照片

import 'dart:typed_data';
import 'package:file_selector/file_selector.dart';

Future<void> downloadPhotoExample(Photo photo) async {
  try {
    // 下载照片数据
    final Uint8List imageBytes = await unsplash.download(photo);

    // 选择保存位置
    final String? filePath = await getSavePath(
      suggestedName: '${photo.id}.jpg',
      acceptedTypeGroups: [
        XTypeGroup(
          label: 'JPEG Images',
          extensions: ['jpg'],
          mimeTypes: ['image/jpeg'],
        ),
      ],
    );

    // 保存照片到本地
    if (filePath != null) {
      final File file = File(filePath);
      await file.writeAsBytes(imageBytes);
      print('照片已保存到: $filePath');
    }
  } catch (e) {
    print('下载照片时出错: $e');
  }
}

5. 界面实现

该 package 提供了两种界面风格的实现，你可以根据需要选择：

Material 风格

import 'package:flutter/material.dart';
import 'package:desktop_photo_search/material/lib/main.dart' as material_app;

void main() {
  runApp(const MaterialApp(
    home: material_app.PhotoSearchApp(),
  ));
}

Fluent UI 风格

import 'package:fluent_ui/fluent_ui.dart' as fluent;
import 'package:desktop_photo_search/fluent_ui/lib/main.dart' as fluent_app;

void main() {
  runApp(const fluent.FluentApp(
    home: fluent_app.PhotoSearchApp(),
  ));
}