base_url_switcher 2.2.1
base_url_switcher: ^2.2.1 copied to clipboard
A Flutter package for switching between base URLs with a beautiful UI switcher
Base URL Switcher #
The simplest way to switch Base URLs in Flutter ๐
โก Ultra Simple - Just 3 Steps! #
1๏ธโฃ Add the Package #
dependencies:
base_url_switcher: ^2.2.0
2๏ธโฃ Add URLs in main.dart #
import 'package:base_url_switcher/base_url_switcher.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
// Just add URLs - everything else is automatic!
await EnvService.initialize(
developmentUrl: 'https://dev-api.mycompany.com',
productionUrl: 'https://api.mycompany.com',
defaultEnvironment: EnvironmentType.development,
);
runApp(MyApp());
}
3๏ธโฃ Wrap the Widget You Want to Tap #
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('My App')),
body: SimpleBaseUrlWrapper(
// Wrap the widget that users will tap on to access settings
child: YourWidget(),
),
),
);
}
}
๐ก Important: The SimpleBaseUrlWrapper should wrap the widget that users will tap on to access the environment settings. This could be:
- The entire body of your app
- A specific button or logo
- Any interactive widget where you want the hidden access
๐ฏ How It Works? #
- Tap 7 times on the wrapped widget (the one inside
SimpleBaseUrlWrapper) - Enter password (default: "admin")
- Switch environment and use the new Base URL
๐ Where to tap: Users tap on the widget that's wrapped with SimpleBaseUrlWrapper. This could be your app's body, a logo, or any specific area you choose.
๐ป Using Base URL in Code #
// Anywhere in your app
final url = BaseUrlManager.instance.currentBaseUrl;
final response = await http.get(Uri.parse('$url/api/users'));
๐จ Customize Access #
// Example 1: Wrap entire app body
SimpleBaseUrlWrapper(
password: "myapp123", // Custom password
tapCount: 5, // 5 taps instead of 7
child: YourWidget(),
)
// Example 2: Wrap only a specific logo/button
SimpleBaseUrlWrapper(
child: Image.asset('assets/logo.png'), // Users tap on logo
)
// Example 3: Wrap a specific area
SimpleBaseUrlWrapper(
child: Container(
width: 100,
height: 100,
color: Colors.blue,
child: Center(child: Text('Tap here')),
),
)
โ๏ธ Custom Configurations #
Add your own configuration items with automatic toggle state management! The toggle button manages its own state automatically - no need for external state management.
โจ Key Features: #
- Auto Toggle: The switch button changes automatically when tapped
- Initial Value: Set the initial state via
enabledparameter - State Callback: Receive the new state in
onTapcallback - No External State: No need for
setStateor state variables
SimpleBaseUrlWrapper(
configurations: [
ConfigurationItem(
title: 'Network Inspector',
description: 'Enable network inspection',
enabled: ChuckerFlutter.showOnRelease, // Initial value from outside
onTap: (newState) {
// Your logic here - toggle happens automatically!
// newState is the new enabled state after toggle
ChuckerFlutter.isDebugMode = newState;
ChuckerFlutter.showOnRelease = newState;
},
),
// Another configuration - simple action
ConfigurationItem(
title: 'Clear Cache',
description: 'Clear all cached data',
enabled: true,
onTap: (newState) {
// Your clear cache logic here
// newState is true after toggle
},
),
],
child: YourWidget(),
)
๐ How It Works: #
- Initial State: The toggle button shows the value from
enabledparameter - Auto Toggle: When you tap, the button changes automatically (no
setStateneeded!) - Callback: The
onTapcallback receives the new state as(bool newState) - Your Logic: Implement your feature logic in the callback
No need for external state management! ๐
๐ฑ Show Environment Info #
AppBar(
title: Text('My App'),
actions: [
EnvironmentIndicator(), // Current environment indicator
],
)
// Or anywhere
EnvironmentInfo(
showBaseUrl: true,
showDescription: true,
)
๐ Features #
- โ Setup in 3 steps - No more!
- โ Hidden access - Multiple taps to access
- โ Password protection - Customizable
- โ Ready-to-use screen - No coding needed
- โ Auto save - Remembers your choice
- โ Environment indicator - Shows current environment
- โ Comprehensive tests - 21/21 tests passed
๐ง Advanced Setup #
Add Staging Environment #
await EnvService.initialize(
developmentUrl: 'https://dev-api.com',
productionUrl: 'https://api.com',
stagingUrl: 'https://staging-api.com', // Optional
defaultEnvironment: EnvironmentType.development,
);
Access Settings Manually #
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => EnvSwitcherScreen(),
),
);
Use Widget Instead of Wrapper #
AppBar(
actions: [
EnvSwitcher(
onEnvironmentChanged: (env) {
print('Switched to ${env.name}');
},
),
],
)
๐ API Reference #
EnvService.initialize() #
static Future<void> initialize({
String? developmentUrl, // Development environment URL
String? productionUrl, // Production environment URL
String? stagingUrl, // Staging environment URL (optional)
EnvironmentType? defaultEnvironment, // Default environment
});
BaseUrlManager #
// Get current Base URL
String get currentBaseUrl;
// Get current environment name
String get currentEnvironmentName;
// Get current environment object
Environment get currentEnvironment;
EnvironmentType Enum #
enum EnvironmentType {
development,
staging,
production,
local,
}
// Usage
EnvironmentType.development.displayName // "Development"
EnvironmentType.production.description // "Production environment"
SimpleBaseUrlWrapper #
class SimpleBaseUrlWrapper extends StatelessWidget {
final Widget child; // Widget to wrap
final String? password; // Password (default: "admin")
final int? tapCount; // Number of taps (default: 7)
final List<ConfigurationItem>? configurations; // Custom configurations
}
ConfigurationItem #
class ConfigurationItem {
final String title; // Configuration title
final String? description; // Optional description
final bool enabled; // Initial enabled state
final Function(bool newState)? onTap; // Callback when tapped (receives new state)
final Widget? customWidget; // Optional custom widget
}
Note: The toggle button manages its own state automatically. The enabled parameter sets the initial state, and onTap receives the new state after toggle.
๐ Complete Example #
import 'package:flutter/material.dart';
import 'package:base_url_switcher/base_url_switcher.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await EnvService.initialize(
developmentUrl: 'https://dev-api.mycompany.com',
productionUrl: 'https://api.mycompany.com',
defaultEnvironment: EnvironmentType.development,
);
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('My App'),
actions: [EnvironmentIndicator()],
),
body: SimpleBaseUrlWrapper(
password: "myapp123",
tapCount: 5,
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('Current Environment: ${BaseUrlManager.instance.currentEnvironmentName}'),
Text('Base URL: ${BaseUrlManager.instance.currentBaseUrl}'),
ElevatedButton(
onPressed: () async {
final response = await http.get(
Uri.parse('${BaseUrlManager.instance.currentBaseUrl}/api/users'),
);
print('Response: ${response.body}');
},
child: Text('Test API Call'),
),
],
),
),
),
),
);
}
}
๐ฆ Installation #
flutter pub add base_url_switcher
๐งช Testing #
flutter test
๐ License #
MIT License - see LICENSE file for details.
โญ Support #
If you find this package helpful, please give it a โญ on pub.dev!
Made with โค๏ธ for the Flutter community