【问题标题】:Set Image and Title in Navigation Bar in SwiftUI在 SwiftUI 的导航栏中设置图像和标题
【发布时间】:2020-10-26 13:59:53
【问题描述】:

如果有人知道如何实现它或如何实现它的想法,我将不胜感激。

【问题讨论】:

  • stackoverflow.com/questions/56505528/… 可能从答案中你可以得到一些想法
  • @Prashant Tukadiya 我已经调查过了。但那是不同的。感谢分享
  • 到目前为止,SwiftUI 还不够成熟,无法提供此功能。您只能使用 UIKit 或隐藏视图上的导航栏,然后创建一个自定义的相似视图,该视图位于屏幕顶部。之后,这是一个很难玩的手势。
  • 我已经在 UIkit 中创建了它。但无法使用 swiftUI 创建它。
  • @pushpank 你找到答案了吗?我正在寻找同样的东西。

标签: ios navigation swiftui uinavigationbar swiftui-environment


【解决方案1】:

这主要是您所追求的。在声明 navigationBarTitle 时使用 displayMode: .automatic 意味着它将显示为 largeTitle,直到滚动时导航栏转到 displayMode: .inline。 例如,我只是使用SF Symbols 图像,但您可以以同样的方式交换 Cap 的盾牌。如果需要交互,请将其包裹在按钮中。

struct ContentView: View {
    var body: some View {
        NavigationView {
            List(0...1000, id: \.self) { _ in
                Text("Sample")
            }
            .navigationBarTitle("Large Title", displayMode: .automatic)
            .navigationBarItems(trailing: Image(systemName: "shield"))
        }
    }
}

【讨论】:

  • 尾随栏项目永远不会像共享动画那样工作。用户界面不同,您可以比较两者。
  • 您对@pushpank 的要求不是默认行为。如果您特别不想使用本机行为,那么您正在注册很多复杂性。我提出的内容让你达到了 90%。但是,如果您想完全匹配行为,您可以使用PreferenceKeys 和GeometryReader 捕获导航栏视图的大小和位置,以手动更新图像的位置和大小。
  • 那么我建议你阅读这两件事,swiftui-lab.com/communicating-with-the-view-tree-part-1 是一个很好的起点。
【解决方案2】:

这是在 UIKIT 中完成的。

这是代码的样子

let viewA = UIView()
let viewB = UIView()

private func setupNavigationBarAppearance() {

        viewA.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(didViewA)))
        viewB.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(didViewB)))
        
        let leftBarButtonItem = UIBarButtonItem(customView: viewA)
        let rightBarButtonItem = UIBarButtonItem(customView: viewB)
        
        navigationItem.leftBarButtonItem = leftBarButtonItem
        navigationItem.rightBarButtonItem = rightBarButtonItem
        navigationItem.title = "Hello World"
        
    }

@objc private func didViewA() {
        print("Hello")
    }
    
    @objc private func didViewB() {
        print("World")
    }

我在这里使用了 UIView,因为 ImageView 是 UIView 的子类,所以你可以将它与你的 ImageView 关联起来。如果不需要,也可以删除左或右 barButtonItem。

【讨论】:

  • 主题是关于 SwiftUI 的……你看到了吗?
  • 哦,我还以为是UIKit呢。
  • 此解决方案也不会调整图像大小。
猜你喜欢
  • 1970-01-01
  • 2019-10-28
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2022-08-08
  • 1970-01-01
  • 2018-07-26
相关资源
最近更新 更多