z6841-364db.gif

因为没有在网上找到合适的组件，就自己做了一个。
部分代码：

ZStack(alignment: .top) {
            VStack(spacing:0) {
                //这里如果是加载状态显示 loading
                Color.clear.frame(height: refreshAbleVM.progressViewCurrHight > refreshAbleVM.topRefreshH ? refreshAbleVM.progressViewCurrHight - refreshAbleVM.topRefreshH : 0)
                HStack {
                    if refreshAbleVM.state == .loading{
                        ProgressView()
                            .frame(height:refreshAbleVM.topRefreshH - 10)
                    }else if refreshAbleVM.state != .normal{
                        Image(systemName: "arrow.down")
                            .frame(height: refreshAbleVM.topRefreshH - 10)
                                .rotationEffect(.init(degrees: refreshAbleVM.pullDownMid ? 180 : 0))
                        Text(refreshAbleVM.pullDownMid ? "松开立即刷新" : "下拉可以刷新").animation(.none)
                    }
                }
                
                
                Spacer()
            }
                
            ScrollView{
                //这里读取顶部偏移量
                VStack(spacing:0) {
                    GeometryReader{ proxy -> AnyView in
                        DispatchQueue.main.async{
                            //这里不知道为什么 不能用 vm里面的变量，用了会不停的调用 不知道为什么？？
                            arrowFrame = proxy.frame(in: .global)
                        }
                        return AnyView(Color.clear)
                    }.frame(height: 0)
                    
                    content()
                    
                    LazyVStack(spacing:0){
                        HStack {
                            if refreshAbleVM.state == .bottomLoading{
                                ProgressView()
                                    .frame(height:refreshAbleVM.bottomRefreshH - 10)
                            }else{
                                if refreshAbleVM.state != .noMoreData {
                                    Image(systemName: "arrow.up")
                                        .frame(height: refreshAbleVM.topRefreshH - 10)
                                            .rotationEffect(.init(degrees: refreshAbleVM.pullUpMid ? 180 : 0))
                                }
                                Text(refreshAbleVM.state == .noMoreData ? "我也是有底线的～" : refreshAbleVM.pullUpMid ? "松开立即加载数据" : "上拉加载更多数据")
                                    .animation(.none)
                                    .overlay {
                                        GeometryReader{ bproxy -> AnyView in
                                            DispatchQueue.main.async{
                                                arrowBottomFrame = bproxy.frame(in: .global)
                                            }
                                            return AnyView(Color.clear)
                                        }.frame(height:refreshAbleVM.bottomRefreshH - 10)
                                    }
                                    
                            }
                        }
                        .opacity(refreshAbleVM.state == .loading ? 0 : 1)
                        .onAppear{
                            if refreshAbleVM.state == .normal{
                                refreshAbleVM.state = .bottomLoading
                            }
                        }
                        
                    }
                }
            }

还有一个问题，有点疑问。就是GeometryReader 的闭包内如果给 VModel里变量赋值，就会不停的调用闭包代码。但是我用了

@State private var arrowFrame = CGRect.zero

然后再赋值

GeometryReader{ proxy -> AnyView in
                        DispatchQueue.main.async{
                            //这里不知道为什么 不能用 vm里面的变量，用了会不停的调用 不知道为什么？？
                            arrowFrame = proxy.frame(in: .global)
                        }
                        return AnyView(Color.clear)
                    }.frame(height: 0)

这里代码就不会重复调用。按理说GeometryReader 闭包只会在滚动时调用的，如果给VM赋值，不滚动也在不停的赋值。如果有大佬知道可以告诉我。目前只能用@ State 属性，然后用onChange 监听了。