tqtuan1201/ttbaseuikit

---

Overview

TTBaseUIKit is an enterprise-grade iOS framework that eliminates boilerplate and accelerates development by providing 100+ production-ready base views for both UIKit (programmatic) and SwiftUI (declarative). Ship production UI in hours, not days.

Key Numbers

| Metric | Count | |--------|-------| | UIKit Components | 72+ | | SwiftUI Views | 51+ | | AI Agent Skills | 17 | | Production Apps Shipped | 36+ | | Users Reached | 5M+ |

Features

🧱 UIKit Foundation

Production-ready programmatic views with zero Storyboard/XIB dependency:

TTBaseUIViewController, TTBaseUITableViewController, TTBaseUICollectionViewController
TTBaseUIView, TTBaseUILabel, TTBaseUIButton, TTBaseUITextField, TTBaseUITextView
TTBaseUIImageView, TTBaseUIStackView, TTBaseUIScrollView
ViewCodable protocol — structured lifecycle: setupData → makeUI → makeConstraints → bindViewModel
Popup, Notification, Skeleton Loading, Segmented Control, PIN Input, and more
Programmatic Auto Layout helpers — chainable, clean constraint syntax

🎨 SwiftUI Modernity (v2.3.0+)

Full SwiftUI support targeting iOS 14+:

BaseSUIView, BaseSUIText, BaseSUIButton, BaseSUIImage
BaseSUIList, BaseSUIGroup, BaseSUITabView, BaseSUINavLink
BaseSUISlider, BaseSUIToggle, BaseSUITextField, BaseSUIProgress
View modifiers: ttFont(), ttShadow(), ttPadding()
Built-in Shimmer / Skeleton loading animations

🛠 Built-in UI Debug Kit (v2.2.1+)

Activate with a single line — no additional dependencies:

Triple-tap Layout Inspector — visualize constraints and view hierarchy
API Response Log Viewer — inspect request/response data in-app
Screen Capture — annotate screenshots and share with team
Developer Settings Panel — toggle environments, feature flags

LogViewHelper.share.config(
    withDes: "Debug Panel",
    isStartAppToShow: false,
    passCode: ""
).onShow()
// Long-press any screen to open | Triple-tap to inspect layout

🖥 TTBDebugPlus — macOS Companion Debugger

A professional-grade native macOS app for debugging iOS applications in real-time. Built entirely with SwiftUI.

⚠️ Requires TTBaseUIKit v2.3.0 or later. The DebugBridge SDK is included from version 2.3.0+.

| Feature | Description | |---------|-------------| | 📋 Live Console | Real-time log streaming with level filtering & JSON inspector | | 🌐 Network Inspector | Full HTTP inspection, JSON Tree Viewer, cURL & Postman export | | 📱 Device Control | Remote screenshot, dark mode toggle, app lifecycle management | | 📊 Performance Monitor | CPU, Memory, FPS charts, bandwidth monitoring, API analytics | | 💬 Feedback Reporter | Structured bug reports with annotated screenshots | | 📤 Export & Share | Postman Collection v2.1, cURL, session files (.ttbdebug) |

Architecture: iOS ↔ Bonjour (mDNS) ↔ WebSocket ↔ macOS — zero configuration, auto-discovery.

<table> <tr> <td align="center" width="50%"> 🚀 iOS SDK Integration Guide <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/ttbdebugplus-guide.png" alt="TTBDebugPlus Integration Guide" width="100%"/> </td> <td align="center" width="50%"> 📱 Device Control & Screenshot <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/ttbdebugplus-device.png" alt="TTBDebugPlus Device Control" width="100%"/> </td> </tr> <tr> <td align="center" width="50%"> ✏️ Screenshot Annotation <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/ttbdebugplus-annotation.png" alt="TTBDebugPlus Annotation" width="100%"/> </td> <td align="center" width="50%"> 🛠 Dev Tools — JSON Editor <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/ttbdebugplus-devtools.png" alt="TTBDebugPlus Dev Tools" width="100%"/> </td> </tr> </table>

📥 Download TTBDebugPlus for macOS (.dmg • 5.8 MB • macOS 14+ • Universal)

