Increase size of tab bar item icons in SwiftUI Increase size of tab bar item icons in SwiftUI xcode xcode

Increase size of tab bar item icons in SwiftUI


You can directly use font size like that (tested in Xcode 11.3).

Please note that only works for symbol images (SF Symbols or . custom SVG symbols), it doesn't work for bitmap images.

YourView()   .tabItem {       Image(systemName: "heart").font(.system(size: 26))       Text("Offers")    }


You can use the .font() modifier to get a larger image:

YourView()    .tabItem {        Image(systemName: "…").font(.title)    }

Sadly, the padding looks wrong with the image pushed right up to the top of the Tab Bar.


You can create custom tabView to achieve custom height

attached screen shot showing the result of custom tabview which is inspired from this Gist

struct TabView: View {    var views: [TabBarItem]    @State var selectedIndex: Int = 0    init(_ views: [TabBarItem]) {        self.views = views    }    var body: some View {        ZStack {            ForEach(views.indices) { i in                self.views[i].view                    .opacity(self.selectedIndex == i ? 1 : 0)            }            GeometryReader { geometry in                VStack {                    Spacer()                    ZStack(alignment: .top) {                        LinearGradient(gradient: Gradient(colors: [Color.black.opacity(0.3), Color.black.opacity(0.4)]), startPoint: .top, endPoint: .bottom)                            .frame(height: 70 + geometry.safeAreaInsets.bottom)                        HStack {                            ForEach(self.views.indices) { i in                                Button(action: {                                    self.selectedIndex = i                                }) {                                    VStack {                                        if self.selectedIndex == i {                                            self.views[i].image                                                .foregroundColor(.white)                                                 .padding(.top,10)                                                .font(.title)                                        } else {                                            self.views[i].image                                                .foregroundColor(Color.white.opacity(0.4))                                                .padding(.top,10)                                               .font(.title)                                        }                                        Text(self.views[i].title)                                            .foregroundColor(.white)                                            .font(Font.system(size: 16, weight: .bold))                                            .padding(.top,10)                                            .opacity(0.5)                                    }                                    .frame(maxWidth: .infinity)                                }                            }                        }                    }                }                .edgesIgnoringSafeArea(.bottom)                .animation(.easeInOut)            }        }    }}struct TabBarItem {    var view: AnyView    var image: Image    var title: String    init<V: View>(view: V, image: Image, title: String) {        self.view = AnyView(view)        self.image = image        self.title = title    }}/// Main Viewstruct ContentView: View {  var body: some View {    TabView([      TabBarItem(view: Text("This is home screen"),                 image: Image(systemName:"house.fill"),                 title: "home"),      TabBarItem(view: Text("2"),                 image: Image(systemName:"heart.fill"),                 title: "favorite"),    ])  }}

enter image description here