从为移动设备开发的相同代码库中为 flutter web 开发一个单独的 UI

Developing a separate UI for flutter web from same codebase developed for mobile

我已经使用 flutter 开发了一个移动应用程序,它在 ios 和 android.what 上运行完美=16=] 当前应用程序也可以在浏览器上完美运行,但它很奇怪,因为我使用了底部导航等移动特定组件。我用 BLoC 模式 开发了这个,并且 ui 与业务逻辑分开了。我的问题是,我可以为 Web 应用程序开发 ui 并在现有代码中重用业务逻辑实现吗?如果可以的话,如果有人能提供一些我可以使用的参考,我很高兴。

是的,您可以利用您的 Bloc 并重新实现 UI。

正如@rickimaru 建议的那样,您可以检查 kIsWeb。但我的建议是改为检查您的屏幕尺寸。随着 Flutter 获得更多目标,例如 windows、linux、macOS 等

为更大的屏幕构建一个不同的 UI 可能更合适,而不仅仅是为网络(除非您执行特定于网络平台的逻辑,但事实并非如此)。此外,仅 运行 在网络上并不意味着更大的屏幕尺寸,您的用户可能会通过他们的手机浏览器访问。

您可以使用 MediaQuery 和断点手动检查屏幕尺寸,或者您可以利用 responsive_framework.

等已经制作好的软件包