Is there a way to hide NavigationView inline title until user scrolls past a certain point

like the title suggests, I'm trying to collapse the navigationView title bar until the user scrolls past the first section (which I'm using as a header). Please see image. 

The reason why I can't use SwiftUI's built in NavigationTitle is because I can't put the profile picture in the NavigationTitle. Anyways, once the word "Summary" disappears, I want the navigationView's inline title to appear and say "Summary". I've tried using .onDisappear and .onAppear on the Text("Summary"), but because of the way the navigation bar works, it doesn't trigger until the user scrolls pretty far down the page.

I want a solution that: 1] collapses the top bar until the word "Summary" is out of view, then 2] shows the inline title. Thank you!

I have a @State var that changes the navigation title:

@State var navigationTitle: String = ""

And a NavigationTitle that changes:

.navigationBarTitle("\(navigationTitle)", displayMode: .inline)

And here is my header view:

Section {
     HStack(spacing: 8) {
          VStack(alignment: .leading, spacing: 5) {
               Text("\(Date().formatted(date: .abbreviated, time: .omitted))")
                    .foregroundColor(Color.secondary)
                    .textCase(.uppercase)
                    .font(.system(size: 13, weight: .medium, design: .default))

                    .onAppear {
                         navigationTitle = ""
                    }
                    .onDisappear {
                          navigationTitle = "Summary"
                    }
                    Text("Summary")
                          .font(.largeTitle.bold())
                          .textCase(nil)
                          .foregroundColor(Color.primary)
             }
             Spacer()
             Button {
                   self.showUserProfileModal.toggle()
             } label: {
                   Image(systemName: "person.crop.circle")
                         .symbolRenderingMode(.palette)
                         .foregroundStyle(.blue, .blue, .white)
                         .background(Color.white)
                         .clipShape(Circle())
                         .font(.system(size: 37, weight: .light, design: .default))
              }
       }

.listRowInsets(EdgeInsets(top: 0, leading: 0, bottom: 0, trailing: 0))                     .listRowBackground(Color(.systemGroupedBackground))

}