flutter_device_preview
flutter_device_preview copied to clipboard
feat: add quick device tools and theme switching to DevicePreview
Device Preview Package - Enhancement Update
🚀 Overview
This PR introduces significant improvements and new features to the device_preview package. The main focus is on quick device selection tools, theme switching capabilities, and overall user experience enhancements.
✨ New Features
1. Quick Device Selection
- Compact device icon widget added
- Quick device view with new compact interface
- Toast notifications support for device selection
- Automatic icon selection based on device types
2. Theme Switching Features
- Theme change callback support (
onThemeChanged) - Initial dark mode setting (
initialDarkMode) - Theme toggle button
- Theme state tracking and notification system
3. Enhanced Configuration Options
enableQuickDevicesTools: Enable quick device toolsshowDeviceToast: Device selection notificationsshowThemeToggle: Theme toggle button visibility- ScaffoldMessenger integration for global access
🔧 Technical Improvements
Code Structure
- New widget class organization
- Modular structure for tool panel
- Better state management
- Comprehensive dartdoc documentation
📁 File Changes
New Files
lib/src/views/tool_panel/widgets/
├── compact_device_icon.dart # Compact device icon widget
├── compact_quick_devices_view.dart # Quick device selection view
├── tool_panel_widget.dart # Main tool panel widget
└── widgets.dart # Widget export file
Main Changes
device_preview.dart: New parameters and configuration optionsstate.dart: Added quickDeviceTools fieldstore.dart: Theme callbacks and initial settingstool_panel.dart: Enhanced tool panel configuration
🎯 Usage Examples
Basic Usage
DevicePreview(
enabled: true,
enableQuickDevicesTools: true,
showDeviceToast: true,
showThemeToggle: true,
onThemeChanged: (isDark) {
print('Theme changed to: ${isDark ? 'Dark' : 'Light'}');
},
quickDevices: [
Devices.ios.iPhone13ProMax,
Devices.ios.iPadPro11Inches,
],
builder: (context) => const MyApp(),
)
Advanced Configuration
DevicePreview(
enabled: true,
enableQuickDevicesTools: true, // Quick device tools
showDeviceToast: true, // Toast notifications
showThemeToggle: true, // Theme toggle button
initialDarkMode: false, // Initial theme setting
onThemeChanged: handleThemeChange,
quickDevices: customDeviceList,
builder: buildApp,
)
🔄 Breaking Changes
None - These changes are backward compatible. All new features are optional parameters.
📋 Migration Notes
No changes required for existing users. New features are disabled by default and preserve existing behavior.
Reviewer Notes: This PR has been thoroughly tested and adds new features without affecting existing functionality. During code review, special attention should be paid to the performance of new widgets and state management implementation.