Flutter 到 OpenHarmony,不是有手就行吗 (下拉刷新)_flutter openharmony

最新推荐文章于 2024-08-24 16:54:56 发布
最新推荐文章于 2024-08-24 16:54:56 发布
阅读量685 收藏 6
点赞数 17
文章标签： flutter
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2401_85121873/article/details/139451940
版权

《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》

完整开源地址：https://docs.qq.com/doc/DSkNLaERkbnFoS0ZF

.backgroundColor('#22808080')

}
}


### 学废了


虽然练习时长只有一个月，但通过编写第一个 `ArtUI` 组件，还是学到了不少东西。


#### 创建发布一个组件


##### 创建组织


先到 [OpenHarmony 三方库中心仓]( ) 上面注册个账号，到 `个人中心` =》`组织管理` 中，申请一个组织。这个组织名字以后要用到，因为普通三方作者，是不能使用 `ohos` 前缀的。


比如我注册的是组织名为 `candies`，组件为 `pull_to_refresh`。那么组件最终的名字就是 `@candies/pull_to_refresh`


最后用户可以通过 `ohpm install @candies/pull_to_refresh`，来安装使用组件。



> 
> 为啥这个要先做，因为审核很慢。
> 
> 
> 


##### 创建项目


写一个组件，必然也会给这个组件创建一个演示例子，在 `Flutter` 中发布一个组件，你可以使用下面的结构。

package
–example


而在 `OpenHarmony` 里面你只能使用下面的结构，这样才能方便你修改代码。

example
–package


`2` 种结构的区别是， `package` 下面肯定会需要加 `README`，`LICENSE`，但是 `github`，`gitee` 默认只会显示根目录下面的 `README`，第二种结构就要多复制一份到 `example` 目录下面。


但是 [OpenHarmony 三方库中心仓]( ) 却要求，有点难顶啊。


