Added #

• Desktop Devices: MacBook Pro 14" and Microsoft Surface Pro
  • MacBook Pro: 1512×982 logical pixels with realistic laptop body frame
  • Surface Pro: 1368×912 logical pixels with tablet/laptop hybrid design
  • Both include hinge, keyboard base, and shadow effects
• Apple Watch: Apple Watch Series 10 (45mm)
  • 198×242 logical pixels with rounded square display
  • Digital Crown and side button
  • Watch bands (top and bottom)
• Status Bar UI: iOS/Android style status bar with:
  • Time display (HH:MM format)
  • Signal strength bars
  • WiFi icon
  • Battery indicator
• Dark/Light Theme: Toggle between light (white) and dark (gray) backgrounds
  • Default theme is now light (white background)
  • Theme affects all UI elements (buttons, borders, text)
• Orientation Change: Portrait/landscape rotation for mobile devices
  • Dynamic Island/punch-hole camera rotates with device
  • Home indicator repositions correctly
  • Desktop and watch devices maintain natural orientation
• Split Screen/Device Buttons: Two separate buttons for clearer UX
  • "Screen" button for screen-only mode
  • "Device" button for device frame mode
  • Active state clearly highlighted
• Screenshot Button: Capture device frame as image
  • Uses RepaintBoundary for high-quality capture (3x pixel ratio)
  • Shows snackbar feedback when screenshot is taken
  • Callback onScreenshot provides the captured ui.Image
• Wrapper Toggle: Hide/show the entire device wrapper
  • "Hide" button in toolbar to disable wrapper
  • "Show Wrapper" floating button to re-enable
• Keyboard Shortcuts: Full keyboard control for all features
  • Ctrl+Shift+S: Take screenshot
  • Ctrl+Shift+R: Rotate device (portrait/landscape)
  • Ctrl+Shift+T: Toggle theme (light/dark)
  • Ctrl+Shift+D: Toggle device/screen mode
  • Ctrl+Shift+W: Toggle wrapper visibility
  • Ctrl+Shift+1-7: Select device (1=iPhone through 7=Watch)
• New enums: WrapperTheme, DeviceOrientation
• New DeviceConfig properties: isDesktop, isWatch
• New DeviceMode extensions: isDesktop, isWatch, category

Changed #