📖 Full documentation & SDK integration guide →

🤖 AI Agent Ready

Pre-configured for modern AI coding assistants:

GitHub Copilot — custom instructions & workspace prompts
Claude Code — CLAUDE.md with project context
Xcode Agent Skills — 17 custom agent skills
Google Gemini — GEMINI.md configuration
OpenAI Codex — codex.md setup

📖 Explore AI Agent Skills →

🎨 Configurable Design System

Control every aspect of your app's appearance globally:

let view = ViewConfig()
view.viewBgNavColor = .systemBlue
view.buttonBgDef    = .systemBlue
view.viewBgColor    = .white

let size = SizeConfig()
size.H_BUTTON = 44.0
size.H_SEG    = 50.0

let font = FontConfig()
font.HEADER_H       = 16
font.TITLE_H        = 14
font.SUB_TITLE_H    = 12

TTBaseUIKitConfig.withDefaultConfig(
    withFontConfig: font,
    frameSize: size,
    view: view
)?.start(withViewLog: true)

| Config | Purpose | Reference | |--------|---------|-----------| | ViewConfig | Colors for buttons, labels, backgrounds, navigation | Global theme | | SizeConfig | Heights, corner radius, icon sizes, spacing | Layout system | | FontConfig | Typography scale: header, title, subtitle, body | Type system |

Installation

Swift Package Manager (Recommended)

Via Xcode:

File → Add Package Dependencies...
Enter URL: https://github.com/tqtuan1201/TTBaseUIKit.git
Select "Up to Next Major" from 2.3.0

Via Package.swift:

dependencies: [
    .package(url: "https://github.com/tqtuan1201/TTBaseUIKit.git", from: "2.3.0")
]

CocoaPods

pod 'TTBaseUIKit'

Carthage

github "tqtuan1201/TTBaseUIKit"

Manual

Clone or download the repository
Add TTBaseUIKit.xcodeproj to your project
Add TTBaseUIKit.framework as an embedded binary (General tab) and target dependency (Build Phases tab)

Quick Start

import UIKit
import TTBaseUIKit

@main
class AppDelegate: UIResponder, UIApplicationDelegate {

    var window: UIWindow?

    func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
    ) -> Bool {

        // 1. Configure design system
        let view = ViewConfig()
        let size = SizeConfig()
        let font = FontConfig()
        
        TTBaseUIKitConfig.withDefaultConfig(
            withFontConfig: font,
            frameSize: size,
            view: view
        )?.start(withViewLog: true)

        // 2. (Optional) Enable debug bridge for TTBDebugPlus macOS
        #if DEBUG
        TTDebugBridge.shared.start()
        LogInterceptor.shared.install()
        #endif

        // 3. Set root view controller
        window = UIWindow(frame: UIScreen.main.bounds)
        window?.rootViewController = UINavigationController(
            rootViewController: HomeViewController()
        )
        window?.makeKeyAndVisible()
        
        return true
    }
}

Usage Examples

UIKit — Custom ViewController

import TTBaseUIKit

class HomeViewController: TTBaseUIViewController<TTBaseUIView> {

    let titleLabel = TTBaseUILabel()
    let actionButton = TTBaseUIButton()

    override func viewDidLoad() {
        super.viewDidLoad()
    }
}

extension HomeViewController: TTViewCodable {

    func setupStyles() {
        titleLabel.setText(text: "Welcome")
        actionButton.setText(text: "Get Started")
    }

    func setupCustomView() {
        view.addSubview(titleLabel)
        view.addSubview(actionButton)
    }

    func setupConstraints() {
        titleLabel.setTopAnchor(constant: 20)
        titleLabel.setCenterXAnchor(constant: 0)
        actionButton.setTopAnchor(titleLabel, constant: 16)
        actionButton.setCenterXAnchor(constant: 0)
    }
}

SwiftUI — Declarative View

import TTBaseUIKit

struct HomeView: BaseSUIView {
    var body: some View {
        VStack(spacing: 16) {
            BaseSUIText("Welcome to TTBaseUIKit")
                .ttFont(type: .HEADER_H)
                .foregroundColor(.primary)

            BaseSUIButton(title: "Get Started") {
                // action
            }
            .ttButtonStyle(.filled)

            BaseSUIList(items: viewModel.items) { item in
                ItemRowView(item: item)
            }
        }
        .baseSUIPadding()
    }
}

