feat: 🎸 made custom toolbar that merges search and nav

similar to ios safari, only available on ios 16+
This commit is contained in:
Diogo Cunha
2024-06-26 22:50:07 +01:00
parent 32946d4628
commit 9b6e0ad7fd
2 changed files with 58 additions and 29 deletions
@@ -9,7 +9,7 @@
import SwiftUI
import SimpleXChat
struct ChatListView: View {
struct ChatListView<ToolbarContent: View>: View {
@EnvironmentObject var chatModel: ChatModel
@State private var searchMode = false
@@ -21,6 +21,7 @@ struct ChatListView: View {
@State private var searchVisible: Bool = true;
@AppStorage(DEFAULT_SHOW_UNREAD_AND_FAVORITES) private var showUnreadAndFavorites = false
@AppStorage(DEFAULT_ONE_HAND_UI) private var oneHandUI = false
let toolbarContent: ToolbarContent?
var body: some View {
if #available(iOS 16.0, *) {
@@ -29,6 +30,10 @@ struct ChatListView: View {
viewBody
}
}
init(@ViewBuilder toolbarContent: () -> ToolbarContent?) {
self.toolbarContent = toolbarContent()
}
private var viewBody: some View {
VStack {
@@ -61,7 +66,7 @@ struct ChatListView: View {
ScrollViewReader { scrollViewProxy in
List {
Color.clear
.frame(height: 30)
.frame(height: oneHandUI ? 80 : 30)
ForEach(cs.indices, id: \.self) { index in
ChatListNavLink(chat: cs[index])
.scaleEffect(x: 1, y: oneHandUI ? -1 : 1, anchor: .center)
@@ -94,25 +99,38 @@ struct ChatListView: View {
.foregroundColor(.secondary)
}
if !chatModel.chats.isEmpty && searchVisible {
VStack {
ChatListSearchBar(
searchMode: $searchMode,
searchFocussed: $searchFocussed,
searchText: $searchText,
searchShowingSimplexLink: $searchShowingSimplexLink,
searchChatFilteredBySimplexLink: $searchChatFilteredBySimplexLink
)
.scaleEffect(x: 1, y: oneHandUI ? -1 : 1, anchor: .center)
.listRowSeparator(.hidden)
.frame(maxWidth: .infinity)
.padding(10)
VStack {
if let tbcontent = toolbarContent, oneHandUI, #available(iOS 16.0, *), !searchFocussed {
tbcontent
.scaleEffect(x: 1, y: oneHandUI ? -1 : 1, anchor: .center)
.frame(maxWidth: .infinity)
.padding(.horizontal, 25)
.padding(.bottom, 5)
.toolbar(.hidden, for: .bottomBar)
}
if !chatModel.chats.isEmpty && searchVisible {
VStack {
ChatListSearchBar(
searchMode: $searchMode,
searchFocussed: $searchFocussed,
searchText: $searchText,
searchShowingSimplexLink: $searchShowingSimplexLink,
searchChatFilteredBySimplexLink: $searchChatFilteredBySimplexLink
)
.scaleEffect(x: 1, y: oneHandUI ? -1 : 1, anchor: .center)
.listRowSeparator(.hidden)
.frame(maxWidth: .infinity)
.padding(10)
}
}
.background(Color(.systemBackground))
}
.background(.bar)
}
}
private func updateTopVisibleRowIndex(proxy: GeometryProxy, index: Int) {
let frame = proxy.frame(in: .named("SCROLL"))
@@ -327,10 +345,12 @@ struct ChatListView_Previews: PreviewProvider {
]
return Group {
ChatListView()
.environmentObject(chatModel)
ChatListView()
.environmentObject(ChatModel())
ChatListView {
EmptyView()
}.environmentObject(chatModel)
ChatListView {
EmptyView()
}.environmentObject(ChatModel())
}
}
}
+18 -9
View File
@@ -53,6 +53,16 @@ struct HomeView: View {
ConnectDesktopView()
}
}
@ViewBuilder private func toolbar() -> some View {
settingsButton()
Spacer()
contactsButton()
Spacer()
chatsButton()
Spacer()
newChatButton()
}
@ViewBuilder private func homeView() -> some View {
let v = VStack {
@@ -61,15 +71,10 @@ struct HomeView: View {
case .chats: withToolbar("Chats", chatListView)
}
}
.toolbar {
ToolbarItemGroup(placement: .bottomBar) {
settingsButton()
Spacer()
contactsButton()
Spacer()
chatsButton()
Spacer()
newChatButton()
toolbar()
}
}
@@ -212,7 +217,11 @@ struct HomeView: View {
@ViewBuilder private func chatListView() -> some View {
// TODO reverse scale effect for swipe actions
ChatListView()
ChatListView {
HStack {
toolbar()
}
}
}
@ViewBuilder private func chatView() -> some View {
@@ -226,4 +235,4 @@ struct HomeView: View {
#Preview {
HomeView(showSettings: Binding.constant(false))
}
}