• DeviceMode enum: Added new values
  • macbook (MacBook Pro 14")
  • surface (Microsoft Surface Pro)
  • appleWatch (Apple Watch Series 10)
• UI Redesign: Device selector grouped by category (Phones, Tablets, Desktop, Watch)
• Bottom Toolbar: New unified toolbar with all controls
• Default background color changed from black to white (light theme)

Added #

• Screen Only for All Devices: Screen Only mode now works with any selected device
  • Toggle between Device frame and Screen Only mode using the new toggle button
  • Screen Only maintains the selected device's dimensions (iPhone, Galaxy S25, iPad, or Galaxy Tab)
• Separate Screen Only Toggle: New dedicated toggle button separated from device selector
  • Shows "Device" or "Screen" label to indicate current mode
  • Device selector remains active even in Screen Only mode

Fixed #

• Browser Zoom Compensation: Device size now stays consistent regardless of browser zoom level (Ctrl+/Ctrl-)
  • Device frame maintains the same visual size when zooming in or out
  • Uses devicePixelRatio compensation to counteract browser zoom

Changed #

• UI Toggle Redesign: Split into two parts
  • Device selector (iPhone, Galaxy, iPad, Tab) - 4 buttons
  • Screen/Device toggle - separate button on the right
• Device info label now shows device name even in Screen Only mode (e.g., "iPhone 16 Pro (Screen)")

Added #

• Samsung Galaxy S25: New device option with punch-hole camera style
  • Resolution: 384×832 logical pixels @ 2.8125x scale
  • Aspect ratio: ~1:2.17 (19.5:9)
• Samsung Galaxy Tab S9: New tablet device option
  • Resolution: 800×1280 logical pixels @ 2x scale
  • Aspect ratio: ~1:1.6 (10:16)
• Punch-hole camera design for Samsung phones
• isSamsung property in DeviceConfig for device-specific styling
• isPhone and isTablet getters in DeviceMode for easier device type checking
• shortName getter in DeviceMode for compact toggle display

Changed #

• DeviceMode enum: Renamed values for clarity
  • mobile → iphone (iPhone 16 Pro)
  • tablet → ipad (iPad Pro 11")
  • Added samsungPhone (Galaxy S25)
  • Added samsungTablet (Galaxy Tab S9)
• Mode Toggle UI: Updated to show 5 device options with distinct icons
  • iPhone (phone_iphone icon)
  • Galaxy S25 (phone_android icon)
  • iPad (tablet_mac icon)
  • Galaxy Tab (tablet_android icon)
  • Screen Only (crop_free icon)
• Improved Aspect Ratio: Fixed scaling bug where device appeared squished/gepeng on some laptops at 100% zoom
  • Now uses fixed SizedBox to enforce exact device dimensions
  • Scale calculation ensures proper aspect ratio is maintained

Fixed #

• Aspect Ratio Bug: Device frame now maintains correct proportions regardless of browser/window zoom level
• Reduced minimum scale from 0.3 to 0.1 for better fit on smaller screens

Added #

• Screen Only Toggle Button: Added dedicated toggle button for Screen Only mode in the mode switcher
  • Now shows 3 buttons: Mobile, Tablet, and Screen Only
  • Click directly on each mode instead of cycling through

Changed #

• Default Background Color: Changed from purple (#1A1A2E) to black (#000000) for cleaner appearance
• Mode switching now uses direct selection instead of cycling

Fixed #

• Fixed pub.flutter-io.cn validation issues:
  • Shortened package description to meet 60-180 character requirement
  • Applied Dart formatter to all source files

Added #

• Screen Only Mode: New DeviceMode.screenOnly option to display just the screen without device frame
  • Perfect for cleaner previews and documentation screenshots
  • Cycles through: Mobile → Tablet → Screen Only → Mobile

Fixed #

• Critical Fix: Fixed content rendering issue where app content appeared too zoomed in/large inside device frame
  • Removed incorrect FittedBox and devicePixelRatio multiplication that caused layout issues
  • MediaQuery now correctly reports device dimensions without scaling artifacts
  • Content now renders at proper size matching actual device dimensions

Changed #

• Simplified content rendering logic for more accurate device simulation
• Screen only mode uses clean rounded corners with subtle shadow

Added #

• Mobile Device Behavior: New mobileDeviceBehavior parameter to control how the wrapper behaves on real mobile devices (iOS/Android)
  • MobileDeviceBehavior.alwaysShowFrame: Always show the device frame
  • MobileDeviceBehavior.alwaysHideFrame: Always render child directly without frame
  • MobileDeviceBehavior.showToggle: Show a floating toggle button to let users choose (default)
• Floating "Show Device Frame" button when running on mobile devices
• "Hide Frame" button to exit device frame view on mobile
• Auto-detection of mobile platform (iOS/Android, excluding web)

Changed #

• Updated device configurations:
  • Mobile (iPhone 16 Pro): 393×852 logical pixels
  • Tablet (iPad Pro 11"): 834×1194 logical pixels
• Improved rendering with proper MediaQuery configuration

Changed #

• Updated device configurations with accurate specifications:
  • Mobile (iPhone 16 Pro): 393×852 logical pixels (1179×2556 @ 3x scale), border radius 55px, border width 12px
  • Tablet (iPad 10th Gen): 820×1180 logical pixels (1640×2360 @ 2x scale), border radius 18px, border width 14px
• Improved documentation with actual device physical and logical resolutions
• Added aspect ratio information to device configs

Fixed #

• Fixed all static analysis lint issues (6 issues resolved)
• Added const to constant values and TextStyle constructors for better performance

Added #

• Initial release of Device Wrapper
• DeviceWrapper widget for wrapping Flutter apps in device frames
• DeviceMode enum with mobile (iPhone 17 Pro) and tablet (iPad Gen 11) modes
• DeviceConfig class for customizing device appearance
• Auto-scaling to fit device within browser/window size
• Dynamic Island with camera lens effect for iPhone 17 Pro style
• Titanium gradient frame design with realistic bezels
• Mode toggle button with smooth animations
• Side buttons (power, volume, action button) for realistic appearance
• Home indicator bar
• Grid pattern background
• Device info label showing current mode and dimensions
• Support for custom configurations (dimensions, colors, shadows)
• enabled flag to disable wrapper for production builds
• onModeChanged callback for mode switch events

Device Configurations #

• Mobile (iPhone 17 Pro): 393×852, border radius 55px, border width 5px
• Tablet (iPad Gen 11): 820×1180, border radius 24px, border width 6px