Auto Layout Helpers

// Chainable programmatic constraints
myView.setTopAnchor(constant: 16)
myView.setLeadingAnchor(constant: 20)
myView.setTrailingAnchor(constant: 20)
myView.setBottomAnchor(constant: 16)
myView.setCenterXAnchor(constant: 0)
myView.setcenterYAnchor(constant: 0)

UI Components

// Notification banner
let noti = TTBaseNotificationViewConfig(with: window)
noti.setText(with: "Success!", subTitle: "Operation completed")
noti.notifiType = .SUCCESS
noti.onShow()

// Popup dialog
let popup = TTPopupViewController(
    title: "Confirm",
    subTitle: "Are you sure?",
    isAllowTouchPanel: true
)
present(popup, animated: true)

// Empty state for table view
tableView.setStaticBgNoData(
    title: "No Data",
    des: "Nothing to show yet"
) {
    print("Retry tapped")
}

Project Structure

TTBaseUIKit/
├── Sources/TTBaseUIKit/
│   ├── BaseConfig/          # ViewConfig, SizeConfig, FontConfig
│   ├── Coordinators/        # Navigation coordination
│   ├── CustomView/          # 72+ UIKit base views
│   │   ├── BaseUIView/
│   │   ├── BaseUILabel/
│   │   ├── BaseUIButton/
│   │   ├── BaseUITextField/
│   │   ├── BaseUITableView/
│   │   ├── BaseUICollectionView/
│   │   ├── ViewCodable/
│   │   └── ...
│   ├── SwiftUIView/         # 51+ SwiftUI views
│   │   ├── BaseSUIView/
│   │   ├── BaseSUIText/
│   │   ├── BaseSUIButton/
│   │   └── ...
│   ├── Extensions/          # String, Date, JSON, Device utilities
│   └── Support/
│       ├── DebugBridge/     # TTBDebugPlus iOS SDK
│       └── Resources/      # Fonts, Images
├── TTBaseUIKitExample/      # Official sample project
├── TTBDebugPlus/            # macOS companion app (Xcode project)
├── Agents/                  # AI agent configurations
├── docs/                    # Documentation website
├── Package.swift
├── TTBaseUIKit.podspec
└── LICENSE

🎯 Best Practice — Run First, Read Code Later

The fastest way to learn TTBaseUIKit: Clone the example project, run it first, explore all features in action — then study the code. Developers who run examples first learn frameworks 10x faster.

📖 Full Best Practice Guide →

Quick Start (60 seconds)

git clone https://github.com/tqtuan1201/TTBaseUIKit.git
open TTBaseUIKit.xcodeproj

What's Inside TTBaseUIKitExample

The TTBaseUIKitExample is a full-featured sample app with 5 tabs:

| Tab | Description | Tech | |-----|-------------|------| | 📋 Menu | Framework overview, theme config, base components showcase | UIKit | | ✨ Demos | 7 real-world demos — Recipe Book, Product Catalog, User Directory, Social Feed, Quotes Wall, Todo Manager, Photo Gallery | SwiftUI + API | | 🔗 DebugBridge | TTBDebugPlus macOS companion — real-time logs, network inspector, remote screenshots | v2.3.0+ | | 🔍 UI Debug | Built-in TTBaseDebugKit — layout inspector, API logger, screen capture | v2.2.1+ | | 👤 Contact | Author info and portfolio links | UIKit |

Example Screenshots

<table> <tr> <td align="center" width="25%"> 📋 Menu <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/sample/iOS_sam_01.jpeg" alt="Menu Tab" width="100%"/> </td> <td align="center" width="25%"> ✨ Demos <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/sample/iOS_sam_02.jpeg" alt="Demos Tab" width="100%"/> </td> <td align="center" width="25%"> 🔗 DebugBridge <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/sample/iOS_sam_03.jpeg" alt="DebugBridge Tab" width="100%"/> </td> <td align="center" width="25%"> 🔍 UI Debug <img src="https://tqtuan1201.github.io/public/docs/ttbaseuikit/images/sample/iOS_sam_04.jpeg" alt="UI Debug Tab" width="100%"/> </td> </tr> </table>

