earnipay ?

  • 一个 Flutter 应用,可从远程存储库获取分页图片列表。

关于应用 ?

此应用会获取分页图片列表,并在主页上懒惰地显示它们。

当用户滚动到列表底部时,会获取更多图片。

当用户点击图片时,应用会导航到一个新屏幕,在该屏幕上以更大的形式显示图片及其详细信息。

该应用程序在 Android 和 iOS 移动设备上均具有响应性。

状态管理 ?

该应用使用 bloc 状态管理 方法。

每个屏幕都属于自己的模块,一个模块有一个 bloc 文件夹,其中包含 Bloc、State 和 Event 类。每个模块还有一个 view,其中包含模块的 UI。

该应用使用 http 包 来进行网络调用。

? 性能优化 ?

我确保在小部件中尽可能使用 const,以便在小部件的状态未更改时不会重建。

对于图片和标题列表,我使用了 CustomScrollView,以便列表能够高效且可自定义地渲染,并且图片会被缓存,以确保用户每次转到主页时都不会始终获取图片。并且可以在图片详情页面轻松显示这些缓存的图片。

?‍♂️ 测试 ?

测试是每个应用程序开发的关键部分。它确保应用程序的各种边缘情况都得到了妥善处理。

Earnipay 使用 bloc_testflutter_test 进行小部件和 bloc 测试。

✅ 如何运行应用

您可以在 Android 或 iOS 手机上运行此应用。您必须下载 VS codeAndroid Studio,方法是单击其中一个链接 ? 并遵循官方安装指南。

成功安装 VS codeAndroid Studio 后,按照此处的指南 这里 安装 Flutter,然后您可以克隆此 应用 并运行它以享受精美的视图。

请记住在 Unsplash 上创建一个账户,并将您在 Unsplash 上的 client_id 附加到 photo_service.dart 文件第 8 行的 baseUrl 中,该文件位于 lib/app/data/services/photo 文件夹内。

? 让我们来看看这款应用…

列表页

alt image1___

详情页

alt image2

GitHub

查看 Github