![](https://img-blog.csdnimg.cn/img_convert/7fc94048e27e0b1aa682422304f90be8.webp?x-oss-process=image/format,png)



> 
> `ide` 啥时候支持下第一种结构呀！
> 
> 
> 


###### 创建组件演示项目


创建一个项目。


![](https://img-blog.csdnimg.cn/img_convert/7acc1aa0ba15ac44590290941249c625.webp?x-oss-process=image/format,png)


###### 创建组件项目


创建一个 `Static Libray` (至于其他 `Module` 是什么意思，请自行查看文档)


![](https://img-blog.csdnimg.cn/img_convert/cc0a616af735dafae7562694f65b7637.webp?x-oss-process=image/format,png)


创建好的目录长这样子


![](https://img-blog.csdnimg.cn/img_convert/bf90c1ed622087877cfdd2b45fe3fad0.webp?x-oss-process=image/format,png)


`oh-package.json5` 中是你的组件的信息。


这里你需要把名字改成 `@candies/pull_to_refresh` 即 `(@你的组织名字/组件名字)`


一个完整的 `oh-package.json5` 是这样的

{
“license”: “Apache-2.0”,
“devDependencies”: {},
“keywords”: [
“pull”,
“refresh”,
“pulltorefresh”
],
“author”: “zmtzawqlp”,
“name”: “@candies/pull_to_refresh”,
“description”: “Harmony plugin for building pull to refresh effects with PullToRefresh quickly.”,
“main”: “index.ets”,
“repository”: “https://github.com/HarmonyCandies/pull_to_refresh”,
“version”: “1.0.0”,
“homepage”: “https://github.com/HarmonyCandies/pull_to_refresh”,
“dependencies”: {}
}


组件项目中 `Index.ets` 是入口，用于导出组件。跟 `Flutter` 中 `lib` 下面带 `library 组件名;` 标识的 `dart` 文件效果一样。

export { MainPage } from ‘./src/main/ets/components/mainpage/MainPage’


###### 引用组件项目


要想 `Example` 能引用到 `pull_to_refresh`, 你还需要到

{
“license”: “”,
“devDependencies”: {},
“author”: “”,
“name”: “entry”,
“description”: “Please describe the basic information.”,
“main”: “”,
“version”: “1.0.0”,
“dependencies”: {
“@candies/pull_to_refresh”: “file:…/pull_to_refresh”
}
}


##### 发布


在准备发布之前，请先阅读 [贡献三方库]( ) 下面内容。


![](https://img-blog.csdnimg.cn/img_convert/a814ad1b7a04960b661033ac3c7e58c3.webp?x-oss-process=image/format,png)


阅读操作完毕之后，你就可以打你的 `har` 包了。选中你的组件项目，在 `Build` 下面选择 `Make Module 你的组件名字`。编译完成之后，你就可以在组件项目路径 `build\default\outputs\default\` 中找到你即将发布的包。


![](https://img-blog.csdnimg.cn/img_convert/770475efb52498cbb721ebd0cd09fcad.webp?x-oss-process=image/format,png)


最后执行 `ohpm publish xxx.har`(`xxx.har` 为上传包的本地路径)。上传成功之后，你就可以看到你的个人中心里面的消息和状态了，耐心等待审核。


我遇到的上架的问题主要是组织名称(当然，这是我自己猜的，后面会聊到这个)，`ohos` 不是普通三方开发者使用的前缀， `ohos` 的库都在 `OpenHarmony-TPC: OpenHarmony third party components (gitee.com)`下面。按道理你可以 `pr` 到这个下面，并且加入到 `ohos` 中，再发布。当然更欢迎大家能加入 `candies` 组织，大家一起生产有趣的小组件。


![](https://img-blog.csdnimg.cn/img_convert/7ef3dc151ab182f541a362aa87383c11.webp?x-oss-process=image/format,png)


![](https://img-blog.csdnimg.cn/img_convert/512219cbe4e057c727176f40aa17e577.webp?x-oss-process=image/format,png)


#### @Provide/@Consume


第一眼看到这个状态管理装饰器的时候，好亲切的感觉。这不是就是 `Flutter` 里面的 ([provider | Flutter Package (flutter-io.cn)]( )) 吗？


最开始设计 `pull\_to\_refresh` 的时候，想着跟 `Flutter` 中一样，父组件里面存放管理下拉刷新的状态，然后子组件里面监听状态，达到局部刷新的效果。


第一版的设计结构如下：


* `CustomWidget` 中提供了 `@Provide('a')`
* `CustomWidgetChild` 中使用 `@Consume('a')` 获取状态变化。

@Entry
@Component
struct HomePage {

@Builder
builder2(KaTeX parse error: Can't use function '$' in math mode at position 30: …}) { Text(`$̲{.a}测试`)
}

build() {
Column() {
CustomWidget() {
CustomWidgetChild({ builder: this.builder2 })
}
}
}
}

@Component
struct CustomWidget {
@Provide(‘a’) a: string = ‘abc’;
@BuilderParam
builder: () => void;

build() {
Column() {
Button(‘你好’).onClick((x) => {
if (this.a == ‘ddd’) {
this.a = ‘abc’;
}
else {
this.a = ‘ddd’;
}

  })
  this.builder()
}

}
}

@Component
struct CustomWidgetChild {
@Consume(‘a’) a: string;
@BuilderParam
builder: ($$: { a: string }) => void;

build() {
Column() {
this.builder({ a: this.a })
}
}
}


运行会报找不到 `Provide` 的错误。


通过分析由 `ArkTS` 生成的 `js` 文件(生成的 `js` 在 `entry\build\default\cache\default\default@CompileArkTS\esmodule\debug` 路径下面) ，我们可以分析得出：  
 `CustomWidgetChild` 其父组件实际上是 `HomePage`，其内部 `this` 指向的也是 `HomePage`，因此找不到 `CustomWidget` 的 `@Provide` 变量。

class HomePage extends ViewPU {
constructor(parent, params, __localStorage, elmtId = -1) {
super(parent, localStorage, elmtId);
this.setInitiallyProvidedValue(params);
}
setInitiallyProvidedValue(params) {
}
updateStateVars(params) {
}
purgeVariableDependenciesOnElmtId(rmElmtId) {
}
aboutToBeDeleted() {
SubscriberManager.Get().delete(this.id());
this.aboutToBeDeletedInternal();
}
builder2(KaTeX parse error: Can't use function '$' in math mode at position 181: … Text.create(`$̲{.a}测试`);
if (!isInitialRender) {
Text.pop();
}
ViewStackProcessor.StopGetAccessRecording();
});
Text.pop();
}
initialRender() {
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
Column.create();
if (!isInitialRender) {
Column.pop();
}
ViewStackProcessor.StopGetAccessRecording();
});
{
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
if (isInitialRender) {
ViewPU.create(new CustomWidget(this, {
builder: () => {
{
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
if (isInitialRender) {
ViewPU.create(new CustomWidgetChild(this, { builder: this.builder2 }, undefined, elmtId));
}
else {
this.updateStateVarsOfChildByElmtId(elmtId, {});
}
ViewStackProcessor.StopGetAccessRecording();
});
}
}
}, undefined, elmtId));
}
else {
this.updateStateVarsOfChildByElmtId(elmtId, {});
}
ViewStackProcessor.StopGetAccessRecording();
});
}
Column.pop();
}
rerender() {
this.updateDirtyElements();
}
}
class CustomWidget extends ViewPU {
constructor(parent, params, __localStorage, elmtId = -1) {
super(parent, __localStorage, elmtId);
this.__a = new ObservedPropertySimplePU(‘abc’, this, “a”);
this.addProvidedVar(“a”, this.__a);
this.builder = undefined;
this.setInitiallyProvidedValue(params);
}
setInitiallyProvidedValue(params) {
if (params.a !== undefined) {
this.a = params.a;
}
if (params.builder !== undefined) {
this.builder = params.builder;
}
}
updateStateVars(params) {
}
purgeVariableDependenciesOnElmtId(rmElmtId) {
}
aboutToBeDeleted() {
this.a.aboutToBeDeleted();
SubscriberManager.Get().delete(this.id());
this.aboutToBeDeletedInternal();
}
get a() {
return this.__a.get();
}
set a(newValue) {
this.__a.set(newValue);
}
initialRender() {
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
Column.create();
if (!isInitialRender) {
Column.pop();
}
ViewStackProcessor.StopGetAccessRecording();
});
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
Button.createWithLabel(‘你好’);
Button.onClick((x) => {
if (this.a == ‘ddd’) {
this.a = ‘abc’;
}
else {
this.a = ‘ddd’;
}
});
if (!isInitialRender) {
Button.pop();
}
ViewStackProcessor.StopGetAccessRecording();
});
Button.pop();
this.builder.bind(this)();
Column.pop();
}
rerender() {
this.updateDirtyElements();
}
}
class CustomWidgetChild extends ViewPU {
constructor(parent, params, __localStorage, elmtId = -1) {
super(parent, __localStorage, elmtId);
this.__a = this.initializeConsume(“a”, “a”);
this.builder = undefined;
this.setInitiallyProvidedValue(params);
}
setInitiallyProvidedValue(params) {
if (params.builder !== undefined) {
this.builder = params.builder;
}
}
updateStateVars(params) {
}
purgeVariableDependenciesOnElmtId(rmElmtId) {
}
aboutToBeDeleted() {
this.a.aboutToBeDeleted();
SubscriberManager.Get().delete(this.id());
this.aboutToBeDeletedInternal();
}
get a() {
return this.__a.get();
}
set a(newValue) {
this.__a.set(newValue);
}
initialRender() {
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
Column.create();
if (!isInitialRender) {
Column.pop();
}
ViewStackProcessor.StopGetAccessRecording();
});
this.builder.bind(this)(makeBuilderParameterProxy(“builder”, { a: () => (this[“__a”] ? this[“__a”] : this[“a”]) }));
Column.pop();
}
rerender() {
this.updateDirtyElements();
}
}
ViewStackProcessor.StartGetAccessRecordingFor(ViewStackProcessor.AllocateNewElmetIdForNextComponent());
loadDocument(new HomePage(undefined, {}));
ViewStackProcessor.StopGetAccessRecording();
export {};
//# sourceMappingURL=Index.js.map


意思就是你只能写成下面的这种形式。虽然说 `CustomWidgetChild` 是看起来是通过 `CustomWidget` 的 `builder` 创建出来的，但是它们依然没有父子关系，这跟 `Flutter` 完全不是一套原理。

@Entry
@Component
struct HomePage {
@Provide(‘a’) test: string = ‘abc’;

@Builder
builder2(KaTeX parse error: Can't use function '$' in math mode at position 30: …}) { Text(`$̲{.a}测试`)
}

build() {
Column() {
CustomWidget() {
CustomWidgetChild({ builder: this.builder2 })
}
}
}
}

@Component
struct CustomWidget {

@Consume(‘a’) a: string;
@BuilderParam
builder: () => void;

build() {
Column() {
Button(‘你好’).onClick((x) => {
if (this.a == ‘ddd’) {
this.a = ‘abc’;
}
else {
this.a = ‘ddd’;
}
})
this.builder()
}
}
}

@Component
struct CustomWidgetChild {
@Consume(‘a’) a: string;
@BuilderParam
builder: ($$: { a: string }) => void;

build() {
Column() {
this.builder({ a: this.a })
}
}
}


#### @Builder/@BuilderParam


在自定义组件中，如果你想传入其他的组件，你需要使用到 `@Builder` 和 `@BuilderParam`, 代码如下：

@Component
struct Child {
@BuilderParam aBuilder0: () => void;

build() {
Column() {
this.aBuilder0()
}
}
}

@Entry
@Component
struct Parent {
@Builder componentBuilder() {
Text(Parent builder )
}

build() {
Column() {
Child({ aBuilder0: this.componentBuilder })
}
}
}


但是实际中写一个自定义组件的时候，会有这种需求。需要为 `BuilderParam` 修饰的内容的返回增加一些事件或者设置。比如下面例子，为 `BuilderParamChild` 的 `builder` 的返回增加 `hitTestBehavior` 设置。我这里将 `builder` 的返回修改为了 `CommonMethod<any>`(组件都继承于该类，里面是一些公共的属性，事件)，虽然这样可以让编辑器有提示，并且不报错，但是运行起来依然会提示 `hitTestBehavior` 找不到。

@Component
struct BuilderParamTestDemo {
build() {
Column(){
BuilderParamChild(){
Text(‘测试’)
}
}
}
}

@Component
struct BuilderParamChild {
@BuilderParam
builder: () => CommonMethod;

build() {
this.builder().hitTestBehavior(HitTestMode.None)
}
}


错误堆栈如下：

E Error message: Cannot read property hitTestBehavior of undefined
E SourceCode:
E this.builder().hitTestBehavior.bind(this)(HitTestMode.None);
E ^
E Stacktrace:
E at initialRender (entry/src/main/ets/pages/Index.ets:20:5)


从生成的 `js` 中也能看到对应的代码。

“use strict”;
class BuilderParamTestDemo extends ViewPU {
constructor(parent, params, __localStorage, elmtId = -1) {
super(parent, localStorage, elmtId);
this.setInitiallyProvidedValue(params);
}
setInitiallyProvidedValue(params) {
}
updateStateVars(params) {
}
purgeVariableDependenciesOnElmtId(rmElmtId) {
}
aboutToBeDeleted() {
SubscriberManager.Get().delete(this.id());
this.aboutToBeDeletedInternal();
}
initialRender() {
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
Column.create();
if (!isInitialRender) {
Column.pop();
}
ViewStackProcessor.StopGetAccessRecording();
});
{
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
if (isInitialRender) {
ViewPU.create(new BuilderParamChild(this, {
builder: () => {
this.observeComponentCreation((elmtId, isInitialRender) => {
ViewStackProcessor.StartGetAccessRecordingFor(elmtId);
Text.create(‘测试’);
if (!isInitialRender) {
Text.pop();
}
ViewStackProcessor.StopGetAccessRecording();
});
Text.pop();
}
}, undefined, elmtId));
}
else {
this.updateStateVarsOfChildByElmtId(elmtId, {});
}
ViewStackProcessor.StopGetAccessRecording();
});
}
Column.pop();
}
rerender() {
this.updateDirtyElements();
}
}
class BuilderParamChild extends ViewPU {
constructor(parent, params, __localStorage, elmtId = -1) {
super(parent, localStorage, elmtId);
this.builder = undefined;
this.setInitiallyProvidedValue(params);
}
setInitiallyProvidedValue(params) {
if (params.builder !== undefined) {
this.builder = params.builder;
}
}
updateStateVars(params) {
}
purgeVariableDependenciesOnElmtId(rmElmtId) {
}
aboutToBeDeleted() {
SubscriberManager.Get().delete(this.id());
this.aboutToBeDeletedInternal();
}
initialRender() {
this.builder().hitTestBehavior.bind(this)(HitTestMode.None);
}
rerender() {
this.updateDirtyElements();
}
}
ViewStackProcessor.StartGetAccessRecordingFor(ViewStackProcessor.AllocateNewElmetIdForNextComponent());
loadDocument(new BuilderParamTestDemo(undefined, {}));
ViewStackProcessor.StopGetAccessRecording();
//# sourceMappingURL=Index.js.map

2401_85121873
关注
  • 17
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Flutter 到 OpenHarmony,不是有手就行吗 (下拉刷新)_flutter openharmony(2)
2401_84164503的博客
04-15 1067
你可以通过对Controller中dragOffset和mode的判断，创建属于自己的下拉刷新效果。如果下拉刷新失败了，你可以通过调用Controller的refresh()方法来重新执行刷新动画。下面是一个自定义下拉刷新头部的例子@Componentbuild() {Row() {= 0)Text(})
Flutter到 OpenHarmony,不是有手就行吗? (仿掘金点赞按钮)
1
04-11 724
Flutter提供了丰富的动画支持，使开发者能够轻松创建各种类型的动画效果，从简单的渐变和旋转到复杂的交互式动画都可以实现。而ArkUI从api上面看起来更简单，更容易编写代码。我们今天迁移的是Flutter从Flutter迁移到ArkUI过程蛮简单的，只需要去找准对应的api即可，关于Canvas的api各种平台的都大差不差的。基本概念构建第一个ArkTS应用……应用基础知识配置文件应用数据管理应用安全管理应用隐私保护三方应用调用管控机制资源分类与访问。
Flutter 到 OpenHarmony,不是有手就行吗? (下拉刷新)
maniuT的博客
02-23 1283
五年前，有人告诉我，你可以错过其他技术，但千万不要错过Flutter。然而此刻，有人告诉我，如果你错过了 OpenHarmony，恐怕要错过下个时代了。作为发展了5年的 FlutterCandies 社区，我们已拥有70+的Flutter组件。我们当然也不会止步于Flutter。我们希望把我们的Flutter组件也能带到 OpenHarmony 生态当中，HarmonyCandies 便是为了这一刻。以Flutter开发者的角度，尽可能提供相同Api的 OpenHarmony 组件。
Harmony 开始支持 Flutter ，聊聊 Harmony 和 Flutter 之间的因果
恋猫de小郭的博客
09-19 2735
通过本篇，相信你应该能简单理解到 Flutter 和 Harmony 之间的「因果关系」，对于 Flutter 开发来说，Harmony Next 会是一个相对较好的新平台。当然，这不代表这你可以不学 ArkTS 和 ArkUI，因为不管是打包构建或者 napi 都离不开 Harmony 平台本身的支持，而且在于这样一个「百废待兴」的社区环境下，完全靠社区支撑明显不现实，关键时刻还得是「自己动手」才能「丰衣足食」。
Flutter 实现下拉刷新上拉加载的示例代码
08-25
Flutter 实现下拉刷新上拉加载的示例代码 Flutter 是一款 популяр的移动应用开发框架，它提供了丰富的 widgets 和工具，可以帮助开发者快速构建高性能的移动应用。今天，我们将介绍如何使用 Flutter 实现...
Flutter RefreshIndicator 下拉刷新
03-29
RefreshIndicator FlutterSDK提供的下拉刷新组件，但是没有上拉加载，需要上拉加载可查看 下拉刷新上拉加载Demo。 大家知道，所有的Scrollable都是可滚动的，但是如果没有足够内容，Scrollable是不可滚动的。...
Flutter ListView 上拉加载更多下拉刷新功能实现方法
08-25
Flutter ListView 上拉加载更多下拉刷新功能实现方法 Flutter ListView 是一个非常常用的控件，它可以用来展示列表数据。在实际开发中，我们经常需要实现上拉加载更多和下拉刷新的功能，以提高用户体验。下面我们...
ProgressWheelView_flutter刷新库_flutter_智能_
09-30
在Flutter开发中，UI设计和用户体验是至关重要的因素之一，其中刷新控件是提升应用交互性的关键组件。`ProgressWheelView`是一个专为Flutter设计的智能刷新库，它提供了丰富的自定义选项，使得开发者能够轻松地创建...
flutter_pull_to_refresh_new.zip
01-11
总的来说，`flutter_pull_to_refresh`库为Flutter开发者提供了一套全面的解决方案，用于实现下拉刷新和滚动到底部加载更多的功能。通过结合`SmartRefresher`、`RefreshController`以及各种内置或自定义的刷新指示器...
flutter编译和构建鸿蒙应用程序（windows环境）
baorant24的博客
11-24 1万+
针对 OpenHarmony 的 Flutter 版本已经开源，参考 https://gitee.com/openharmony-sig/flutter_flutter。 本文为实践该流程，实现flutter打包鸿蒙hap包的流程。目前流程已经走完，不过最后打包hap包依赖于flutter engine构建，目前还没构建完成。下次持续更新。
渲染引擎分析 - 鸿蒙(OpenHarmony) JS UI 源码阅读笔记
qq_32198115的博客
09-07 5977
作者：门柳 鸿蒙是华为研发的新一代终端操作系统，能适用于 IoT、手表、手机、Pad、电视等各种类型的设备上，扛起“国产操作系统”的大旗，也遭受了很多非议。2021 年 6 月初发布了 OpenHarmony 2.0 Canary 版本，开源了更多子系统的代码，支持内存 128MB 以上的设备。其中就包含了新版本的 JS UI 框架，本文重点分析这部分代码。（文章内容仅供参考，如有任何描述不准确的内容，感谢大家后台留言探讨与指正~） 鸿蒙系统概述 系统架构分层 建议去 OpenHarmony...
HarmonyOS到底是不是Android套皮？
程序IT圈
06-06 8442
来源：21ic电子网，头条@我的小号等，本文作者观点不代表本网观点 某人曾说「没有调查就没有发言权」 最近鸿蒙系统关注度好高，支持与反对、看好和看衰、「自主的全场景分布式系统」和...
让 Flutter 在鸿蒙系统上跑起来
热门推荐
美团技术团队
01-21 2万+
总第433篇2021年 第003篇鸿蒙系统 （HarmonyOS）是华为推出的一款分布式操作系统，那么如何在保证开发迭代效率的前提下，以相对低的成本将移动应用快速移植到鸿蒙平台上呢？美团...
flutter 中 ssl 双向证书校验
唐僧的专栏
08-23 438
flutter 中 ssl 双向证书校验
Flutter-自适用高度PageView
dalong的博客
08-18 578
通过本方案，我们实现了一个自适应高度的PageView，它能够根据每个页面的内容高度进行动态调整。该实现依赖于对每个页面内容的测量，并使用来平滑地过渡高度变化。这样可以确保页面切换时，用户体验更加自然流畅，避免了内容被裁剪或空白区域的出现。这种自适应高度的PageView非常适合用于不同页面内容高度不一致的场景。详情：github.com/yixiaolunhui/flutter_xy。
Flutter ListView 实现不同样式 item
最新发布
且听真言
08-24 403
我们在实际开发中会创建显示不同类型内容的列表。以下是使用 Flutter 创建此类结构的方法：1. 创建包含不同类型项目的数据源。2. 将数据源转换为小部件列表。
①flutter简介和环境构建①
paiidds的博客
08-23 944
flutter介绍及环境安装
Flutter 下拉刷新
05-13
Flutter提供了一个名为RefreshIndicator的控件，可以用来实现下拉刷新的功能。 使用RefreshIndicator很简单，大致步骤如下： ...如果需要自定义样式，可以使用第三方库，如flutter_easyrefresh、pull_to_refresh等。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值