Code Architecture

The example follows a clean architecture pattern:

AppDelegate (Config) → AppCoordinator (TabBar) → ViewControllers (ViewCodable)

AppDelegate — Configure ViewConfig, SizeConfig, FontConfig, StyleConfig, ParamConfig + start TTDebugBridge
AppCoordinator — Setup UITabBarController with 5 tabs using Coordinator pattern
ViewControllers — Implement ViewCodable protocol: setupData → makeUI → makeConstraints → bindViewModel

UIKit Demo Categories

The Menu tab includes 11 UIKit demo categories:

| Demo | What It Shows | |------|---------------| | Auto Layout | Programmatic constraints with chainable helpers | | Calendar | Custom calendar view implementation | | Cell Types | Table/Collection cell patterns | | CollectionView | BaseUICollectionViewController demos | | Components | Buttons, labels, text fields, images | | Empty Table | Empty state + retry pattern | | Message | Notification banners & alerts | | Popup | Modal dialogs & bottom sheets | | Skeleton | Loading placeholder animations | | TableView | BaseUITableViewController patterns | | ViewController | ViewCodable lifecycle demos |

Apps Built with TTBaseUIKit

<table> <tr> <td align="center" width="25%"> 12Bay iOS ✈️ Travel • #20 App Store VN UIKit + SwiftUI • MVVM/VIPER </td> <td align="center" width="25%"> Aihealth - Truedoc 🏥 Healthcare • Pre-Series A UIKit • AI Diagnostics </td> <td align="center" width="25%"> TMS Mobile 🚛 Logistics UIKit • Real-time GPS </td> <td align="center" width="25%"> WECARE 247 🫶 Care Management UIKit + SwiftUI </td> </tr> <tr> <td align="center" width="25%"> 12Bay macOS 🖥️ Mac Catalyst Shared codebase with iOS </td> <td align="center" width="25%"> AiDoctor ⚕️ Telemedicine UIKit • Video Consult </td> <td align="center" width="25%"> AiPharmacy 💊 Pharmacy UIKit • Order Management </td> <td align="center" width="25%"> Contacts Plus 👤 Productivity UIKit • App Store </td> </tr> </table>

36+ production apps shipped across Travel, Healthcare, Logistics, Education, and more. See full showcase → Apps Showcase

Documentation

| Resource | Link | |----------|------| | 📖 Full Documentation | tqtuan1201.github.io/public/docs/ttbaseuikit | | 🚀 Getting Started | Installation & Setup Guide | | 🧱 UIKit Components | 72+ Component Docs | | 🎨 SwiftUI Views | 51+ View Docs | | 🛠 TTBDebugPlus | macOS Debugger & SDK Guide | | 🤖 AI Agent Skills | 17 Agent Configurations | | 🎯 Best Practice | Run First, Read Code Later | | 🎬 Project Demo | TTBaseUIKitExample Demo | | 📱 Apps Showcase | 36+ Production Apps | | 📝 Author's Blog | Technical Articles |

Requirements

| Requirement | Minimum | |-------------|---------| | iOS | 14.0+ | | macOS (Catalyst) | 10.15+ | | Swift | 5.0+ | | Xcode | 13.0+ | | TTBDebugPlus (macOS) | macOS 14+ |

Contributing

Contributions are welcome! Feel free to:

Fork the repository
Create a feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

If you find TTBaseUIKit useful, please consider giving it a ⭐ — it helps others discover the project.

Author

Truong Quang Tuan — Mobile Lead & Framework Author

🌐 Website: tqtuan1201.github.io
📧 Email: truongquangtuanit@gmail.com
👤 Portfolio: tqtuan1201.github.io/portfolio
👥 Meet the Team: Our Team

We build high-quality apps. Get in touch if you need help with a project.

License

TTBaseUIKit is available under the MIT License. See the LICENSE file for details.

MIT License — Copyright (c) 2019 Quang Tuan

Package Metadata

Repository: tqtuan1201/ttbaseuikit

Default branch: master

README: README.md