我正在开发一个项目,我们正在从本机 SwiftUI 应用程序过渡到基于 Flutter 的应用程序。为了弥补这一差距,我们同时维护 SwiftUI 和 Flutter 项目。
项目设置: 我们在 Flutter 中开发了一些功能。 Flutter项目被编译成.xcframework。 然后将此 .xcframework 导入到我们的 SwiftUI 项目中。 问题: Flutter 视图之一包含 SingleChildScrollView 中的内容。当我直接在模拟器或物理设备上运行 Flutter 项目时,滚动效果非常好。
但是,当我将此 Flutter 视图集成到我的 SwiftUI 项目中并将其呈现为工作表时,视图不会按预期滚动。内容保持静态,滚动行为完全丢失。
.sheet(item: $detailsUrl) { _ in
/// This view adds our flutter view
InformationDetailView(url: $detailsUrl)
}
//// ------- Above part present the view as a sheet ------------
import Foundation
import SwiftUI
import CommonUI
import Flutter
import FlutterPluginRegistrant
/// Shows a flutter view with a close icon - based on a detail url containing
/// a specific JSON
internal struct InformationDetailView: View {
@Binding internal var url: String?
internal var body: some View {
NavigationView {
if let url {
InformationDetailFlutterView(url: url)
.navigationBarItems(
leading:
Button {
self.url = nil
} label: {
R.image.abort.image
.resizable()
.aspectRatio(contentMode: .fit)
.liebherrShadow()
.frame(width: 24, height: 24)
}
.frame(width: 40, height: 40)
.contentShape(Rectangle())
)
// .simultaneousGesture(DragGesture(minimumDistance: 0), including: .all)
.modifier(NavigationBarModifier(isTransparent: true))
}
}
.modifier(InteractiveDismissDisabledModifier())
}
}
/// Loads the flutter engine with a specific url
internal struct InformationDetailFlutterView: UIViewControllerRepresentable {
@StateObject var flutterDependencies: InformationDetailDependencies
/// Initialized with a url to the details object
internal init(url: String) {
self._flutterDependencies = StateObject(wrappedValue: InformationDetailDependencies(withUrl: url))
}
/// Creates the view from a view controller
internal func makeUIViewController(context: Context) -> some UIViewController {
/// Create a FlutterViewController from a pre-warmed FlutterEngine
let flutterViewController = FlutterViewController(
engine: flutterDependencies.flutterEngine,
nibName: nil,
bundle: nil
)
return flutterViewController
}
/// Not needed currently
internal func updateUIViewController(_ uiViewController: UIViewControllerType, context: Context) {}
}
/// Instantiates the engine with a given url
internal class InformationDetailDependencies: ObservableObject {
let flutterEngine = FlutterEngine(name: "informationdetails engine")
init(withUrl url: String) {
if let percentUrl = url.addingPercentEncoding(withAllowedCharacters: .urlHostAllowed) {
/// Runs at the specific route
flutterEngine.run(withEntrypoint: nil,
initialRoute: "/information-details/?url=\(percentUrl)")
/// Connects plugins with iOS platform code to this app.
GeneratedPluginRegistrant.register(with: self.flutterEngine)
}
}
}
我尝试过的: 已验证滚动在独立 Flutter 应用程序中是否有效。 确保 .xcframework 已正确集成到 SwiftUI 项目中。 我在 SwiftUI 中尝试了不同的演示风格,但问题仍然存在。 问题: 在 SwiftUI 项目中嵌入 Flutter 视图时,有人遇到过类似的问题吗?如果是这样,您是如何解决滚动问题的?
任何见解或建议将不胜感激!
在这种情况下我们不能使用
.sheet()
演示。它将在 Gesture
上与 SwiftUI interactiveDismiss
发生冲突,并在 Flutter 视图侧滚动。您可以禁用交互式解雇.interactiveDismissDisabled()
,但仍然无法解决问题。 .sheet()
会代替 .fullScreenCover()
,为我们解决问题。