Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

lorenzofiamingo/swiftui-vertical-tab-view

Repository files navigation

SwiftUI VerticalTabView πŸ”

VTabView is a native way to display paged vertical content in SwiftUI.

To work it makes use of the new iOS 14 TabView PageTabViewStyle.

Usage

Use like any other TabView:

import SwiftUI
import VTabView
VTabView {
 Text("The First Tab")
 .tabItem {
 Image(systemName: "square.fill")
 }
 Text("Another Tab")
 .tabItem {
 Image(systemName: "circle.fill")
 }
 Text("The Last Tab")
 .tabItem {
 Image(systemName: "triangle.fill")
 }
}
.tabViewStyle(PageTabViewStyle())

You can also move index to the right

VTabView(indexPosition: .trailing) {
 ...
}
.tabViewStyle(PageTabViewStyle())

or remove it

VTabView {
 ...
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))

Limitation

TabView bounces in all directions by default.

VTabView is meant to be used with .tabViewStyle(PageTabViewStyle()) but you can also use DefaultTabViewStyle. Only remember that tab items will not have the orientation you would probably like to obtain. A workaround for this would be in tabItem to not use Text but only an Image correctly transformed.

Installation

  1. In Xcode, open your project and navigate to File β†’ Swift Packages β†’ Add Package Dependency...
  2. Paste the repository URL (https://github.com/lorenzofiamingo/swiftui-vertical-tab-view) and click Next.
  3. Click Finish.

Other projects

SwiftUI VariadicViews πŸ₯ž

SwiftUI AsyncButton πŸ–²οΈ

SwiftUI MapItemPicker πŸ—ΊοΈ

SwiftUI PhotosPicker πŸŒ‡

SwiftUI CachedAsyncImage πŸ—ƒοΈ

SwiftUI SharedObject 🍱

About

VerticalTabView is a native way to display paged vertical content in SwiftUI.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /