adaptive_platform_ui 0.1.2 copy "adaptive_platform_ui: ^0.1.2" to clipboard
adaptive_platform_ui: ^0.1.2 copied to clipboard

Adaptive platform-specific widgets for Flutter. Automatically renders native iOS 26+ designs, traditional Cupertino widgets for older iOS versions, and Material Design for Android.

Adaptive Platform UI #

A Flutter package that provides adaptive platform-specific widgets with native iOS 26+ designs, traditional Cupertino widgets for older iOS versions, and Material Design for Android.

iOS 26+ Native Toolbar & Tab Bar #

iOS 26 Native Toolbar iOS 26 Native Tab Bar

Native iOS 26 UIToolbar and UITabBar with Liquid Glass blur effects, minimize behavior, and native gesture handling.

Features #

✨ iOS 26+ Native Designs - Modern iOS 26 components with:

  • Native UIToolbar - Liquid Glass blur effects with native iOS 26 design
  • Native UITabBar - Tab bar with minimize behavior and smooth animations
  • Native UIButton - Button styles with spring animations and haptic feedback
  • Native UISegmentedControl - Segmented controls with SF Symbol support
  • Native UISwitch & UISlider - Switches and sliders with native animations
  • Native corner radius and shadows
  • Smooth spring animations
  • Dynamic color system (light/dark mode)
  • Multiple component styles

🍎 iOS Legacy Support - Traditional Cupertino widgets for iOS 25 and below

πŸ€– Material Design - Full Material 3 support for Android

πŸ” Automatic Platform Detection - Zero configuration required

πŸ“± Version-Aware Rendering - Automatically selects appropriate widget based on iOS version

Installation #

Add this to your package's pubspec.yaml file:

dependencies:
  adaptive_platform_ui: ^0.1.0

Then run:

flutter pub get

Widget Showcase #

AdaptiveScaffold with Native Toolbar & Tab Bar #

Native Toolbar

AdaptiveScaffold(
  title: 'My App',
  actions: [
    AdaptiveAppBarAction(
      onPressed: () {},
      iosSymbol: 'gear',
      androidIcon: Icons.settings,
    ),
  ],
  destinations: [
    AdaptiveNavigationDestination(
      icon: 'house.fill',
      label: 'Home',
    ),
    AdaptiveNavigationDestination(
      icon: 'person.fill',
      label: 'Profile',
    ),
  ],
  selectedIndex: 0,
  onDestinationSelected: (index) {},
  child: YourContent(),
)

AdaptiveButton #

Adaptive Buttons

// Basic button with label
AdaptiveButton(
  onPressed: () {},
  label: 'Click Me',
)

// Button with custom child
AdaptiveButton.child(
  onPressed: () {},
  child: Row(
    children: [
      Icon(Icons.add),
      Text('Add Item'),
    ],
  ),
)

// Icon button
AdaptiveButton.icon(
  onPressed: () {},
  icon: Icons.favorite,
)

AdaptiveSegmentedControl #

Segmented Control

AdaptiveSegmentedControl(
  labels: ['One', 'Two', 'Three'],
  selectedIndex: 0,
  onValueChanged: (index) {
    print('Selected: $index');
  },
)

// With icons (SF Symbols on iOS)
AdaptiveSegmentedControl(
  labels: [],
  sfSymbols: [
    'house.fill',
    'person.fill',
    'gear',
  ],
  selectedIndex: 0,
  onValueChanged: (index) {},
  iconColor: CupertinoColors.systemBlue,
)

AdaptiveSwitch #

Adaptive Switch

AdaptiveSwitch(
  value: true,
  onChanged: (value) {
    print('Switch: $value');
  },
)

AdaptiveSlider #

Adaptive Slider

AdaptiveSlider(
  value: 0.5,
  onChanged: (value) {
    print('Slider: $value');
  },
  min: 0.0,
  max: 1.0,
)

AdaptiveAlertDialog #

Alert Dialog

showAdaptiveAlertDialog(
  context: context,
  title: 'Confirm',
  message: 'Are you sure?',
  icon: 'checkmark.circle.fill',
  actions: [
    AlertAction(
      title: 'Cancel',
      style: AlertActionStyle.cancel,
      onPressed: () => Navigator.pop(context),
    ),
    AlertAction(
      title: 'Confirm',
      style: AlertActionStyle.primary,
      onPressed: () {
        Navigator.pop(context);
        // Do something
      },
    ),
  ],
);

AdaptivePopupMenuButton #

Popup Menu

AdaptivePopupMenuButton<String>(
  buttonLabel: 'Options',
  items: [
    PopupMenuItem(value: 'edit', label: 'Edit', icon: 'pencil'),
    PopupMenuItem(value: 'delete', label: 'Delete', icon: 'trash', destructive: true),
    PopupMenuItem(value: 'share', label: 'Share', icon: 'square.and.arrow.up'),
  ],
  onSelected: (value) {
    print('Selected: $value');
  },
)

Usage #

Button Styles #

// Filled button (primary action)
AdaptiveButton(
  onPressed: () {},
  style: AdaptiveButtonStyle.filled,
  label: 'Filled',
)

// Tinted button (secondary action)
AdaptiveButton(
  onPressed: () {},
  style: AdaptiveButtonStyle.tinted,
  label: 'Tinted',
)

// Gray button (neutral action)
AdaptiveButton(
  onPressed: () {},
  style: AdaptiveButtonStyle.gray,
  label: 'Gray',
)

// Bordered button
AdaptiveButton(
  onPressed: () {},
  style: AdaptiveButtonStyle.bordered,
  label: 'Bordered',
)

// Plain text button
AdaptiveButton(
  onPressed: () {},
  style: AdaptiveButtonStyle.plain,
  label: 'Plain',
)

Button Sizes #

// Small button (28pt height on iOS)
AdaptiveButton(
  onPressed: () {},
  size: AdaptiveButtonSize.small,
  label: 'Small',
)

// Medium button (36pt height on iOS) - default
AdaptiveButton(
  onPressed: () {},
  size: AdaptiveButtonSize.medium,
  label: 'Medium',
)

// Large button (44pt height on iOS)
AdaptiveButton(
  onPressed: () {},
  size: AdaptiveButtonSize.large,
  label: 'Large',
)

Custom Styling #

AdaptiveButton(
  onPressed: () {},
  label: 'Custom Button',
  color: Colors.red,
  padding: EdgeInsets.symmetric(horizontal: 24, vertical: 12),
  borderRadius: BorderRadius.circular(16),
  minSize: Size(200, 50),
)

Disabled State #

AdaptiveButton(
  onPressed: () {},
  label: 'Disabled',
  enabled: false,
)

Platform Detection #

Use the PlatformInfo utility class to check platform and iOS version:

import 'package:adaptive_platform_ui/adaptive_platform_ui.dart';

// Check platform
if (PlatformInfo.isIOS) {
  print('Running on iOS');
}

if (PlatformInfo.isAndroid) {
  print('Running on Android');
}

// Check iOS version
if (PlatformInfo.isIOS26OrHigher()) {
  print('Using iOS 26+ features');
}

if (PlatformInfo.isIOS25OrLower()) {
  print('Using legacy iOS widgets');
}

// Get iOS version number
int version = PlatformInfo.iOSVersion; // e.g., 26

// Check version range
if (PlatformInfo.isIOSVersionInRange(24, 26)) {
  print('iOS version is between 24 and 26');
}

// Get platform description
String description = PlatformInfo.platformDescription; // e.g., "iOS 26"

iOS 26 Native Features #

When running on iOS 26+, widgets automatically use native UIKit platform views with Liquid Glass design:

Platform Architecture #

  • Native UIKit Views: Uses UiKitView to render actual iOS 26 UIKit components
  • Platform Channels: Bidirectional communication between Flutter and native iOS code
  • Liquid Glass Design: Authentic iOS 26 visual effects rendered by UIKit
  • Zero Overhead: No custom painting or emulation - pure native rendering

Visual Features #

  • Modern corner radius: Native iOS 26 design language
  • Dynamic shadows: Subtle multi-layer shadows
  • Spring animations: Smooth spring damping with 0.95x scale on press
  • Native color system: Uses iOS system colors with proper light/dark mode support
  • Liquid Glass effects: Native iOS 26 translucency and blur effects
  • SF Symbols: Native SF Symbol rendering with hierarchical color support

Interaction #

  • Press states: Visual feedback with scale animation
  • Gesture handling: Native UIKit gesture recognizers
  • Haptic feedback: Medium impact feedback on interactions
  • Disabled states: Proper opacity and interaction blocking

Typography #

  • SF Pro font: Native iOS system font with proper weights
  • Dynamic Type: Respects system font size settings
  • Weight: Appropriate font weights for each component

Example App #

Run the example app to see all widgets in action:

cd example
flutter run

The example app includes:

  • Platform information display
  • All widget types showcase
  • Interactive demos
  • Style and size comparisons
  • Dark mode support

Widget Catalog #

Currently available adaptive widgets:

  • βœ… AdaptiveScaffold - Scaffold with native iOS 26 toolbar and tab bar
  • βœ… AdaptiveButton - Buttons with iOS 26+ native designs
  • βœ… AdaptiveSegmentedControl - Native segmented controls
  • βœ… AdaptiveSwitch - Native switches
  • βœ… AdaptiveSlider - Native sliders
  • βœ… AdaptiveAlertDialog - Native alert dialogs
  • βœ… AdaptivePopupMenuButton - Native popup menus

Design Philosophy #

This package follows Apple's Human Interface Guidelines for iOS and Material Design guidelines for Android. The goal is to provide:

  1. Native Look & Feel: Widgets that feel at home on each platform
  2. Zero Configuration: Automatic platform detection and adaptation
  3. Version Awareness: Leverage new platform features while maintaining backward compatibility
  4. Consistency: Unified API across platforms
  5. Customization: Allow overrides when needed

iOS Version Support #

  • iOS 26+: Modern native iOS 26 designs
  • iOS 25 and below: Traditional Cupertino widgets
  • Automatic fallback: Seamless degradation for older versions

Requirements #

  • Flutter SDK: >=1.17.0
  • Dart SDK: ^3.9.2

Contributing #

Contributions are welcome! Please feel free to submit a Pull Request.

License #

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments #

  • Inspired by cupertino_native
  • Design guidelines from Apple's Human Interface Guidelines
  • Material Design guidelines from Google

Author #

Berkay Γ‡atak

Support #

For issues, feature requests, or questions, please file an issue on the GitHub repository.

153
likes
0
points
1.52k
downloads

Publisher

verified publishermedialyra.com

Weekly Downloads

Adaptive platform-specific widgets for Flutter. Automatically renders native iOS 26+ designs, traditional Cupertino widgets for older iOS versions, and Material Design for Android.

Repository (GitHub)
View/report issues

License

unknown (license)

Dependencies

flutter

More

Packages that depend on adaptive_platform_ui

Packages that implement adaptive_platform_ui